javascript的 {} 语句块详解

今日学习解析json字符串,用到了一个eval()方法,解析字符串的时候为什么需要加上括号呢?摸不着头脑。原来javascript中{}语句块具有二义性,不加括号会出错,理解这种二义性对我们理解javascript代码有极大帮助。

一、{}语句块的两个含义

表示语句块

a. 在javascript中可以使用{}来括起代码,在编辑器中方便管理代码。因为javascript并没有块级作用域,所以这种写法是无害的。

{
//some code...
}

b. 在javascript中 ,条件判断语句,循环语句,函数都需要{}语句块来整合代码

对象字面量

var box = {
  name:'kuoaho',
  age:21
}

//此时[code]作为表达式,可以赋值给一个变量
//其实对象字面量就是可以生成对象值的表达式

二、那如果对象字面量不作为一个赋值表达式,会发生什么情况呢?

example:

  {name:'kuoao'}    //没有报错,但是也没有创建对象
  {name:'kuohao',age}  //报错

由上面可以看出对象字面量只能够作为表达式赋值,第一种写法没有错,只是javascript将它作为一个label语句解析了。

analysis:

  {name:'kuoao'}

    //{}一个语句块
   // name:'kuohao',一个label语句,用于标记for循环

三、但是问题又来了……

{
name:'kuohao',
age:21
}

//这样为什么会报错?这不是对象字面量的写法吗?
因为javascript中{}的二义性,{}不仅仅被认为是对象字面量而且还会被认为是代码块。

analysis:
  {
  name:'kuohao',
  age:21
  }

一个代码块,两条label语句,如果没有逗号,是完全没有问题的,所以关键在于逗号,两条语句的分隔应该使用分号,所以javascript会判定这是语法错误

四、正确的写法

({
  name:'kuohao',
  age:21
  })

  //正确的写法

()会把语句转换成表达式,称为语句表达式,对象字面量不是表达式吗?为什么还需要()来转换?

加上括号以后,就可以消除这种二义性,因为括号里的代码都会被转换为表达式求值并且返回,因此语句块也就变成了对象字面量,也可以得出,对象字面量必须作为表达式而存在

(0)

