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 相关文章推荐
JQuery的Ajax跨域请求原理概述及实例
Apr 26 Javascript
window.location.href的用法(动态输出跳转)
Aug 09 Javascript
使用AngularJS对路由进行安全性处理的方法
Jun 18 Javascript
AngularJS 自定义指令详解及示例代码
Aug 17 Javascript
原生js实现节日时间倒计时功能
Jan 18 Javascript
浅谈Javascript事件对象
Feb 05 Javascript
SVG动画vivus.js库使用小结(实例代码)
Sep 14 Javascript
vue几个常用跨域处理方式介绍
Feb 07 Javascript
jQuery实现鼠标响应式淘宝动画效果示例
Feb 13 jQuery
微信小程序Echarts图表组件使用方法详解
Jun 25 Javascript
微信小程序实现日历签到
Sep 21 Javascript
vue浏览器返回监听的具体步骤
Feb 03 Vue.js
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
phpMyAdmin自动登录和取消自动登录的配置方法
2014/05/12 PHP
thinkphp3.2.2前后台公用类架构问题分析
2014/11/25 PHP
CodeIgniter框架钩子机制实现方法【hooks类】
2018/08/21 PHP
浅谈laravel数据库查询返回的数据形式
2019/10/21 PHP
Yii 框架使用数据库(databases)的方法示例
2020/05/19 PHP
PHP7 其他修改
2021/03/09 PHP
Extjs学习笔记之二 初识Extjs之Form
2010/01/07 Javascript
Javascript 类型转换方法
2010/10/24 Javascript
如何制作浮动广告 JavaScript制作浮动广告代码
2012/12/30 Javascript
AngularJS的一些基本样式初窥
2015/07/27 Javascript
JS函数定义方式的区别介绍
2016/03/22 Javascript
Jquery Easyui日历组件Calender使用详解(23)
2016/12/18 Javascript
jQuery插件FusionCharts实现的2D柱状图效果示例【附demo源码下载】
2017/03/06 Javascript
angular-cli修改端口号【angular2】
2017/04/19 Javascript
详解react关于事件绑定this的四种方式
2018/03/09 Javascript
js canvas实现红包照片效果
2018/08/21 Javascript
vue 双向数据绑定的实现学习之监听器的实现方法
2018/11/30 Javascript
JavaScript中的事件与异常捕获详析
2019/02/24 Javascript
vue2.x 通过后端接口代理,获取qq音乐api的数据示例
2019/10/30 Javascript
es6函数之rest参数用法实例分析
2020/04/18 Javascript
[26:40]DOTA2上海特级锦标赛A组资格赛#1 Secret VS MVP.Phx第一局
2016/02/25 DOTA
Python yield使用方法示例
2013/12/04 Python
Python多线程同步Lock、RLock、Semaphore、Event实例
2014/11/21 Python
Python 数值区间处理_对interval 库的快速入门详解
2018/11/16 Python
Python使用itchat模块实现群聊转发,自动回复功能示例
2019/08/26 Python
详解Python3定时器任务代码
2019/09/23 Python
斯凯奇新西兰官网:SKECHERS新西兰
2018/02/22 全球购物
美国综合购物商城:UnbeatableSale.com
2018/11/28 全球购物
环保倡议书范文
2014/05/12 职场文书
目标责任书格式
2014/07/28 职场文书
大学生党员批评与自我批评范文
2014/10/14 职场文书
单位租车协议书
2015/01/29 职场文书
2015年房地产个人工作总结
2015/05/26 职场文书
MySQL数字类型自增的坑
2021/05/07 MySQL
Redis keys命令的具体使用
2022/06/05 Redis
Springboot中如何自动转JSON输出
2022/06/16 Java/Android