ES6---面向对象上的简化

一、ES6---面向对象上的简化

1.单个对象提供了2处简化:

1.1 如果对象的属性来自于对象外的变量,且变量名刚好和属性名相同。则不用写两遍相同的名字,

只要写一遍即可。

1.2 所有对象的方法,不再需要写“:function”

强调:对象中的方法去掉:function,就不等效于箭头函数。突出特点就是this保持原样不变!

所以,去掉:function,只是单纯的简写,没有任何原理的改变。

      var eid=1001;
        function intrSelf(){
            console.log(`我的编号是${this.eid}`);
        }
        var friends=["亮亮","然然","东东"];
        var eric={
            eid,// eid:eid,
            ename:"诶里克",
            intrSelf,// intrSelf:intrSelf
            friends,// friends:friends
            run(){ //:function(){
                console.log(`${this.ename}在奔跑`);
            }
        }
        console.log(eric);
        eric.intrSelf();
        eric.run();
 
二、class
      什么是:集中定义一种类型的所有对象统一属性结构和方法的程序结构
      为什么:每一种类型:Array Student Date都有两部分组成:构造函数+原型对象
       构造函数:负责定义所有子对象统一的属性结构,并且负责创建子对象。
       原型对象:负责保存所有子对象共有的属性值和方法。
但是,在ES5中,构造函数和原型对象是分开定义的。不符合"封装"的要求。
       何时:今后只要希望创建一种自定义类型时,都用class
       如何:3件事
               1.用class{}包裹构造函数和原型对象方法
               2.构造函数名提升为class名,所有构造函数,从此统一更名为constructor
               3.所有放在class中的函数,不需要加类型名.prototype前缀,自动就是保存在构造函数的原型对象中。
                如何使用class:用法和从前的构造函数完全一样!原型对象的原理依然保持不变。
   //1.用class{}包裹构造函数和原型对象方法
        class  Student{
            //2.构造函数名提升为class名,所有构造函数
            //更名为constructor
         constructor(sname,sage){
            this.sname=sname;
            this.sage=sage;
         }
        //3.所有原型对象方法,不用加类型名.prototype前缀!
        intrSelf=function(){
          console.log(`I'm ${this.sname},I'${this.sage}`);
         }
        run=function(){
          console.log(`${this.sname}开始奔跑....`);
         }
        } 
         var lilei=new Student("Li Lei",11);
         var hmm=new Student("Han Meimei",12);

         console.log(lilei);
         console.log(hmm);
         lilei.intrSelf();
         lilei.run();
         hmm.intrSelf();
         hmm.run();
 
原文地址:https://www.cnblogs.com/sna-ling/p/11878112.html