ECMA6语法定义
1. 什么是ecma6
- ecmascript 6.0(简称 es6)
常用语法
let 关键字
用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效
{
let a = 100; // referenceerror: a is not defined.
var b = 10; // 10
}
for循环的计数器,就很合适使用let命令
for (let i = 0; i < 100; i++) {}//referenceerror: i is not defined
console.log(i);
不允许重复声明
let a = 10;
let a = 20; //报错
let b = 10;
b = 20; //不报错
不存在变量提升
// var
console.log(foo); // undefined
var foo = 2;
// let
console.log(bar); // 报错
let bar = 2;
const 关键字
- const声明一个只读的常量。一旦声明,常量的值就不能改变。
- 也不存在变量提升
const p = 3
p // 3
p = 4; //报错,不可更改
对象的简化写法
var foo = 'n1';
var bar = 'n2';
var obj = {foo,bar};
//等同于
var obj = {foo:foo, bar:bar}
{
fn:function(){
}
}
//可简化为
{
fn(){
}
}
class关键字
定义类
function point(x, y) {
this.x = x;
this.y = y;
}
point.prototype.tostring = function () {
return '(' + this.x + ', ' + this.y + ')';
};
var p = new point(1, 2);
- js传统方法中定义对象是通过构造函数,这种写法跟传统的面向对象语言(比如c++和java)差异很大,很容易让新学习这门语言的程序员感到困惑。
es6提供了更接近传统语言的写法,引入了class(类)这个概念。
class bar {
dostuff() {
console.log('stuff');
}
}
var b = new bar();
b.dostuff() // "stuff"
constructor 构造方法
class bar{
constructro() {
}
}
类实例化的时, 构造函数会被自动调用
extends 继承
- class之间可以通过extends关键字实现继承,这比es5的通过修改原型链实现继承,要清晰和方便很多。
class colorpoint extends point {}
上面代码定义了一个colorpoint类,该类通过extends关键字,继承了point类的所有属性和方法。
super
class colorpoint extends point {
constructor(x, y, color) {
super(x, y); // 调用父类的constructor(x, y)
this.color = color;
}
tostring() {
return this.color + ' ' + super.tostring(); // 调用父类的tostring()
}
}
上面代码中,constructor方法和tostring方法之中,都出现了super关键字,它在这里表示父类的构造函数,用来新建父类的this对象。
子类必须在constructor方法中调用super方法,否则新建实例时会报错。这是因为子类没有自己的this对象,而是继承父类的this对象,然后对其进行加工。如果不调用super方法,子类就得不到this对象。