JavaScript小细节点罗列

Posted 2020-09-17

众所周知，javascript为属性的访问定义了两种语法方式：

表达式.标识符 // 表达式(指定对象)    标识符(指定需要访问的属性的名称)

表达式1(指定对象)　　

var O = {a:1,b:{c:3}}
var A = [O,4,[5,6,7]]

O.a //1
O.b.c //3
O["a"] //1
A[1] //4
A[0].b.c //3
A[2]["2"] //7

第一种方法我们使用点"."来进行属性的访问，第二种则是使用方括号来进行属性访问。其实如上我们就可以轻松发现两种方法的区别，第二种方法的方括号内也是一个表达式。

但是这两种方法的第一个表达式都是先进行计算的，如果计算结果是空或者未定义那么就会抛出错误，如果运算结果不是对象或者数组，JS会将其转化为对象（例如下面代码块的字符串）。

var str = "Hello World!";var world = s.substring(s.indexOf(" ")+1, s.length)

如果运算结果不是对象或者数组，JS会将其转化为对象=》有些人会奇怪，字符串不是对象，为什么它还具有属性？这是因为我们在进行属性访问的时候，JS就会将字符串调用 new String(str) 来转换成对象，而提供这个方法新创建的对象自然就继承（关于对象的继承可以查阅相关资料）了字符串的方法并且用来处理属性的引用。一旦属性引用结束了，这个新创建的对象就会被销毁。当然我这里只写了字符串的一个demo，数字布尔值也类似通过Number(),Boolean()构造函数来进行对象创建。

回到属性访问表达式，如果表达式后跟随"."和标识符，就会查找这个标识符所指定的属性的值没并将其作为整个表达式返回的值。如果对象表达式跟随一堆方括号，则会计算方括号内的表达式的值并将其转化为字符串，当然这两方法种如果访问的属性是不存在的。会返回undefine。

我们可以看出，使用"."+标识符的写法更加简单，并且我们有时候习惯了链式调用的时候更加喜欢"."，但是，需要注意的是，这种方式下，我们要访问的属性名必须是合法的。如果我们进行访问的属性名称是一个保留字，或者包含空格，或者是一个数字，或者是通过表达式计算得出的值，这时候的属性访问必须要使用方括号。

delete运算符

delete是一元运算符，我们可以使用它来删除对象属性或者数组元素。

delete希望他的操作数是一个左值，如果我们误用使得他的操作数不是一个左值，那么delete就不会进行任何操作并且返回true，当然并不是所有属性都是能够删除的，用户var声明的变量，自定义函数，函数参数，内置核心属性等是不能给删除的，删除非法会抛出错误。

这里插入补充下左值：所谓左值，简单点说就是可以被赋值的表达式，在ES规范中是用内部类型引用(Reference)描述的，其作用为存放数据空间，且存放是允许的。比如这里的属性访问表达式。

虽然delete运算符可以删除对象的属性，但是我们要知道，delete其实只是断开了属性和宿主对象的联系，而不会操作属性中的属性。而且delete运算符只能删除自有属性，不能删除继承属性。

a = { b:{c:1} };
d = a.b;delete a.b;
console.log(d.c) //结果仍旧是1，可以看出delete其实只是断开可属性和宿主对象的联系并没有将其销毁

o = {a:1};delete o.a; //删除属性a并返回truedelete o.x; //因为a属性不存在，什么都不做并返回truedelete o.toString; //因为toString是继承来的，什么都不做并返回truedelete 110; //没有意义，返回truedelete Object.prototype; //返回falsevar b = 1;delete this.b; //返回falsefunction f(){};delete this.f; //返回false

 逻辑运算符

运算符	示例	说明
逻辑与 (&&)	expr1&&expr2	如果expr1 能转换成false则返回expr1,否则返回expr2. 因此, 在Boolean环境中使用时, 两个操作结果都为true时返回true,否则返回false.
逻辑或 (||)	expr1||expr2	如果expr1能转换成true则返回expr1,否则返回expr2. 因此,在boolean环境(在if的条件判断中)中使用时, 二者操作结果中只要有一个为true,返回true;二者操作结果都为false时返回false.
逻辑非(!)	!expr	如果单个表达式能转换为true的话返回false,否则返回true.

在JS计算逻辑中我们在使用逻辑运算符会有一个短路原理。如下

var e = a && 1; //1
var f = b && 1; //false

上面代码块的变量c赋值时，a和1都是真，但是因为js的短路原理，在逻辑或中只要排在前面的a为真，那么后面的1就会直接忽略，排在前面的操作数为假才会计算到后面的操作数。同理在使用逻辑与时，只要排在前面的操作数是为假，那么js就会直接忽略后面的操作数而让运算结果直接为false，如果前面的操作数为真，就会继续计算后面的操作数，最后如果后面操作数为真，赋值的才是后面的操作数。

var a = 真1 || 真2 //真1var b = 假 || 真3 //真3var c = 真4 && 真5 //真5var d = 假 && 真6 //假