`

JavaScript的大括号的语义

 
阅读更多

转载:http://www.nowamagic.net/librarys/veda/detail/1016

Javascript中大括号"{}"有四种语义作用:

语义1. 组织复合语句,这是最常见的:

1 if( condition ) {
2   //...
3 }else {
4   //...
5 }
6 for() {
7   //...
8 }

语义2,对象直接量声明:

1 var obj = {
2     name : 'jack',
3     age : 23
4 };

整个是个赋值语句,其中的{name:'jack',age:23}是个表达式。

语义3,声明函数或函数直接量:

1 function f1(){
2     //...
3 }
4 var f2 = function(){
5     //...
6 }

f1与非f2的区别是前者在语法解释期,后者在运行期。区别在于:如果调用该函数的代码在函数定义之后,则没有区别;如果调用该函数的代码在函数定义之前,则f1仍然可以调用,f2则会报错,提示f2未定义。

语义4,结构化异常处理的语法符号:

1 try {
2     //...
3 }catch( ex ){
4     //...
5 }finally{
6     //...
7 }

这里的大括号与符合语句(语义1 )是有区别的,大括号中如果只有一条语句,在if/else/for等中大括号是可以省略的,但try/catch/finally则不能省略。

以下代码纠结了偶N久:

1 function(){}() //匿名函数立即执行, 语法分析期报
2 {}.constructor //获取对象直接量的构造器,语法分析期报错

令人不解的是为何[].constructor这么写却不报错呢,一个是想获取对象直接量的构造器,一个是获取数组直接量的构造器而已。

当然添加个变量接收也不会报错,var c = {}.constructor;

同样的情况如:var fn = function(){}(),也不会报错。

实际上是js的"语句优先"在作怪,即{}被理解成复合语句块(语义1 )而不是对象直接量(语义2 )或声明函数(语义3 )的语义。

function(){}(),大括号被理解成复合语句,自然前面的function()声明函数的语法不完整导致语法分析期出错。{}.constructor,大括号被理解成复合语句,大括号后面是点运算符,点运算符前没有合理的对象自然也报错。

修复方式众所周知:加个强制运算符()

(function(){})(),(function(){});//强制其理解为函数(语义3 ),"函数()"表示执行该函数,即声明后立即执行了。({}).constructor //({})强制把大括号理解成对象直接量(语义2 ),"对象.xx"表示获取对象的成员,自然后面的点运算符可以正常执行了。

function(){}(); 语法错误的原因和 ();函数调用运算符无关。

本质原因是, function(){} ,根据词法分析期对token的有效分组。function被看成这个ExpressionStatement 的start 位置的第一个token元素。这是EMCA262所不允许的。不允许的原因很明确,就是怕引起函数表达式和函数声明的歧义。你可以理解为 function 关键字永远不能在一个ExpressionStaement的首位。

来看看赋值语句f = function(){};

1 f : LeftHandSideExpression
2 = : AssignmentOperator

function(){};此时被看做是整个语句的赋值表达式部分即 AssignmentExpression。 所以他合理合法的通过了语法检查,成为了一个函数表达式.FunctionExpression.

所以这时候,即使你 f = function(){}(); 在语法上也是合法的。

分享到:
评论

相关推荐

    解析Javascript中大括号“{}”的多义性

    大括号在JavaScript中有多种不同的语义,主要包括以下几种: 1. 组织复合语句 这是大括号最常见的用途之一。在JavaScript中,我们使用大括号来组合多条语句形成一个复合语句(也称为代码块)。复合语句可以用于控制...

    解析Javascript小括号“()”的多义性

    在JavaScript编程语言中,小括号“()`”的多义性是其语法灵活性的一个关键特性。下面我们将详细探讨这五种不同的语义: 1. **函数声明时的参数列表**: 在JavaScript中,当你声明一个函数时,小括号用于包含函数的...

    Atom-atom-auto-prettier,基于窗口大小语义重新格式化javascript的atom包.zip

    这个插件名为"Atom Auto Prettier",它与"Prettier"代码风格化工具相结合,可以在用户编辑代码时根据窗口大小和语义规则自动进行代码美化。 Prettier是一款流行的代码格式化工具,它支持多种编程语言,包括...

    JavaScript 秘密花园.pdf

    但在ECMAScript5之前的版本中,使用关键字作为属性名(如`delete`)会导致`SyntaxError`,这是因为JavaScript解析器将关键字误识别为其自身的语义作用,而非属性名称。 《JavaScript的秘密花园》不仅是一份详尽的...

    网页编程基础(HTML;JAVASCRIPT)网页基础最快入门

    `<header>`、`<nav>`、`<main>`、`<article>`、`<aside>`、`<footer>`等语义标签有助于提升网页可读性和搜索引擎优化。 4. **CSS集成**:通过`<style>`标签或外部`<link>`引入CSS样式表,实现页面布局和视觉效果。 ...

    Javascript编码规范

    - 对象和数组初始化时应遵循一致的格式,如使用大括号`{}`和方括号`[]`。 - 正则表达式的创建应使用`new RegExp()`或正则字面量形式。 **3. 继承与异常处理** - 继承机制的实现应考虑设计模式的最佳实践。 - 异常...

    javascript enlightenment.pdf

    此外,书中还将“JavaScript对象”与“Object()对象”之间的语义差异进行了区分。 第二章“与对象和属性工作”中,读者将了解到复杂对象可以包含大多数JavaScript值作为属性。封装复杂对象的方式在程序上是有益的。...

    详谈构造函数加括号与不加括号的区别

    在实例化对象时,两者通常等价,但推荐使用括号以保持语义清晰。在调用构造函数上的方法时,正确的语法是根据上下文决定的,需要理解 `new` 关键字的用途以及如何正确地访问和调用对象的方法。理解这些细节对于编写...

    JavaScript语言精髓与编程实践(第二章).pdf

    在JavaScript中,标识符主要分为两大类:**语法关键字**和**变量**。语法关键字用来定义语言本身的结构,如`if`、`for`等,而变量则是用来存储值的容器。这种绑定的概念贯穿于JavaScript语言之中,具体分为以下几种...

    javascript的经典面试题汇总

    当尝试将一对空括号赋值给一个变量时,这实际上会导致语法错误,因为JavaScript引擎会尝试将其解释为函数调用,但又找不到任何函数来调用。因此,这会导致运行时错误。 - **选项B**: `var obj = [];` - **解析**:...

    比较详细的关于javascript中void(0)的具体含义解释.docx

    或者简化形式(虽然通常推荐使用带括号的形式以增强代码可读性): ```javascript void expression ``` 这里的`expression`可以是任何合法的JavaScript表达式。例如: ```javascript void 1 + 1; // 计算表达式但...

    javascript 的面试题

    ### JavaScript面试题解析 #### 一、单选题解析 **1. 以下哪条语句会产生运行错误** - **选项分析**: - A. `var obj=( );` 正确答案。圆括号 `()` 通常用于函数调用或者创建对象字面量时的包裹,此处使用空的圆...

    JSON (JavaScript Object Notation).zip

    JSON遵循RFC 7159和ECMAScript第5.1版标准,这些标准规定了JSON的语法和语义。 总结,JSON作为数据交换的主流格式,其简洁、易读、跨语言的特性使得它在现代Web开发中占据了重要地位。无论是从服务器端获取数据,...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part1.rar

     7.1.1 语义化XHTML和DOM   7.1.2 JavaScript和XMLHttpRequest对象   7.1.3 XML   7.1.4 一个可重用的对象   7.1.5 Ajax是正确的选择吗   7.2 为什么Ajax会破坏网站及如何解决   7.2.1 依赖...

    html5+css3+javascript5帮助文档

    HTML5、CSS3和JavaScript5是现代Web开发的三大核心技术,它们共同构建了丰富多彩的互联网界面和交互体验。本帮助文档集合旨在为初级到中级的Web开发者提供全面的学习和参考资料。 **HTML5** HTML5是超文本标记语言...

    基于HTML5+CSS3+JavaScript实现(图形界面)计算器【100011264】

    - **正则表达式**:在处理用户输入时,可能需要使用正则表达式来验证输入是否合法,例如检查括号是否匹配。 - **后缀表达式(逆波兰表示法)**:为了计算表达式的值,可以使用后缀表达式算法,这种方法避免了使用...

Global site tag (gtag.js) - Google Analytics