zoukankan      html  css  js  c++  java
  • 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();
     
  • 相关阅读:
    QT 信号与槽 中传递自定义数据类型
    keil5 仿真时发现函数不能进入到main函数
    QT 报错分析 一
    QT 简易时间处理
    QT 编译出现 Custom Executable 对话框 问题
    win10 下装ubuntu双系统
    Vmware linux下不能联网
    Vmware Workstation
    免费在线作图,实时协作
    SVN常用问题汇总
  • 原文地址:https://www.cnblogs.com/sna-ling/p/11878112.html
Copyright © 2011-2022 走看看