标签:.com code 情况 es6 命令 声明 提取 快速 turn
快速了解ES6部分新特性。。。
{ let x = 10; var y = 20; } x // ReferenceError: x is not defined y // 20
var声明变量存在变量提升。也就是在声明变量之前就可以使用该变量。
console.log(x) // undefined,var声明变量之前可以使用该变量 var x = 10;
而let不会这样,let声明的变量不能在声明之前使用。
console.log(x) // ReferenceError: x is not defined,let声明变量之前不可以使用该变量 let x = 10;
function foo(){ let x = 10; var x = 20; } // 报错
再比如:
function foo(){ let y = 10; let y = 20; } // 报错
var name = ‘Q1mi‘ function foo(){ console.log(name) if (false){ var name = ‘Bob‘ } } foo() // undefined
for (var i=0;i<5;i++){ console.log(‘哈哈‘); } console.log(i); // 5
ES6中的let声明变量的方式实际上就为JavaScript新增了块级作用域。
var name = ‘Q1mi‘ function foo(){ console.log(name) if (false){ let name = ‘Bob‘ } } foo() // Q1mi
此时,在foo函数内容,外层代码块就不再受内层代码块的影响。所以类似for循环的计数变量我们最好都是用let来声明。
const PI = 3.14;
全局对象的属性:
ES6规定:var命令和function命令声明的全局变量依旧是全局对象的属性;let命令、const命令和class命令声明的全局变量不属于全局对象的属性。
查看下面的示例代码:
var x = 10; let y = 20; window.x // 10 window.y // undefined
ES6允许按照一定的模式,从数组或对象中提取值,对变量进行赋值,这种方式被称为解构赋值。
var [x, y, z] = [10, 20, 30] x // 10 y // 20 z // 30
对象的解构赋值:
var {x, y} = {x: 10, y: 20} x // 10 y // 20
模板字符串(template string)是增强版的字符串,用反引号(`)标识。它可以当做普通字符串使用,也可以用来定义多行字符串,或者在字符串中嵌入变量。在模板字符串中嵌入变量,需要将变量名写入${}中。
var name = ‘Q1mi‘, age = 18; `My name is ${name}, I’m ${age} years old.`
var person = { name: ‘Q1mi‘, age:18, func:function(){ console.log(this); } } person.func() // person对象
和
var person = { name: ‘Q1mi‘, age:18, func:()=>{ console.log(this); } } person.func() // window对象
function (x, y){ return {x, y} }
上面的写法等同于:
function(x, y){ return {x: x, y: y} }
对象的方法也可以使用简洁表示法:
var o = { method(){ return “Hello!”; } }
等同于:
var o = { method: function(){ return “Hello!”; } }
function Person(name, age){ // 点方法 set方法和get方法 this.name = name; this.age = age; this.func = function(){ ... } } // 给父级绑定方法 Person.prototype.showName = function(){ console.log(this.name); } var p = new Person(‘q1mi’, 18); console.log(p.name) p.showName();
ES6 构造对象的方式:
class Person{ constructor(name, age){ this.name = name; this.age = age; } // 不要加逗号!!! showName(){ console.log(this.name); } } var p = new Person()
附:
有关ES6的其他新特性,推荐阅读:阮一峰的ECMAScript 6 入门
标签:.com code 情况 es6 命令 声明 提取 快速 turn
原文地址:https://www.cnblogs.com/liwenzhou/p/9249932.html