javascript温习(一)

#基本语法

语句

javascript程序的执行单位为行(line),也就是一行一行地执行.
var a=1+3;
解释:var命令声明变量a 然后将1+3的运算结果赋值给变量a.

1 + 3叫做表达式（expression），指一个为了得到返回值的计算式。语句和表达式的区别在于，前者主要为了进行某种操作，一般情况下不需要返回值；后者则是为了得到返回值，一定会返回一个值。凡是 JavaScript 语言中预期为值的地方，都可以使用表达式。比如，赋值语句的等号右边，预期是一个值，因此可以放置各种表达式.
语句进行某种操作不需要返回值 类似于void
表达式一定会返回一个值

分号前面可以没有任何内容，JavaScript 引擎将其视为空语句。
语句以分号结尾，一个分号就表示一个语句结束。多个语句可以写在一行内。
;;;标识三个空语句
表达式不需要分号结尾。一旦在表达式后面添加分号，则 JavaScript 引擎就将表达式视为语句，这样会产生一些没有任何意义的语句。
##变量提升
javascript引擎的工作方式是,先解析代码,获取所有被声明的变量,然后在一行一行的执行.
即:即便声明变量在语句以后,也可以正常运行
console.log(a);
var a = 1;
可以正常打印
注意这种情况 a被声明了,但是赋值在打印之后,所以输出结果为undefined
var a;
console.log(a);
a=1;

三元云算符号?:

JavaScript 还有一个三元运算符（即该运算符需要三个运算子）?:，也可以用于逻辑判断。(条件) ? 表达式1 : 表达式2

break语句和continue语句

break语句和continue语句都具有跳转作用,可以是代码可以不按照既有顺序执行
break语句用于跳出代码块或者循环.
continue用于立即终止当前循环,返回循环头从下一轮循环开始

标签(label)

遇到具体情况再解决

数据类型

概述

简介

1.数值(number)
2.字符串(string)
3.布尔型(boolean)
4.undefined未定义
5.null 标识空
6.对象(object) :各种值组成的集合
对象是最复杂的数据类型，又可以分成三个子类型。
狭义的对象（object）
数组（array）
函数（function）

typeof 运算符

返回一个值的数据类型
typeof 123 // "number"
typeof '123' // "string"
typeof false // "boolean"  

1.函数返回
function f() {}
typeof f
// “function”
2.undefined返回undefined
typeof undefined
// “undefined”
利用判断undifined类型进行判断 变量v没有使用var声明,直接使用会报错,如果使用typeof v则会返回unifined

v// ReferenceError: v is not defined

typeof v

// “undefined”

实际代码中的判断语句

// 错误的写法

if (v) {

// …

}

// ReferenceError: v is not defined

// 正确的写法

if (typeof v === “undefined”) {

// …

}

3.对象返回object
typeof window // “object”
typeof {} // “object”
typeof [] // “object”

上面代码中，空数组（[]）的类型也是object，这表示在 JavaScript 内部，数组本质上只是一种特殊的对象。这里顺便提一下，instanceof运算符可以区分数组和对象。instanceof运算符的详细解释，请见《面向对象编程》一章

var o = {};//object
var a = [];//object
o instanceof Array // false
a instanceof Array // true
typeof null // "object"

null, undefined 和布尔值

null、undefined

null是一个表示“空”的对象，转为数值时为0；undefined是一个表示"此处无定义"的原始值，转为数值时为NaN

null表示空值，即该处的值现在为空。调用函数时，某个参数未设置任何值，这时就可以传入null，表示该参数为空。比如，某个函数接受引擎抛出的错误作为参数，如果运行过程中未出错，那么这个参数就会传入null，表示未发生错误。
undefined表示“未定义”，下面是返回undefined的典型场景。

// 变量声明了，但没有赋值

var i;

i // undefined

// 调用函数时，应该提供的参数没有提供，该参数等于 undefined

function f(x) {

return x;

}

f() // undefined

// 对象没有赋值的属性

var  o = new Object();

o.p // undefined

// 函数没有返回值时，默认返回 undefined

function f() {}

f() // undefined

布尔型

如果 JavaScript 预期某个位置应该是布尔值，会将该位置上现有的值自动转为布尔值。转换规则是除了下面六个值被转为false，其他值都视为true。  
undefined  
null  
false  
0     
NaN  
""或''（空字符串）  

布尔型流程example

if(’’){

console.log(‘true’);

}//没有任何输出

