[关闭]
@student2018 2018-10-13T08:46:08.000000Z 字数 3957 阅读 472

面向对象的JS

前端


- 使用chrome里面的console,shift+Enter可以不立即执行本行的代码

变量

 变量的类型

  1. Number 1, 1.2
  2. String 'abc' "abc"
  3. Boolean true or false
  4. Undefined 未赋值的变量 或 不存在的变量
  5. Null 一个特殊的值,表示空值
  6. Object 不属于上面的类型之外的,都属于对象

typeof 运算符 可以显示出变量的数据类型
NaN 是一个特殊的数字值,表示不是一个数字
Nunber.isNaN() 判断一个变量是不是NaN
ES6 isInteger() 判断一个变量是不是整数
parseInt("11",2)
typeof NaN
'number'
== ===的区别
前者在比对前先做类型转换,转成相同的数据类型进行转换。
后者只有在数据类型和值都相同的情况下才是相等的。
NaN == NaN
return false
var a=[];
var a=[1,2,3];
var b=1;
result='';
switch(a) {
case 1:
result='Number 1';
break;
case 2:
result='Number 2';
break;
default:
result='I don't know';
break;
}

变量类型转换 

#the special value arguments 函数内置一个自动创建的变量arguments 表示函数接收的参数
function args(){
  return arguments;
}

预定义函数:ES6
parseInt
parseFloat
isNaN
isFinite
encodeURI
decodeURI
eval

var a=123;
function f(){
alert(a); //undefined
var a=1;
alert(a);//1
}

JS 函数中,本地域比全局域更加重要,本地变量把全局变量的值重写了。
当一个js程序执行进入到一个新的函数,所有在函数内定义的变量都会被提到函数的头部,一定要牢记这一点。
而且,仅有变量的声明被提前了,而赋值操作还是在它出现的位置。
前面的函数可以写成如下的。
var a=123;
function f(){
var a;
alert(a);
a=1;
alert(a);
}
这样就很清楚为什么第一个值是undefined.

(
function(){
alert('boo');
}
)();

第二个()表示立即执行函数,并可以传入函数需要的参数。
适合初始化任务的操作和执行一次的操作。

 闭包

JS中的闭包如何理解?
打包变量原有作用域限制的一种形式
例子1
把内置函数闭包
把内置函数作为函数本身的返回值,
然后它就成了全局变量
但还是可以访问函数内部的所有变量
例子2
同上,把函数内的函数赋给一个全局
变量
例子3
循环中的闭包

对象

javascripts中,关联数组,用
object 来表示。

var a = new Object();
var a = object();
第一个返回值是一个对象,
第二个返回值是undefined;
a instanceof Object
true
var a={x:100}
var b={x:100}
a === b //false
a == b //false

对象特性和属性

每一个对象都有一些特性,每一个特性都有一个键和属性集(attributes).
特性的状态保存在这些属性里。
所有的特性都有以一下属性:

  1. Enumerable(boolean)
    它表示是否可以枚举对象的特性,
    默认情况下系统特性是不可以枚举的,而用户自定义特性是可以枚举的。
  2. Configurable(boolean)
    如果是false,表示特性不能被删除或修改。
    let obj={age : 25 }
    console.log(
    Object.getOwnPropertyDescriptor(obj,'age'_)
    )
    可以使用Object.defineProperty()
    方法来定义对象的属性。

JS中的深拷贝如何实现?

let config  =   {   
server: 'localhost',    
port:   '8080', 
timeout:    900,
}
let {server,port} = config;
console.log(server,port);

var a = new Array(5)
//length of array is 5
// five undefined value in Array
a.push(10)
b=a.pop()
console.log(b) //10
a.join() //用逗号连接所有值
a.sort() //按字符排序不是数值
a.forEach(function(name){});//
遍历数组中的每一个值

js 中日期类型如何进行运算操作?
js中使用perl5的语法来操作正则表达式。
match
replace
split
test
can use //
;
var s="HelloJavaScript";
s.match(/a/g)
s.replace(/a/g,'A')
s.replace(/[A-Z]/,'_&')& stand for the matched text;

JS的原型链
prototype
ES6中,JS越来越像java的语法。

BOM
DOM
JS
BOM是一组对象,用于访问浏览器和屏幕本身,这些对象通过全局对象
window来访问。

