大括号‘{ }’的作用,在不同的上下文中差别很大!以下观点若有错误,请前辈及时指出!
一、{ }被当做对象字面量
如:var obj = { foo: function(){} };
,外层的{...}被赋值给了obj,这里的{...}被当做对象处理。
- 在{ }的前面有运算符出现时,都会被当做对象处理,如:
"" + {}
,var a = {x:1};
- 在{ }的外面包裹( )时,也被当对象处理,如
( {a:1} )
,而( { var a = 1; } )
不符合对象定义的语法,会提示语法错误
二、{ }被当做代码块
除了以上被当做对象处理的情况,其它基本会被当做代码块处理
1.独立的代码块{...}
如:
当去掉var obj = { foo: function(){...} };
中的声明赋值部分,只留下{ foo: function(){...} };
,此时,{...}表示一个代码块,代码块内的foo: function(){...}
将被视为标签语句(可以通过使用break foo;
跳过被标记的代码块执行之后的语句,而在循环中可以用continue label;
跳过被标记的循环体的本次循环,继续下一次循环,用break label;
跳出被标记的循环体)
再如:
[] + {}; //"[object Object]"
{} + []; //0
第一句简单,{}被当做空对象处理,实际计算的是"" + [object Object]
第二句中,{}前面没有运算符,也没有其它任何修饰,被当做空的代码块了,实际计算的是+[]
2.函数体
如:function foo() {...}
3.for、while、if、switch等语句的主体
如:for(var i = 0; i < 5; i++){...}
var a = {x:1,y:2};
if(a.x == 1){
...
}else if(a.y == 2){
...
}else{
...
}
其实JavaScript并没有else if语句,如果if、else语句后面只有单个语句时可以省略{ },所以else if(...){...}else{...}
,严格来讲应该是这样else { if(...){...}else{...} }
三、解构赋值
ES6中新增的语法,如:var {a,b} = {a:1,b:2};
相当于:
var obj = {a:1,b:2};
var a = obj.a;
var b = obj.b;
解构赋值也可以用于函数命名参数中:
function foo({a,b}){
console.log(a,b);
}
foo( {a:1,b:2} )
四、JSON对象
虽说JSON是JavaScript语言的一个子集,但是JSON本身并不是合法的JavaScript语法,如:
{ "a": 1}
不符合对象定义的语法,也不符合标签的语法(不允许有""),在各浏览器控制台输入它,表现各不相同,大部分抛出SyntaxError
,Chrome则把它转换为对象了。
此时可以通过JSON-P,JSON-P能通过将JSON数据封装为函数调用,如foo({ "a": 1})
,从而将JSON转换为合法的JavaScript语法。
本文参考《你不知道的JavaScript》