ES6的对象和类

对象的扩展

1.对象属性的扩展

1.对象属性的简单赋值方式 可以将变量名直接放进对象中, 解析的时候 将变量名解析为属性名 变量值解析为属性值

2.对象方法的简单赋值 可以省略function关键字

var name = "喻文波";
    var gender = "男";
    var p = {
      //原来
      // name : name,
      // age : age,
     //ES6中的简单赋值
      name,
     gender,
      // adc : function(){
      //   console.log("伊泽瑞尔");
      // }
      //2.对象方法的简单写法
      adc(){
        console.log("伊泽瑞尔");
      }
    }
    p.adc();

3.super关键字：指向当前对象的原型对象

使用注意点 :

1. 只能在对象的方法中使用 在其他地方使用都会报错
2. 只能在对象方法的简写方式中使用

var obj = {
        name : "宋义进",
        girlFriend:"刘亦菲",
        // job : function() {
        //     console.log("我是"+super.type+"中单");
        // }

        job(){
            console.log("我是"+super.type+"中单");
        }
    }
    obj.__proto__={
        type:"star"
    }
    obj.job();

4.对象的计算属性名 使用方式[] 对属性名进行计算, 里面可以是变量名 表达式 也可以是函数

 var n1 = "name";
    var n2 = "age";
    var n3 = "hobby";

    function getGender(){
        return "gender";
    }

    var obj = {
        [n1]:"老师",
        [n2]:20,
        // [n3]:function(){
        //     console.log("我的爱好是跑步"); 
        // },
        [n3](){
            console.log(this[n1]+ "---" +this[n2]);
        },

        [getGender()]:"男"
    }

    obj[n3]();
    console.log(obj[getGender()]);

2.对象的新增的api

1.Object.is()这个方法和js的严格判断(===)用法基本一样 只是在对于-0和+0 以及NaN的判断上做了改善

  console.log(-0 === +0);//ture =======> 需要他是false
  console.log(NaN === NaN);//false ======>需要他是true
  console.log(-0 === +0);//false
  console.log(NaN === NaN);//true
    **//2.Object.assign() 是用来合并对象的**

**注意点 :** 

1. 该方法的返回值一定传入的第一个参数, 会把后面的参数全都合并上去之后返回
2. 第一个参数必须是对象  如果是基本数据类型 就转换成对应的包装类返回
3. 如果第一个参数是undefined 或者null 因为他们无法转换成对象  那么就会报错
4. 如果合并的对象里面有同名的属性 那么后面的就会覆盖前面的
5. 如果有两个参数  undefined 或者null不作为第一个参数  那么就回原值第一个参数
6. Object.assign方法是浅拷贝 不是深拷贝

  //参数1:目标对象  参数2.... : 需要合并的对象

```js
  // var name = {"name" : "张学友"};

  // var name = "[Object object]";

3.Object.setPrototypeOf() 设置一个对象的原型对象

参数1 : 目标对象 参数2 : 新设置原型的对象

var obj = {
    n1:15,
    n2:18
  }
 console.log(obj.__proto__ === Object.prototype);

4.Object.getPrototypeOf() 获取一个对象的原型对象

参数 : 需要获取对象的原型的对象名

console.log(Object.getPrototypeOf(obj));

5.Object.keys() 是将对象所有的属性名获取到 添加到数组 并返回 返回的是一个数组

参数 : 需要遍历的对象名

6.Object.values() 是将对象所有的属性值获取到 添加到数组 并返回 返回的是一个数组

var stu = {
    name:"张三",
    age:18,
    work:"无业游民"
  }
  console.log(Object.keys(stu));
  console.log(Object.values(stu));

class关键字的基本使用

1.传统的构造函数的问题 :

​ 1. 构造函数和原型方法属性分离 不便于维护 降低了可读性

​ 2. 原型对象的成员可以遍历

 3. 默认情况下构造函数也是可以被当做普通函数来调用的 所以 功能性不明显
    4. 原型中的方法也可以作为构造函数来用

2.类的用法

let和const一样 都有暂时性死区 必须先定义 再使用

  class Person {
        constructor(name, sex) {
            this.name = name;
            this.sex = sex;
        }

        toString() {
            return this.name + "," + this.sex; 
        }
    }

    var p2 = new Person("lily", "女");
    console.log(p2.toString());

    class Cat{

    }
    var c1 = new Cat();

3.ES6中的类的本质

class就是一个语法糖 本质就是一个函数 就是使用ES5里面的函数封装的

  class Person {
    constructor(name, sex) {
      this.name = name;// this指向于类创建的实例化对象
      this.sex = sex;
   }
   toString() {
       concole.log("张三");
    }
  }
  console.log(typeof  Person);  // function

4.类的特点

1. 类是不可枚举的
2. 类的用法很let和const一样 都有暂时性死区 必须先定义 再使用
3. 类里面的方法不能做为构造函数来使用
4. 类(Person)使用的时候 必须配合new关键字进行使用 否则就会报错