相关推荐

  • js 中{},[]中括号,大括号使用详解

    一.{ } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或是函数. 如:var LangShen = {"Name":"Langshen","AGE":"28"}; 上面声明了一个名为"LangShen"的对象,多个属性或函数用,(逗号)隔开,因为是对象的属性, 所以访问时,应该用.(点)来层层访问:LangShen.Name.LangShen.AGE,当然我们也可以用数组的方式来访问,如:L

  • JavaScript ( (__ = !$ + $)[+$] + ({} + $)[_/_] +({} + $)[_/_] )

    复制代码 代码如下: ($=[$=[]][(__=!$+$)[_=-~-~-~$]+({}+$)[_/_]+ ($$=($_=!''+$)[_/_]+$_[+$])])()[__[_/_]+__ [_+~$]+$_[_]+$$](_/_) 注意,上面这段看起来很混乱的代码并不是自动换行,而是三行(当然,你写在同一行也没有错).编写一个页面运行一下(据说 IE 下不行),你就会发现这段代码的功能等同于 alert(1) 为什么会这样呢?我们来把这段代码拆开来分析. $=[] // $ 被赋值为一个

  • js面向对象设计用{}好还是function(){}好(构造函数)

    在网上看了很多JavaScript的项目, 用到对象都是采用{}的形式: 例如jQuery, TinyMCE等都是形如: 复制代码 代码如下: var Dialog = { int : function() { .... }, insert : function() { .... }, pop : function() { .... } }; //调用就是: Dialog.init(); 而我自己一直使用function闭包的方式, 感觉使用内部私有成员(函数,变量)更方便: 复制代码 代码如下

  • js函数使用技巧之 setTimeout(function(){},0)

    这个立刻的结果是: 浏览器会在文档内容处于稳定状态后立刻执行,这样就达到了和<script defer='defer'>或者<body onload="fun()">一样的效果. 更应该看到的是,此函数更优于上述方法,前面两个函数只能静态时刻处理(文档第一次载入的时候),而在系统开发中,常常由于查询.更新等操作后,文档的内容会刷新,这样就可以利用setTimeout的特点,使代码能在页面内容稳定后再执行!

  • javascript之函数直接量(function(){})()

    种语法是什么意思(function(){})() 如下例: <script language="JavaScript"> (function(){ document.write("some script code"); })() </script> <script language="JScript" type="Text/JScript"> <!-- var a=(function(

  • 解决css和js的{}与smarty定界符冲突问题的两种方法

    当输入url地址后网页出现:Fatal error: Uncaught exception 'SmartyCompilerException' with message 'Syntax Error in template "E:\wamp\www\cms\system/templates/index.html" on line 79 "$("#job").load("./system/templates/touch/test.php",

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

    JS中大括号有四种语义作用 语义1,组织复合语句,这是最常见的 复制代码 代码如下: if( condition ) {   //... }else {   //... } for() {   //... } 语义2,对象直接量声明 复制代码 代码如下: var obj = {     name : 'jack',     age : 23 }; 整个是个赋值语句,其中的{name:'jack',age:23}是个表达式. 语义3,声明函数或函数直接量 复制代码 代码如下: function f

  • 详解JavaScript语法对{}处理的坑爹之处

    JavaScript的语法有多坑,算是众人皆知了. 先来上张图 代码如下: 复制代码 代码如下: {} + [];    // 0[] + {};    // "[object Object]"{} + [] == [] + {};    // false({} + [] == [] + {});    // true 这么蛋疼的语法坑估计也只有 JavaScript 这样的奇葩才有. 相信对于绝大部分不研究 JavaScript 编译器的童鞋,根本无法理解.(至少我也是觉得不可思议)

  • javascript的 {} 语句块详解

    今日学习解析json字符串,用到了一个eval()方法,解析字符串的时候为什么需要加上括号呢?摸不着头脑.原来javascript中{}语句块具有二义性,不加括号会出错,理解这种二义性对我们理解javascript代码有极大帮助. 一.{}语句块的两个含义 表示语句块 a. 在javascript中可以使用{}来括起代码,在编辑器中方便管理代码.因为javascript并没有块级作用域,所以这种写法是无害的. { //some code... } b. 在javascript中 ,条件判断语句,

  • JavaScript学习小结之被嫌弃的eval函数和with语句实例详解

    前面的话 eval和with经常被嫌弃,好像它们的存在就是错误.在CSS中,表格被嫌弃,在网页中只是用表格来展示数据,而不是做布局,都可能被斥为不规范,矫枉过正.那关于eval和with到底是什么情况呢?本文将详细介绍eval()函数和with语句 eval 定义 eval()是一个全局函数,javascript通过eval()来解释运行由javascript源代码组成的字符串 var result = eval('3+2'); console.log(result,typeof result)

  • javascript异常处理实现原理详解

    这篇文章主要介绍了javascript异常处理实现原理详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 一.什么是例外处理 当 JavaScript程序在运行中发生了诸如数组索引越界.类型不匹配或者语法错误时,JavaScript解释器就会引发例外处理. ECMAScript定义了六种类型的错误,除此之外,我们可以使用Error对象和throw语句来创建并引发自定义的例外处理信息. 通过运用例外处理技术,我们可以实现用结构化的方式来响应错误事

  • JavaScript代码优化技巧示例详解

    目录 引言 提炼函数 函数参数化 使用策略模式替换“胖”分支 提炼变量 内联变量 封装变量 拆分阶段 拆分循环 拆分变量 分解条件表达式 合并条件表达式 以卫语句取代嵌套条件表达式 将查询函数和修改函数分离 引言 我们先引入一句话: 代码主要是为了写给人看的,而不是写给机器看的,只是顺便也能用机器执行而已. 代码和语言文字一样是为了表达思想.记载信息,所以写得清楚能更有效地表达.本文多数总结自<重构:改善既有代码的设计(第2版)>我们直接进入正题,上代码! 提炼函数 what 将一段代码提炼到

  • java中switch选择语句代码详解

    switch结构(开关语句)的语法 switch(表达式 ){ --->类型为int.char case 常量1 :--->case 结构可以有多个 //语句块1 break; --->程序跳出switch结构 case 常量n :--->常量的值不能相同 //语句块n break; default:--->和if结构中的 else作用相同 //语句块 break; } 下面看一段代码示例,有详细的注释,大家可以参考: public class SwitchStu{ /* s

  • 利用javaScript处理常用事件详解

    JS事件指再浏览器窗体或者HTML元素上发生的,乐意触发JS代码块运行的行为,下面,我们一起来看看相关事件. 1.窗体事件 例如 onload事件:当页面完全加载完成之后(包括图像,js文件,css文件等)该事件就会被触发. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>花狗在线</title> <script> window.o

  • Python if else条件语句形式详解

    我们都知道代码都是顺序执行的,也就是先执行第1条语句,然后是第2条.第3条……一直到最后一条语句,这称为顺序结构. 但是对于很多情况,顺序结构的代码是远远不够的,比如一个程序限制了只能成年人使用,儿童因为年龄不够,没有权限使用.这时候程序就需要做出判断,看用户是否是成年人,并给出提示. 在 Python 中,可以使用 if else 语句对条件进行判断,然后根据不同的结果执行不同的代码,这称为选择结构或者分支结构. Python 中的 if else 语句可以细分为三种形式,分别是 if 语句.

  • JavaScript字典与集合详解

    目录 字典 什么是字典 JavaScript中的字典 字典的应用 集合 什么是集合 JS中的集合 集合中的操作 交集.并集.差集的封装 字典 什么是字典 说到字典,第一时间想到的应该就是新华字典,实际上,这跟编程中的字典类似,两者都有一个特点,就是一一对应(yi yi dui ying),或者说是映射. 字典通常以**[键,值]** 对的形成存储,因为是以键值对的形式存储,更方便通过key来获取value 比如存储用户信息: { 'username': '一碗周', 'age': 18 } Ja

  • JavaScript async/await使用详解

    目录 一.简介 二.async 三.await 四.案例 附-直接量/字面量 一.简介 async/await是ES20717引入的,主要是简化Promise调用操作,实现了以异步操作像同步的方式去执行,async外部是异步执行的,同步是await的作用. 二.async async,英文意思是异步,当函数(包括函数语句.函数表达式.Lambda表达式)前有async关键字的时候,并且该函数有返回值,函数执行成功,那么该函数就会调用Promise.resove()并隐式的返回一个Promise对

  • Verilog关键词的多分支语句实例详解

    目录 关键词:case,选择器 case 语句 casex/casez 语句 关键词:case,选择器 case 语句是一种多路条件分支的形式,可以解决 if 语句中有多个条件选项时使用不方便的问题. case 语句 case 语句格式如下: case(case_expr) condition1 : true_statement1 ; condition2 : true_statement2 ; -- default : default_statement ; endcase case 语句执行

随机推荐