上面代码中，if命令后面的判断条件，预期应该是一个布尔值，所以 JavaScript 自动将空字符串，转为布尔值false，导致程序不会进入代码块，所以没有任何输出。
注意，空数组（[]）和空对象（{}）对应的布尔值，都是true。

if ([]) {

console.log(‘true’);

}// true

if ({}) {

console.log(‘true’);

}// true

##字符串
如果长字符串必须分成多行，可以在每一行的尾部使用反斜杠。
var longString = ‘Long \
long \
long \
string’;
longString
// “Long long long string”
###转移

需要记住参考使用

• \0 ：null（\u0000）

• \b ：后退键（\u0008）

• \f ：换页符（\u000C）

• \n ：换行符（\u000A）
• \r ：回车键（\u000D）
• \t ：制表符（\u0009）
• \v ：垂直制表符（\u000B）
• ’ ：单引号（\u0027）
• " ：双引号（\u0022）
• \ ：反斜杠（\u005C）

反斜杠还有三种特殊用法。
（1）\HHH
反斜杠后面紧跟三个八进制数（000到377），代表一个字符。HHH对应该字符的 Unicode 码点，比如\251表示版权符号。显然，这种方法只能输出256种字符。
（2）\xHH
\x后面紧跟两个十六进制数（00到FF），代表一个字符。HH对应该字符的 Unicode 码点，比如\xA9表示版权符号。这种方法也只能输出256种字符。
（3）\uXXXX
\u后面紧跟四个十六进制数（0000到FFFF），代表一个字符。XXXX对应该字符的 Unicode 码点，比如\u00A9表示版权符号。

下面是这三种字符特殊写法的例子。

’\251’ // “©”

‘\xA9’ // “©”

‘\u00A9’ // “©”

‘\172’ === ‘z’ // true

‘\x7A’ === ‘z’ // true

‘\u007A’ === ‘z’ // true

如果在非特殊字符前面使用反斜杠，则反斜杠会被省略。

‘\a’// “a”

字符集

JavaScript 使用 Unicode 字符集。JavaScript 引擎内部，所有字符都用 Unicode 表示。
JavaScript 不仅以 Unicode 储存字符，还允许直接在程序中使用 Unicode 码点表示字符，即将字符写成\uxxxx的形式，其中xxxx代表该字符的 Unicode 码点。比如，\u00A9代表版权符号。
var s = '\u00A9';
s // "©"
解析代码的时候，JavaScript 会自动识别一个字符是字面形式表示，还是 Unicode 形式表示。输出给用户的时候，所有字符都会转成字面形式。
var f\u006F\u006F = 'abc';
foo // "abc"    
上面代码中，第一行的变量名foo是 Unicode 形式表示，第二行是字面形式表示。JavaScript 会自动识别。
我们还需要知道，每个字符在 JavaScript 内部都是以16位（即2个字节）的 UTF-16 格式储存。也就是说，JavaScript 的单位字符长度固定为16位长度，即2个字节。
但是，UTF-16 有两种长度：对于码点在U+0000到U+FFFF之间的字符，长度为16位（即2个字节）；对于码点在U+10000到U+10FFFF之间的字符，长度为32位（即4个字节），而且前两个字节在0xD800到0xDBFF之间，后两个字节在0xDC00到0xDFFF之间。举例来说，码点U+1D306对应的字符为?，它写成 UTF-16 就是0xD834 0xDF06。
JavaScript 对 UTF-16 的支持是不完整的，由于历史原因，只支持两字节的字符，不支持四字节的字符。这是因为 JavaScript 第一版发布的时候，Unicode 的码点只编到U+FFFF，因此两字节足够表示了。后来，Unicode 纳入的字符越来越多，出现了四字节的编码。但是，JavaScript 的标准此时已经定型了，统一将字符长度限制在两字节，导致无法识别四字节的字符。上一节的那个四字节字符?，浏览器会正确识别这是一个字符，但是 JavaScript 无法识别，会认为这是两个字符。
'?'.length // 2
上面代码中，JavaScript 认为?的长度为2，而不是1。

总结一下，对于码点在U+10000到U+10FFFF之间的字符，JavaScript 总是认为它们是两个字符（length属性为2）。所以处理的时候，必须把这一点考虑在内，也就是说，JavaScript 返回的字符串长度可能是不正确的

Base64 转码

有时，文本里面包含一些不可打印的符号，比如 ASCII 码0到31的符号都无法打印出来，这时可以使用 Base64 编码，将它们转成可以打印的字符。另一个场景是，有时需要以文本格式传递二进制数据，那么也可以使用 Base64 编码。

