javascript的 {} 语句块详解


Posted in Javascript onFebruary 27, 2016

今日学习解析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
  })

  //正确的写法

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

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

Javascript 相关文章推荐
js下用eval生成JSON对象
Sep 17 Javascript
javascript正则表达式基础知识入门
Apr 20 Javascript
JS+CSS实现的日本门户网站经典选项卡导航效果
Sep 27 Javascript
详解JavaScript中的Unescape()和String() 函数
Nov 09 Javascript
在JavaScript中call()与apply()区别
Jan 22 Javascript
使用node.js中的Buffer类处理二进制数据的方法
Nov 26 Javascript
bootstrap实现每隔5秒自动轮播效果
Dec 20 Javascript
Vue2.0实现调用摄像头进行拍照功能 exif.js实现图片上传功能
Apr 28 Javascript
node+koa2+mysql+bootstrap搭建一个前端论坛
May 06 Javascript
vue 1.0 结合animate.css定义动画效果
Jul 11 Javascript
javascript数据结构之多叉树经典操作示例【创建、添加、遍历、移除等】
Aug 01 Javascript
JS判断两个数组或对象是否相同的方法示例
Feb 28 Javascript
javascript中eval解析JSON字符串
Feb 27 #Javascript
javascript先序遍历DOM树的方法
Feb 27 #Javascript
JavaScript开发者必备的10个Sublime Text插件
Feb 27 #Javascript
Javascript生成全局唯一标识符(GUID,UUID)的方法
Feb 27 #Javascript
JS原型、原型链深入理解
Feb 27 #Javascript
Javascript中Date类型和Math类型详解
Feb 27 #Javascript
原生javascript实现匀速运动动画效果
Feb 26 #Javascript
You might like
PHP最常用的2种设计模式工厂模式和单例模式介绍
2012/08/14 PHP
PHP使用DES进行加密与解密的方法详解
2013/06/06 PHP
thinkphp中空模板与空模块的用法实例
2014/11/26 PHP
PHP内核探索之变量
2015/12/22 PHP
php 伪造HTTP_REFERER页面URL来源的三种方法
2016/09/22 PHP
使一个函数作为另外一个函数的参数来运行的javascript代码
2007/08/13 Javascript
js history对象简单实现返回和前进
2013/10/30 Javascript
JavaScript+html5 canvas制作色彩斑斓的正方形效果
2016/01/27 Javascript
BootStrap Table 设置height表头与内容无法对齐的问题
2016/12/28 Javascript
vue-router 学习快速入门
2017/03/01 Javascript
学习使用Bootstrap页面排版样式
2017/05/11 Javascript
jquery中有哪些api jQuery主要API
2017/11/20 jQuery
通过一个简单的例子学会vuex与模块化
2017/11/22 Javascript
JavaScript实现单例模式实例分享
2017/12/22 Javascript
vue-cli启动本地服务局域网不能访问的原因分析
2018/01/22 Javascript
小程序兼容安卓和IOS数据处理问题及坑
2018/09/18 Javascript
layui 弹出删除确认界面的实例
2019/09/06 Javascript
深入分析jQuery.one() 函数
2020/06/03 jQuery
Python闭包实现计数器的方法
2015/05/05 Python
python用10行代码实现对黄色图片的检测功能
2015/08/10 Python
利用Python获取操作系统信息实例
2016/09/02 Python
python 实现一个贴吧图片爬虫的示例
2017/10/12 Python
Python实现XML文件解析的示例代码
2018/02/05 Python
Python文件监听工具pyinotify与watchdog实例
2018/10/15 Python
Python实现合并excel表格的方法分析
2019/04/13 Python
Python爬虫HTPP请求方法有哪些
2020/06/03 Python
python list等分并从等分的子集中随机选取一个数
2020/11/16 Python
美国婚礼装饰和活动用品批发供应商:Event Decor Direct
2018/10/12 全球购物
Lucene推荐的分页方式是什么?
2015/12/07 面试题
七一讲话心得体会
2014/09/05 职场文书
会计简历自我评价
2015/03/10 职场文书
装饰施工员岗位职责
2015/04/11 职场文书
MySQL命令行操作时的编码问题详解
2021/04/14 MySQL
opencv 分类白天与夜景视频的方法
2021/06/05 Python
Python Pandas pandas.read_sql函数实例用法
2021/06/21 Python
js作用域及作用域链工作引擎
2022/07/07 Javascript