在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 相关文章推荐
prototype Element学习笔记(篇二)
Oct 26 Javascript
document.createElement()用法及注意事项(ff下不兼容)
Mar 13 Javascript
js实现无需数据库的县级以上联动行政区域下拉控件
Aug 14 Javascript
JavaScript+canvas实现七色板效果实例
Feb 18 Javascript
JQuery的常用选择器、过滤器、方法全面介绍
May 25 Javascript
jQuery插件学习教程之SlidesJs轮播+Validation验证
Jul 12 Javascript
javascript中的深复制详解及实例分析
Dec 29 Javascript
自带气泡提示的vue校验插件(vue-verify-pop)
Apr 07 Javascript
JavaScript中双向数据绑定详解
May 03 Javascript
js+html5实现半透明遮罩层弹框效果
Aug 24 Javascript
vue监听用户输入和点击功能
Sep 27 Javascript
Vue基于localStorage存储信息代码实例
Nov 16 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下过滤html代码的函数 提高程序安全性
2010/03/02 PHP
基于php实现七牛抓取远程图片
2015/12/01 PHP
Zend Framework缓存Cache用法简单实例
2016/03/19 PHP
php传值和传引用的区别点总结
2019/11/19 PHP
用Javascript实现锚点(Anchor)间平滑跳转
2009/09/08 Javascript
jQuery数组处理方法汇总
2011/06/20 Javascript
用js的for循环获取radio选中的值
2013/10/21 Javascript
javascript中利用柯里化函数实现bind方法【推荐】
2016/04/29 Javascript
javascript中JSON.parse()与eval()解析json的区别
2016/05/19 Javascript
微信小程序 SocketIO 实例讲解
2016/10/13 Javascript
form+iframe解决跨域上传文件的方法
2016/11/18 Javascript
jQuery获取选中单选按钮radio的值
2016/12/27 Javascript
webpack打包后直接访问页面图片路径错误的解决方法
2017/06/17 Javascript
nodejs超出最大的调用栈错误问题
2017/12/27 NodeJs
vue给对象动态添加属性和值的实例
2019/09/09 Javascript
Element PageHeader页头的使用方法
2020/07/26 Javascript
antdesign-vue结合sortablejs实现两个table相互拖拽排序功能
2021/01/08 Vue.js
python定时器使用示例分享
2014/02/16 Python
Python中让MySQL查询结果返回字典类型的方法
2014/08/22 Python
跟老齐学Python之折腾一下目录
2014/10/24 Python
微信跳一跳python辅助软件思路及图像识别源码解析
2018/01/04 Python
Python基于TCP实现会聊天的小机器人功能示例
2018/04/09 Python
终端命令查看TensorFlow版本号及路径的方法
2018/06/13 Python
Python实现的从右到左字符串替换方法示例
2018/07/06 Python
python UDP(udp)协议发送和接收的实例
2019/07/22 Python
如何在vscode中安装python库的方法步骤
2021/01/06 Python
说出你对remoting 和webservice的理解和应用
2014/06/08 面试题
中英双版中文教师求职信
2013/10/27 职场文书
商务英语毕业生自荐信范文
2013/11/08 职场文书
小学生安全保证书
2014/02/01 职场文书
大学毕业生个人自荐书
2014/07/02 职场文书
党的群众路线教育实践活动督导组工作情况汇报
2014/10/28 职场文书
2014年效能监察工作总结
2014/11/21 职场文书
教师学习中国梦心得体会
2016/01/05 职场文书
Oracle设置DB、监听和EM开机启动的方法
2021/04/25 Oracle
java获取一个文本文件的编码(格式)信息
2022/09/23 Java/Android