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();