Why is 0[0] syntactically valid in javascript?

原文链接

偶然在一篇帖子中看到了这个问题,所以打算记录一下。

var a = 0[0];
console.log(a); output:
a is undefined

上面这段代码就是问题的题干,非常简单的2行代码,问题的难点是是否能搞清楚 0[0] 这行代码到底干了什么。对于不熟悉js的人来说,会把 0[0]当成是数组索引,按照java或者c的经验,如果去索引一个 integer 类型的 0 ,是必然不行的,但是在js当中,没有任何异常发生,非常平滑的输出了 undefined, 其实这是一个js中的语法糖,但是又有一点障眼法的感觉,分析如下.

当进行 0[0] 运算的时候,js解析器会把第一个 0 当做一个 Number类的对象(自动装箱),然后去尝试获取方括号中的名称为 0 的属性,然而 Number 0 中必然是没有名字叫做 0 的属性的,所以得出的结果就是 undefined, 并且没有丝毫的语法错误.说它是障眼法,是因为根据惯例,如果我们要取一个对象中的属性的话,都是去用 . 这个符号进行索引某个对象的属性,但是在js当中,使用 [] 与使用 . 是一样的效果,所以说它是一个语法糖。

var a = 0.0;
console.log(a);

上面的代码和开篇的代码运行结果完全相同,js的这个特性可以和ruby进行类比,在ruby之中也是可以这么做的,这种语法叫做完全面向对象,貌似ES6中正在加强这种特性,理论上来说这也是在自动进行装箱操作,不过具体是如何解析代码的,就必须要去读源码才能知晓.

ES5.1中的获取对象属性的语法说明

Literal ::
NullLiteral
BooleanLiteral
NumericLiteral
StringLiteral
RegularExpressionLiteral PrimaryExpression :
this
Identifier
Literal
ArrayLiteral
ObjectLiteral
( Expression ) MemberExpression :
PrimaryExpression
FunctionExpression
MemberExpression [ Expression ]
MemberExpression . IdentifierName
new MemberExpression Arguments

所以我们可以这样获取属性

MemberExpression [ Expression ]
PrimaryExpression [ Expression ]
Literal [ Expression ]
NumericLiteral [ Expression ]

根据5.1的文档,我们这样使用 0[0] 也就是完全说的通的,完全没有任何语法错误.

NumericLiteral [ NumericLiteral ]
数字字面量[数字字面量]

关于js中的自动装箱,可以参见这篇文当,这篇文当主要讲述的就是js中的一般字面量在进行属性索引操作的时候,是如何自动装箱的,

关于ES5的文档,可以参见这里,

下面的代码也可以从侧面说明问题

0['toString']
output: function toString() { [native code] }

(全文完)

Why is 0[0] syntactically valid in javascript?的更多相关文章

  1. Bootstrap3.0学习教程十七:JavaScript插件模态框

    这篇文章中我们主要来学习一下JavaScipt插件模态框.在学习模态框之前,我们先来了解一下JavaScript插件吧. JavaScript插件概览 插件可以单个引入(使用Bootstrap提供的单 ...

  2. JavaScript中的两个“0” -0和+0

    JavaScript中的两个“0”(翻译)   本文翻译自JavaScript’s two zeros JavaScript has two zeros: −0 and +0. This post e ...

  3. elasticsearch-head-master下运行npm install报npm WARN elasticsearch-head@0.0.0 license should be a valid SPDX license expression

    2个月没有启动es和es配套服务,今天运行时,发现如下问题: 运行npm install 出现npm WARN elasticsearch-head@0.0.0 license should be a ...

  4. js正则表达式校验非负浮点数:^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0$

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 复利计算--结对项目<04-11-2016> 1.0.0 lastest 阶段性完工~

    结对项目:Web复利计算 搭档博客地址:25江志彬  http://www.cnblogs.com/qazwsxedcrfv/ 个人摘要: (2016-04-09-12:00)补充:之前传送门没做好, ...

  6. 搞定迅雷固件在TP-LINK WR720N,127.0.0.1 9000 获取不到激活码

    本帖最后由 exzzzipad 于 2014-7-2 22:33 编辑 基本情况:设备:TP-LINK WR720N目前固件:[antclan][20120825]720N-4M-NAS-withSA ...

  7. 解决org.openqa.selenium.WebDriverException: Unable to connect to host 127.0.0.1 on port 7055 after 45000 ms org.springframework.beans.BeanInstantiation

    解决方法为将selenium-server-standalone-2.37.0.jar升级至selenium-server-standalone-2.41.0.jar即可. 下载地址:http://s ...

  8. [JS8] 显示从(0,0)到(0,0)的坐标

    <html> <head> <title>JS Unleashed</title> </head> <body> <SCR ...

  9. Angular5.0.0新特性

    文章来自官网部分翻译https://blog.angular.io/version-5-0-0-of-angular-now-available-37e414935ced Angular5.0.0版本 ...

随机推荐

  1. poj 3687 Labeling Balls【反向拓扑】

    Labeling Balls Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 12246   Accepted: 3508 D ...

  2. POJ 2750 Potted Flower

    Potted Flower Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 3872   Accepted: 1446 Des ...

  3. syslog实例详解rsyslog

    http://blog.csdn.net/chenhao112358/article/details/40892239http://www.cnblogs.com/blueswu/p/3564763. ...

  4. 实例详解 EJB 中的六大事务传播属性--转

    前言 事务 (Transaction) 是访问并可能更新数据库中各种数据项的一个程序执行单元 (unit).在关系数据库中,一个事务可以是一条或一组 SQL 语句,甚至整个程序.它有通常被称为 ACI ...

  5. 2 - SQL Server 2008 之 使用SQL语句为现有表添加约束条件

    上一节讲的是直接在创建表的时候添加条件约束,但是有时候是在表格创建完毕之后,再添加条件约束的,那么这个又该如何实现? 其实,跟上一节所写的SQL代码,很多是相同的,只是使用了修改表的ALTER关键字及 ...

  6. 安装Visual Studio 2013 中文社区版

    Visual Studio 2013 免费了,我收到邮件后,立即从邮件的下载连接安装了 Visual Studio Community 2013 with Update 4 . 安装后几天没打开,今天 ...

  7. ASP.NET MVC 第四回 向View传值

    一.ViewData与TempData属性来向View页传递对象 上文中已经提到,使用ViewData可以将数据由Controller传递到View 在前文中我们建立了EiceController类  ...

  8. Unity3D GUI之自定义风格组件

    GUI中可以使用一些默认的组件,里面的最后一个参数一般情况下,不设置就是默认的 ,当然也可以进行手动的指定,比如: GUI.Button(new Rect(0,0,100,100),"开始游 ...

  9. CSS3 box-sizing 属性

    定义和用法 box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素. 例如,假如您需要并排放置两个带边框的框,可通过将 box-sizing 设置为 "border-box& ...

  10. 实现Android K的伪沉浸式

    在Android 5.0之后引入了MD风格,从而状态栏沉浸也成为了一种设计习惯.而停留在之Android L之前的Android系统则不能直接实现沉浸式,这里就介绍一下如何实现Android K系列的 ...