深刻js系列-语法

语法

语句和表达式

咱们用英语的术语来讲明它们的区别

“句子”（sentence）是完整表达某个意思的一组词，由一个或多个“短语”（phrase）组成，它们之间由标点符号或链接词（and 和or 等）链接起来。短语能够由更小的短语组成。有些短语是不完整的，不能独立表达意思；有些短语则相对完整，而且可以独立表达某个意思。这些规则就是英语的语法。

JavaScript 的语法也是如此。语句至关于句子，表达式至关于短语，运算符则至关于标点
符号和链接词。

语句的结果值
得到结果值最直接的方法是在浏览器开发控制台中输入语句，默认状况下控制台会显示所执行的最后一条语句的结果值。

操做

这里var规范规定返回值未undefined

之因此关注表达式，咱们但愿能够将语句当成表达式来处理，从而不须要将语句封装到函数再用return返回值，咱们怎么在代码环境中获取表达式的返回值呢

var b;
if (true) {
  b = 4 + 38;
}
// 控制台和REPL中会输出42

代码块的结果就相似隐式返回，可是咱们没法直接显式获取，好比这样

var a, b;
a = if (true) {
  b = 4 + 38;
};

咱们能够用eval(),虽然不是个好方法，可是确实管用

var a, b;
a = eval( "if (true) { b = 4 + 38; }" );
a; // 42

目前ES7有规范，目前暂未实现

var a, b;
a = do {
  if (true) {
    b = 4 + 38;
  }
};
a; // 42

上下文规则

1.大括号

// 对象常量
var a = {
  foo: bar()
}

// 标签 在不少语言中goto语法被设计成break 和 continue 结合标签进行相似goto的操做
{
  foo: bar()
}

2.代码块 左边的{}会被解析为代码块

[] + {}; // "[object Object]"
{} + []; // 0

3.对象解构

function getData() {
// ..
return {
  a: 42,
  b: "foo"
  };
}
var { a, b } = getData();
console.log( a, b ); // 42 "foo"

自动分号(ASI)
只在换行符处添加
ASI的陷阱

function foo(a) {
  return a * 2 
    + 3 / 12
}

// 等同于
function foo(a) {
  return a * 2;
    + 3 / 12
}

// 解决方案
function foo(a) {
  return a * 2
    + 3 / 12;
}

function foo(a) {
  return (a * 2
    + 3 / 12);
}

return 返回值跨行时，须要用()包起来,或者最后一行加上;

彻底依赖ASI进行编码，会出现一些意料以外的陷阱

let d 
let a = {
  c: 3
}
({c:d} = a)

这里只为了解构a中的c，d变量已经被声明，咱们不能按照常规的解构赋值，{ c:d } = a 能够将a中的c解构给d，可是这是不合法的语法，{ c:d } 被认为是代码块，= a被认为是非法的，必须使用()来考虑js引擎这是一个语句，然而这会报错，由于{}()被认为是运行前面的对象

处理这些陷阱的办法，就是依赖ASI编码时，在() []前面加一个分号来隔断

let d 
let a = {
  c: 3
}
;({c:d} = a)