关于解构赋值和es6继承

1.ES6中class的介绍

通过class关键字，可以定义类。基本上，ES6 的class可以看作只是一个语法糖，它的绝大部分功能，ES5 都可以做到，新的class写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已。

ES6中Class的继承
实例：
注意项：
1.在类中声明方法的时候，千万不要给该方法加上function关键字
2.方法之间不要用逗号分隔，否则会报错由上面代码可以看出类实质上就是一个函数。类自身指向的就是构造函数 所以可以认为ES6中的类其实就是构造函数的另外一种写法！

constructor方法是类的构造函数的默认方法，通过new命令生成对象实例时，自动调用该方法
constructor中定义的属性可以称为实例属性（即定义在this对象上），constructor外声明的属性都是定义在原型上的，可以称为原型属性（定义在class上)。
hasOwnProperty()函数用于判断属性是否是实例属性。其结果是一个布尔值， true说明是实例属性，false说明不是实例属性。
in操作符会在通过对象能够访问给定属性时返回true,无论该属性存在于实例中还是原型中。
class不存在变量提升，所以需要先定义再使用。因为ES6不会把类的声明提升到代码头部，但是ES5就不一样,ES5存在变量提升,可以先使用，然后再定义
首先我们要知道一下这些要点：

1、Class通过 extends 关键字实现继承。

2、super 关键字既可以当作函数使用，也可以当作对象使用。` ① super 作为函数调用时表示父类的构造函数，用来新建父类的this对象。

同时需要注意：

a、子类必须在 constructor 方法中调用 super 方法，否则新建实例时会报错。

b、如果子类没有定义 constructor 方法，那么这个方法就会被默认添加。

c、在子类的构造函数中，只有调用 super 方法之后才能够使用 this 关键字，否则会报错。

d、super 虽然代表了父类的构造函数，但是返回的是子类的实例，即 super 内部的 this 指定的是子类。

e、super () 只能用在子类的构造函数之中，用在其他地方会报错。

② super 作为对象时在普通方法中指向父类的原型对象；在静态方法中指向父类。

同时需要注意：

a、由于 super 指向父类的原型对象，定义在父类实例上的方法或属性是无法通过 super 调用的。如果定义在父类的原型上，super 就可以取到。

b、ES6规定，通过 super 调用父类的方法时，super 会绑定子类的 this。

c、如果通过 super 对某个属性赋值，这时 super 就是 this，赋值的属性会变成子类实例的属性。

d、如果 super 作为对象用在静态方法之中，这时 super 将指向父类，在普通方法之中指向父类的原型对象。
1234567891011121314151617181920212223

`

2.解构赋值

解构赋值就是从目标对象或数组中提取自己想要的变量。最常用的场景是：element-ui,vant-ui按需引入，请求接口返回数据，提取想要数据。

注意点：数组的解构赋值需要左边的变量结构需要等于右边的值的结构，即给对应位置的变量声明对应位置的值，变量的取值由位置决定
解构赋值使用场景：

第一种：变量互换

例子：

{
let a=1;
let b=2;
[a,b]=[b,a];
console.log(a,b);
}

输出2,1

以前想交换变量必须要一个中间变量做存贮

场景2：

{
function f(){
return [1,2]
}
let a,b;
[a,b]=f();
console.log(a,b);
}

输出1,2

这种来接收这种数据就特别方便！以前就得先赋值给一个变量。再.[0]来取、、

场景3：

忽略某些返回值！！

{
function f(){
return [1,2,3,4,5]
}
let a,b,c;
[a,b]=f();
console.log(a,b);
}

输出结果为 1 4

场景4：

只想看第一个数的值，但不知道后边数组的长度。这样a就返回第一个值，b就返回后边的数组！

{
function f(){
return [1,2,3,4,5]
}
let a,b,c;
[a,…b]=f();
console.log(a,b);
}

返回1 [2,3,4,5]

讲解对象解构赋值：

对象左侧是对象的格式，右侧也是对象的格式！

{
let o={p:42,q:true};
let {p,q}=o;
console.log(p,q);
}

输出 42 true

{
let {a=10,b=5}={a:3};
console.log(a,b);
}

输出：3 5

给a重新赋值。b原来有自己的值

对象解构赋值的应用场景：

{
let Data={
title:‘abc’,
test:[{
title:‘test’,
desc:‘description’
}]
}
let {title:titleA,test:[{title:titleB}]}=Data;
console.logtitleA,titleB);
}

结果：abc test