资讯专栏INFORMATION COLUMN

JavaScript小细节点罗列(1)

I_Am / 901人阅读

摘要:一旦属性引用结束了,这个新创建的对象就会被销毁。回到属性访问表达式,如果表达式后跟随和标识符,就会查找这个标识符所指定的属性的值没并将其作为整个表达式返回的值。而且运算符只能删除自有属性,不能删除继承属性。真真真假真真真真真假真假未完待续

属性访问表达式

众所周知,JavaScript为属性的访问定义了两种语法方式:

表达式.标识符
表达式(指定对象),标识符(指定需要访问的属性的名称)
表达式[表达式]
表达式1(指定对象),表达式2(指定需要访问的属性的名称或者要访问数组的索引)

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并返回true
delete o.x; //因为a属性不存在,什么都不做并返回true
delete o.toString; //因为toString是继承来的,什么都不做并返回true
delete 110; //没有意义,返回true

delete Object.prototype; //返回false
var b = 1;
delete this.b; //返回false
function 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 a = true;
var b = false;
var c = a || 1; //true
var d = b || 1; //1
var e = a && 1; //1
var f = b && 1; //false

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

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

未完待续~~~~

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/94913.html

相关文章

  • 几种Ajax技术

    摘要:今天我来谈谈技术。我简要罗列一下几种常见的技术动态脚本注入和图片信标技术接下来我简要谈谈我对这几种技术的理解。该特性可以实现无阻塞加载脚本技术。和动态脚本注入类似,技术也有可跨域和无法发送非请求的问题。目前使用最多的技术手段就是利用技术。 今天我来谈谈Ajax技术。 Ajax是一种与服务器通信而无需重载页面的方法。数据可以从服务器获取或者发给服务器。 Ajax和异步分不开,但是本文重点...

    Nosee 评论0 收藏0
  • JavaScript中的各种语句...

    摘要:语句语句概述在中语句使用分号进行分隔可以在每行编写一条语句也可以在每行编写多条语句语句块中使用一堆花括号表示一个语句块使用语句块为语句进行分组这样使语句的结构清晰明了空语句空语句允许包含条语句解释器执行空语句时不会执行任何动作流程控制语句解 语句 语句概述 在JavaScript中 语句使用分号(;)进行分隔 可以在每行编写一条语句 也可以在每行编写多条语句 语句块 JavaScrip...

    lijy91 评论0 收藏0
  • 全栈最后一公里 - Node.js 项目的线上服务器部署与发布

    摘要:没有耐心阅读的同学,可以直接前往学习全栈最后一公里。我下面会罗列一些,我自己录制过的一些项目,或者其他的我觉得可以按照这个路线继续深入学习的项目资源。 showImg(https://segmentfault.com/img/bVMlke?w=833&h=410); 本文技术软文,阅读需谨慎,长约 7000 字,通读需 5 分钟 大家好,我是 Scott,本文通过提供给大家学习的方法,...

    Nosee 评论0 收藏0

发表评论

0条评论

I_Am

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<