setTimeout() //execution once
setInterval()//repeart
//unit is millseconds

最小化全局变量的一个方面是,
你定义一个唯一的全局变量,
然后把你写的代码都挂在这个变量下面。
var myapp={};
myapp.func1={};
myapp.flight=10;

函数可以访问它被创建时的上下文环境,这叫闭包。
通过使用函数去产生模块,我们可以
消除全局变量的影响。
javaScript中的单例就是用对象字面量表示法创建的对象。

CSS
命名要有意义,要根据它们是什么来命名,而不是他们的外观如何来命名。
例如通知类型,则命名为notification,
而不是红色,黄色。而是error or warnning.
命名规则,区分大小写的,
建议使用全小写然后单词之间使用连接符。

div 实际上代表division.
它可以把文档切分成几个有意义的区域。

使用正确的元素来表达页面。

div 可以用来对块级元素进行分组。
而span可以用来对行内元素进行分组
或标识;
我们的目标是:
让代码尽可能简洁和有意义。

html4.0和xhtml1.0的区别在于后者遵守xml的编码约定。
所有的xhtml属性必须包含引号,
所有的元素必须是封闭的。
xhtml1.1是作为xml发送给浏览器的。
现在流行的是html5.
它引入了更多结构性的元素,

header
nav,
article
sections
footer

firefox
Firefox web developers extension

有效且结构良好的文档为你要应用的样式提供了一个框架。
要想使用CSS将样式应用到特定的元素,需要找到这个元素,在CSS中,执行这样任务的样式规则称为选择器。
元素选择器 p h1
类选择器 .warning
伪类:
a:link{color:blue}
a:visited{color:green}
a:hover,a:focus,a:active{color:red}
这些:link ,:visited称为链接伪类,只能应用于锚元素。
:hover,:active,:focus 是动态伪类,可用于任何元素。
* 可以匹配所有元素
属性选择器 根据元素的属性选择
例如鼠标放到具有title属性的元素上时,可以显示他的内容。
a[title] {}
a[title]:hover{}
样式冲突处理:
CSS通过层叠来处理
层叠给每一个规则分配一个重要度。
如果你遇到了一个似乎没有作用的CSS规则,很要能是出现了特殊性冲突,请在你的选择器中添加一个父元素的ID,从而提升它的特殊性。
为了计算规则的特殊性,给每一种选择器分配一个数字值,然后将规则的每一个选择器的值加在一起,计算出规则的特殊性。
应用样式的元素的后代会继承样式的某些属性。
rel="stylesheet" type="text/css" />
@import url(/css/layout.css)
导入样式表比链接方式慢。

可视化格式模型
浮动 定位 盒模型
这些概念控制在页面上安排和显示元素的方式,形成CSS的基本布局。

盒模型是CSS的基石之一,它指定元素如何显示以及如何相互交互。
页面上的每一个元素被看作是一个矩形框,这个框由元素的内容,内边矩,边框和外边距组成。
内边距,边框和外边距都是可选的,
默认值是0;但是,许多元素将用户代理样式表设置外边距和内边距。
可以将元素的margin,padding设置为0来.

!connect jdbc:hive2://localhost:10000/

find . -name "*.jar" -exec jar -t -f {} \; | grep "Hive2DatabaseMeta"

document 是一个全局对象,搜索此变量,必须遍历整个作用域链,
建议如果多次使用它,先把它赋给一个局部变量中使用。
HTML5 元素是元素的第一个子元素,定义了元素的标题。
元素规定输入域的选项列表。
属性规定 form 或 input 域应该拥有自动完成功能。当用户在自动完成域中开始输入时,浏览器应该在该域中显示填写的选项:
使用 元素的列表属性与 元素绑定.
html5 提供了一些常用的input类型,之前的时候都是通过自己js来控制或验证,
现在浏览器自己支持,如邮箱,URL,日期,数字等。
使用WebSocket技术,后台可以随时向前端推送消息,以此保证前后台状态统一,这在传统的无状态HTTP协议中无法做到。
ctrl shift +r 可以查找更多的对象,可以是除了类型外的其他文件如xml文件.

添加新批注
在作者公开此批注前,只有你和作者可见。
回复批注