JS的数组与对象解构

访问器属性与接口的属性化

let item1 = {
        data:{
            name: '手机',
            price:6000,
        }
    }

创建一个对象，在这个对象里面有两个属性，接下来为这两个属性创建一个接口用来在外部进行读写操作

读操作

创建一个方法访问并输出上方的name的值(这个方法要写在item1里面)

getName(){
        return item1.data.name;
    }

写操作

创建一个方法，调用上方的name.给一个参数，这个参数用于在外部访问时，修改name的值

 setName(d){
        this.data.name = d;
    }

通过访问接口访问并进行读写操作

console.log(item1.getName());
 item1.setName(20000);
    console.log(item1.data.name);

为属性赋值还有另一种方式可以在预先声明对象时，声明一个空对象，里面没有不声明属性，然后在后期往里面填入属性

就像下面的操作，事先声明了一个对象C 和对象C里面的属性data，两个都是空的，并没有任何属性，然后再通过外部的访问进行读写操作，往里面添加对应的属性

 let c={};
    c.data={};
    c.data.name = '鼠标';
    console.log(c.data.name);

构造函数

专用于创建对象的函数，叫做构造函数
下方的User1 就是一个构造函数
创建一个新函数User1.里面包含一个方法，这个方法有两个参数，然后在方法里面创建两个属性，name,email，两个属性没有具体的值，他们的值等待外部的传入

let User1 = function (name,email) {
    this.name = name,
    this.email = email,
    this.fangfa = function(){
        return `${this.name}+${this.email}`;
    };
};
let user2 = new User1('杨老师',1966666666) ;
console.log(user2);
let user3 = new User1('李老师',196666) ;
console.log(user3);

声明结束后，在后续操作中调用这个构造函数并且传参

需要注意的是在构造函数调用时，必须使用NEW关键字来新建一个函数并传参

在新创建的对象user2和user3中，属性不同，但是都调用了同一个方法，在实际的操作中，只需要保留一个方法副本并共享给所有的实例（实例就是通过同一个构造函数创建的对象）即可。

原型属性

经过上方的操作，我们就知道了有的方法可以通过父级共享给他所有的子集，这样就不需要给他的每一个子集都创建一个相同的方法，造成代码冗余

调用对象的constructor方法，可以查看这个对象的构造器（构造函数），来知道这个对象的父级

console.log(user2.constructor);

所有的函数都有一个原型属性（prototype）这个属性对于构造函数来说特别重要
在构造函数中，可以将对象的共享成员（方法，属性等）挂载到prototype原型属性上，被所有当前构造函数的实例所共享

let User1 = function (name,email) {
    this.name = name,
    this.email = email
};
User1.prototype.fangfa = function(){
        return `${this.name}+${this.email}`;
    };
let user2 = new User1('杨老师',1966666666) ;
console.log(user2);
let user3 = new User1('李老师',196666) ;
console.log(user3);

将这串代码与上方代码代码对比可以看出，直接将之前代码中的公用的方法，提取出来直接挂载到prototype原型上，实现了共享

继承

通过原型属性，将父级函数的方法，让子类函数调用，这就叫继承

let a=function(){};
 a.prototype.sum=function(){
        return this.a+this.b;};
let C =function(a,b){
    this.a=a;
    this.b=b;
};
C.prototype = a.prototype;
let d = new C(100,200);
console.log(d.sum());

上方代码解释：
1.首先创建一个构造函数a,然后在a的原型属性上挂载一个方法sum，对a和b进行运算，但是并没有给a和b赋值
2.然后创建一个构造函数C，里面有两个参数a和b，
3.然后通过C.prototype = a.prototype; 将C的原型与a的原型进行绑定，将C视为a的子类函数，并继承a的原型方法
4.然后通过C 创建一个新实例d 并给其中的a和b两个参数赋值
5.然后输出d函数中的sum方法，这个方法继承自a，是a挂载到原型上并继承给子类的方法。

用类来简化上面构造函数创建对象的过程

在js中，没有类的说法，所以JS中的类就是函数
但是在js中声明类也是用class（这是一个ES6的语法）

    class Meta{
        // 公共成员
    username='杨老师';
    // 构造方法、实例初始化
    constructor(name,email){
        // 这是自由属性
        this.name = name;
        this.email = email;
    }
    // 原型成员也叫共享成员
    getInfo(){
        return this.name+this.email;
    }
    //  静态成员（静态成员只能通过构造函数方法访问）
    // static 是关键字用于创建静态成员
    static a='李老师';
};
    // 开始实例化
    const c =new Meta('张老师',19666);
    // 调用其中的原型方法
    console.log(c.getInfo());
    // 调用静态成员
    console.log(Meta.a);

注意：在构造方法和原型成员后面没有分号

代码解释：
创建一个类Meta，然后创建一个构造方法（使用关键字constructor），
然后创建一个原型成员（方法或者属性）getInfo来进行运算操作
使用static关键字创建静态成员

类的继承

    // extends 是类的扩展（继承）关键字
class Meta1 extends Meta{
    // 在父类的基础上 多了一个参数password
   constructor(name,email,password){
    // super（）会调用父类的构造器来初始化这个实例（使用于在父类中已经初始化过的参数）
     super(name,email);
    //  对新增的参数进行初始化
     this.password=password;
   }
   getInfo(){
    // 同样的 输出的时候也可以使用super 来进行调用父类的参数
    return `${super.getInfo()},${this.password}`;
   }
}
const d=new Meta1('陈老师',196777,996996);
console.log(d.getInfo());

解构赋值

数组解构

用一个数组变量（模板）来接收一个数组的值

 let [name,name2] = ['王老师','张老师'];
 console.log(name,name2);

上面的操作是初始化，变量的特点就是可以重新赋值，改变他的值
下面的代码就对上方代码进行了更新

 [name,name2] = ['李老师','张老师'];
 console.log(name,name2);

对象解构

和数组解构是差不多的

let{id,calss,na} = {id:1,calss:2,na:3};
  console.log(id,calss,na);

更新
需要注意的是更新的时候，因为大括号不能直接写，所以需要在更新解构的表达式外部用一堆小阔号包围，不然会报错

 ({id,calss,na} = {id:1,calss:5,na:3});
  console.log(id,calss,na);