所谓 Base64 就是一种编码方法，可以将任意值转成 0～9、A～Z、a-z、+和/这64个字符组成的可打印字符。

使用它的主要目的，不是为了加密，而是为了不出现特殊字符，简化程序的处理。
JavaScript 原生提供两个 Base64 相关的方法。
btoa()：任意值转为 Base64 编码
atob()：Base64 编码转为原来的值
var string = 'Hello World!';
btoa(string) // "SGVsbG8gV29ybGQh"
atob('SGVsbG8gV29ybGQh') // "Hello World!"
注意，这两个方法不适合非 ASCII 码的字符，会报错。
btoa('你好') // 报错
要将非 ASCII 码字符转为 Base64 编码，必须中间插入一个转码环节，再使用这两个方法。
function b64Encode(str) {
  return btoa(encodeURIComponent(str));
}
function b64Decode(str) {
  return decodeURIComponent(atob(str));
}
b64Encode('你好') // "JUU0JUJEJUEwJUU1JUE1JUJE"
b64Decode('JUU0JUJEJUEwJUU1JUE1JUJE') // "你好"

对象

对象概述

1.4表达式还是语句？

代码:{ foo: 123 }  
JavaScript 引擎读到上面这行代码，会发现可能有两种含义。第一种可能是，这是一个表达式，表示一个包含foo属性的对象；第二种可能是，这是一个语句，表示一个代码区块，里面有一个标签foo，指向表达式123
为了避免这种歧义，JavaScript 引擎的做法是，如果遇到这种情况，无法确定是对象还是代码块，一律解释为代码块。
{ console.log(123) } //123

要解释为对象
在大括号前加上圆括号。因为圆括号的里面，只能是表达式，所以确保大括号只能解释为对象。

({ foo: 123 }) // 正确  
({ console.log(123) }) // 报错

在eval语句（作用是对字符串求值）中反映得最明显。

eval('{foo: 123}') // 123
eval('({foo: 123})') // {foo: 123}
上面代码中，如果没有圆括号，eval将其理解为一个代码块；加上圆括号以后，就理解成一个对象。

属性操作

####2.1属性读取

读取对象的属性，有两种方法，一种是使用点运算符，还有一种是使用方括号运算符。
var obj = {
  p: 'Hello World'
};
obj.p // "Hello World"
obj['p'] // "Hello World"
上面代码分别采用点运算符和方括号运算符，读取属性p。
请注意，如果使用方括号运算符，键名必须放在引号里面，否则会被当作变量处理。
var foo = 'bar';
var obj = {
  foo: 1,
  bar: 2
};
obj.foo  // 1
obj[foo]  // 2
上面代码中，引用对象obj的foo属性时，如果使用点运算符，foo就是字符串；如果使用方括号运算符，但是不使用引号，那么foo就是一个变量，指向字符串bar。方括号运算符内部还可以使用表达式。
obj['hello' + ' world']
obj[3 + 3]
数字键可以不加引号，因为会自动转成字符串。
var obj = {
  0.7: 'Hello World'
};
obj['0.7'] // "Hello World"
obj[0.7] // "Hello World"
上面代码中，对象obj的数字键0.7，加不加引号都可以，因为会被自动转为字符串。注意，数值键名不能使用点运算符（因为会被当成小数点），只能使用方括号运算符。
var obj = {
  123: 'hello world'
};
obj.123 // 报错
obj[123] // "hello world"
上面代码的第一个表达式，对数值键名123使用点运算符，结果报错。第二个表达式使用方括号运算符，结果就是正确的。

####2.2属性查看

查看一个对象本身的所有属性，可以使用Object.keys方法。
var obj = {
  key1: 1,
  key2: 2
};
Object.keys(obj);
// ['key1', 'key2']

####2.3删除属性

delete命令用于删除对象的属性，删除成功后返回true。

var obj = { p: 1 };

Object.keys(obj) // [“p”]

delete obj.p // true

obj.p // undefined

Object.keys(obj) // []

上面代码中，delete命令删除对象obj的p属性。删除后，再读取p属性就会返回undefined，而且Object.keys方法的返回值也不再包括该属性。

var obj = {};

delete obj.p // true

注意，删除一个不存在的属性，delete不报错，而且返回true 上面代码中，对象obj并没有p属性，但是delete命令照样返回true。因此，不能根据delete命令的结果，认定某个属性是存在的

只有一种情况，delete命令会返回false，那就是该属性存在，且不得删除

var obj = Object.defineProperty({}, ‘p’, {
value: 123,
configurable: false
});
obj.p // 123
delete obj.p // false

