在JS中最常看到切最容易迷惑的语法(转)


Posted in Javascript onOctober 29, 2010

js中大括号有四种语义作用
语义1,组织复合语句,这是最常见的

if( condition ) { 
//... 
}else { 
//... 
} 
for() { 
//... 
}

语义2,对象直接量声明
var obj = { 
name : 'jack', 
age : 23 
};

整个是个赋值语句,其中的{name:'jack',age:23}是个表达式,单独存在也不会出现语法错误的。
语义3,声明函数或函数直接量
function f1(){ 
//... 
} 
var f2 = function(){ 
//... 
}

f1与非f2的区别是前者在语法解释期,后者在运行期。区别在于:如果调用该函数的代码在函数定义之后,则没有区别;如果调用该函数的代码在函数定义之前,则f1仍然可以调用,f2则会报错,提示f2未定义。
语义4,结构化异常处理的语法符号
try { 
//... 
}catch( ex ){ 
//... 
}finally{ 
//... 
}

这里的大括号与符合语句(语义1 )是有区别的,大括号中如果只有一条语句,在if/else/for等中大括号是可以省略的,但try/catch/finally则不能省略。
以下代码纠结了偶N久
function(){}() //匿名函数立即执行, 语法分析期报错 
{}.constructor //获取对象直接量的构造器,语法分析期报错

令人不解的是为何[].constructor这么写却不报错呢,一个是想获取对象直接量的构造器,一个是获取数组直接量的构造器而已。
当然添加个变量接收也不会报错
var c = {}.constructor;
同样的情况如
var fn = function(){}(),也不会报错。
实际上是js的“语句优先”在作怪,即{}被理解成复合语句块(语义1 )而不是对象直接量(语义2 )或声明函数(语义3 )的语义。
function(){}(),大括号被理解成复合语句,自然前面的function()声明函数的语法不完整导致语法分析期出错。
{}.constructor,大括号被理解成复合语句,大括号后面是点运算符,点运算符前没有合理的对象自然也报错。
修复方式众所周知:加个强制运算符()
(function(){})(),(function(){});//强制其理解为函数(语义3 ),“函数()”表示执行该函数,即声明后立即执行了。
({}).constructor //({})强制把大括号理解成对象直接量(语义2 ),“对象.xx”表示获取对象的成员,自然后面的点运算符可以正常执行了。

延伸:JQUERY插件编写需要预先运行篇
如果注意一些JQ插件,你经常会发现以下代码:
(function($){$(function(){/*code*/})}($))
如果你看了上面的文章,你就会发现为什么会有这个东西了,很多JQ的插件都需要在没有使用的时候就预先运行的,不过我编写的时候到很少遇到会写这样的插件.不过很多时候也有好处的~~

Javascript 相关文章推荐
jquery基础教程之数组使用详解
Mar 10 Javascript
jQuery 获取、设置HTML或TEXT内容的两种方法
May 23 Javascript
javascript实现阻止iOS APP中的链接打开Safari浏览器
Jun 12 Javascript
Bootstrap框架实现广告轮播效果
Nov 28 Javascript
JavaScript评论点赞功能的实现方法
Mar 13 Javascript
JavaScript 中 apply 、call 的详解
Mar 21 Javascript
jQuery滑动到底部加载下一页数据的实例代码
May 22 jQuery
基于input动态模糊查询的实现方法
Dec 12 Javascript
JS排序算法之冒泡排序,选择排序与插入排序实例分析
Dec 13 Javascript
JS伪继承prototype实现方法示例
Jun 20 Javascript
Vue Echarts实现可视化世界地图代码实例
May 07 Javascript
vue开发拖拽进度条滑动组件
Sep 21 Javascript
ExtJS 入门
Oct 29 #Javascript
js 弹出框 替代浏览器的弹出框
Oct 29 #Javascript
javascript天然的迭代器
Oct 29 #Javascript
不使用中间变量,交换int型的 a, b两个变量的值。
Oct 29 #Javascript
js类型检查实现代码
Oct 29 #Javascript
JavaScript继承方式实例
Oct 29 #Javascript
拖动布局之保存布局页面cookies篇
Oct 29 #Javascript
You might like
php 购物车完整实现代码
2014/06/05 PHP
phpExcel中文帮助手册之常用功能指南
2014/08/18 PHP
Yii的Srbac插件用法详解
2016/07/14 PHP
js innerHTML 的一些问题的解决方法
2008/06/22 Javascript
使用Javascript接收get传递的值的代码
2011/11/30 Javascript
禁止IE用右键的JS代码
2013/12/30 Javascript
jquery进行数组遍历如何跳出当前的each循环
2014/06/05 Javascript
浅谈js中的闭包
2015/03/16 Javascript
JavaScript的Date()方法使用详解
2015/06/09 Javascript
javascript中caller和callee详解
2015/08/10 Javascript
使用impress.js制作幻灯片
2015/09/09 Javascript
js操作数组函数实例小结
2015/12/10 Javascript
jsonp跨域请求实现示例
2017/03/13 Javascript
JS实现的A*寻路算法详解
2018/12/14 Javascript
vue element-ui实现动态面包屑导航
2019/12/23 Javascript
vue 使用v-for进行循环的实例代码详解
2020/02/19 Javascript
Python3中多线程编程的队列运作示例
2015/04/16 Python
Python简单操作sqlite3的方法示例
2017/03/22 Python
Django项目中包含多个应用时对url的配置方法
2018/05/30 Python
Python使用folium excel绘制point
2019/01/03 Python
详解用python计算阶乘的几种方法
2019/08/14 Python
Python实现桌面翻译工具【新手必学】
2020/02/12 Python
通过Python扫描代码关键字并进行预警的实现方法
2020/05/24 Python
pycharm 对代码做静态检查操作
2020/06/09 Python
Smallable英国家庭概念店:设计师童装及家居装饰
2017/07/05 全球购物
健身场所或家用健身设备:Life Fitness
2017/11/01 全球购物
Otticanet澳大利亚:最顶尖的世界名牌眼镜, 能得到打折季的价格
2018/08/23 全球购物
大队干部竞选演讲稿
2014/04/28 职场文书
预备党员公开承诺书
2014/05/28 职场文书
个人收入证明模板
2014/09/18 职场文书
一般党员对照检查材料
2014/09/24 职场文书
三年级上册科学教学计划
2015/01/21 职场文书
奖学金感谢信
2015/01/21 职场文书
2015年清明节演讲稿范文
2015/03/17 职场文书
《风筝》教学反思
2016/02/23 职场文书
Shell脚本一键安装Nginx服务自定义Nginx版本
2022/03/20 Servers