上面代码之中，对象obj的p属性是不能删除的，所以delete命令返回false（关于Object.defineProperty方法的介绍，请看《标准库》的 Object 对象一章）。
另外，需要注意的是，delete命令只能删除对象本身的属性，无法删除继承的属性（关于继承参见《面向对象编程》章节）。

var obj = {};
delete obj.toString // true
obj.toString // function toString() { [native code] }

上面代码中，toString是对象obj继承的属性，虽然delete命令返回true，但该属性并没有被删除，依然存在。这个例子还说明，即使delete返回true，该属性依然可能读取到值。

####2.4属性是否存在：in 运算符

in运算符用于检查对象是否包含某个属性（注意，检查的是键名，不是键值），如果包含就返回true，否则返回false。它的左边是一个字符串，表示属性名，右边是一个对象。
var obj = { p: 1 };
'p' in obj // true
'toString' in obj // true
in运算符的一个问题是，它不能识别哪些属性是对象自身的，哪些属性是继承的。就像上面代码中，对象obj本身并没有toString属性，但是in运算符会返回true，因为这个属性是继承的。
这时，可以使用对象的hasOwnProperty方法判断一下，是否为对象自身的属性。
var obj = {};
if ('toString' in obj) {
  console.log(obj.hasOwnProperty('toString')) // false
}

####2.5属性的遍历：for…in 循环

for…in循环用来遍历一个对象的全部属性。

var obj = {a: 1, b: 2, c: 3};

for (var i in obj) {

console.log(‘键名：’, i);

console.log(‘键值：’, obj[i]);

}

// 键名： a

// 键值： 1

// 键名： b

// 键值： 2

// 键名： c

// 键值： 3

for…in循环有两个使用注意点。

它遍历的是对象所有可遍历（enumerable）的属性，会跳过不可遍历的属性。  它不仅遍历对象自身的属性，还遍历继承的属性

举例来说，对象都继承了toString属性，但是for…in循环不会遍历到这个属性。

var obj = {};

// toString 属性是存在的

obj.toString // toString() { [native code] }

for (var p in obj) {

console.log§;

} // 没有任何输出

上面代码中，对象obj继承了toString属性，该属性不会被for…in循环遍历到，因为它默认是“不可遍历”的。关于对象属性的可遍历性，参见《标准库》章节中 Object 一章的介绍。

如果继承的属性是可遍历的，那么就会被for…in循环遍历到。但是，一般情况下，都是只想遍历对象自身的属性，所以使用for…in的时候，应该结合使用hasOwnProperty方法，在循环内部判断一下，某个属性是否为对象自身的属性。

var person = { name: ‘老张’ };

for (var key in person) {
if (person.hasOwnProperty(key)) {
console.log(key);
}
}/ name

3.0with 语句

with 语句
with语句的格式如下：
with (对象) {
  语句;
}
它的作用是操作同一个对象的多个属性时，提供一些书写的方便。
// 例一
var obj = {
  p1: 1,
  p2: 2,
};
with (obj) {
  p1 = 4;
  p2 = 5;
}
// 等同于
obj.p1 = 4;
obj.p2 = 5;
// 例二
with (document.links[0]){
  console.log(href);
  console.log(title);
  console.log(style);
}
// 等同于
console.log(document.links[0].href);
console.log(document.links[0].title);
console.log(document.links[0].style);
注意，如果with区块内部有变量的赋值操作，必须是当前对象已经存在的属性，否则会创造一个当前作用域的全局变量。
var obj = {};
with (obj) {
  p1 = 4;
  p2 = 5;
}
obj.p1 // undefined
p1 // 4
上面代码中，对象obj并没有p1属性，对p1赋值等于创造了一个全局变量p1。正确的写法应该是，先定义对象obj的属性p1，然后在with区块内操作它。
这是因为with区块没有改变作用域，它的内部依然是当前作用域。这造成了with语句的一个很大的弊病，就是绑定对象不明确。
with (obj) {
  console.log(x);
}
单纯从上面的代码块，根本无法判断x到底是全局变量，还是对象obj的一个属性。这非常不利于代码的除错和模块化，编译器也无法对这段代码进行优化，只能留到运行时判断，这就拖慢了运行速度。因此，建议不要使用with语句，可以考虑用一个临时变量代替with。
with(obj1.obj2.obj3) {
  console.log(p1 + p2);
}
// 可以写成
var temp = obj1.obj2.obj3;
console.log(temp.p1 + temp.p2);