es6 知識總結--4

MkkHou 發布于2019-08-20 18:06 / 1567人閱讀

摘要：函數中使用關鍵詞定義構造函數的的方法和屬性上面代碼首先用定義了一個類，可以看到里面有一個方法，這就是構造方法，而關鍵字則代表實例對象。這是因為子類沒有自己的對象，而是繼承父類的對象，然后對其進行加工。

ES6 classes（類）

我們在編程過程中常常用到面向對象，對象創建實例這個方法，但是es6中給我封裝了一個class類
下邊給大家介紹一下!

Ecmascript5方法

//萬事萬物皆對象
        //1.類是由對象（抽象）泛化出來的
        //2.對象是由類創建出來的
        //3.對象叫類的具體實例
        function Person(name,age){
            this.name=name,
            this.age=age
        }
        Person.prototype.run=function(){
            console.log(this.name+" 我會跑")
        }

        var weiwei=new Person("weiwei",21);
        console.log(weiwei)
        
        function SuperMan(name,age,sex,body){
            //Person.apply(this,arguments);//繼承了父類的屬性
            Person.call(this,name,age,sex)//apply 傳進來的是數組集合，call傳進來的是數組

            //自己的屬性
            this.body=body;
        }


        SuperMan.prototype=Object.create(Person.prototype);//繼承了父類的方法

        //自己的方法    多態
        SuperMan.prototype.fly=function(){
            console.log("我會飛");
        }
        var chaoren=new SuperMan("大剛",24,"男","大")

es6方法

ES6 中有 class 語法。值得注意是，這里的 class 不是新的對象繼承模型，它只是原型鏈的語法糖表現形式。

//1.es6提供了類來創建面向對象編程
        class Student{
            constructor(name,age){
                this.name=name;
                this.age=age;
                }
                run(){
                    console.log(this.name+" 跑啊跑")
                }
        }
       
        class SuperMan extends Student{
            constructor(name,age,xh){
                super(name,age);  //同上call
                this.xh=xh;
            }
            eat(obejectName){
                    console.log(this.name+" 喜歡吃"+obejectName)
                }
            get  xm(){
                return this.name
            }
            set  xm(value){
                //console.log(value)      //設置xm屬性
                this.name=value;
            }
            static shangxue(){
                console.log("快快上學去");   //類的方法（只能類用），靜態方法，對象實例不能用
            }
        }   
        let student1 = new Student("咪咪",18);
        let student2 = new SuperMan("小明",21,007)
        student2.eat("蘋果");  
         //set  get  方法  
        console.log(student2.xm)    //get  調用方法不用括號();  get獲取
        student2.xm="小紅"
        console.log(student2.xm)
       // student2.shangxue()
        SuperMan.shangxue();

函數中使用 static 關鍵詞定義構造函數的的方法和屬性：
ES6 中有 class 語法。值得注意是，這里的 class 不是新的對象繼承模型，它只是原型鏈的語法糖表現形式。

函數中使用 static 關鍵詞定義構造函數的的方法和屬性

上面代碼首先用class定義了一個“類”，可以看到里面有一個constructor方法，這就是構造方法，而this關鍵字則代表實例對象。簡單地說，constructor內定義的方法和屬性是實例對象自己的，而constructor外定義的方法和屬性則是所有實例對象可以共享的。

Class之間可以通過extends關鍵字實現繼承，這比ES5的通過修改原型鏈實現繼承，要清晰和方便很多。上面定義了一個Cat類，該類通過extends關鍵字，繼承了Animal類的所有屬性和方法。

super關鍵字，它指代父類的實例（即父類的this對象）。子類必須在constructor方法中調用super方法，否則新建實例時會報錯。這是因為子類沒有自己的this對象，而是繼承父類的this對象，然后對其進行加工。如果不調用super方法，子類就得不到this對象。

關鍵字 class, extends, super

云服務器 GPU云服務器位段知識總結 linux數據結構知識點總結 ES6 es6-系列

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/84092.html

es6 知識總結--3

es6知識總結--3 上午發表了一個總結覺得還是把自己的了解做成一個小系列吧，明天把那個總結一下！ es6對咱們es3，es5的數據類型進行了升級下邊說新APIs！js數據類型有Number、String 、oject、Boolean、Null、Undefined六種數據類型 ! 下邊介紹 Math、Number、String 、Array、Boject的新 APIs Math Number S...

Keagan 2019-08-20 17:58 評論0 收藏0
es6知識點總結（一）

摘要：知識點總結一，，能重復聲明，有前置功能。淺拷貝一個數組設置原型。永遠是唯一的，不可能和別的重復，可以阻止對象的屬性被篡改前面不能使用操作符。和的區別鍵名可以是任何數據類型初始化的時候必須一次性指定鍵名和鍵值。 es6知識點總結（一） let，var，const var：能重復聲明，有前置功能。 let：有塊級作用域，沒有前置功能，不能重復聲明。 const：有塊級作用域，用來聲明常量(...

HelKyle 2019-08-20 18:03 評論0 收藏0
新手開發中常用ES6基礎知識總結

摘要：感覺對我這種沒實習沒工作的新手，雖然一些高級的功能暫時用不上，但是一些基礎的知識還是為平時的開發提供了巨大的便利。學習告一段落，現在結合平時的開發，總結一些常用的知識。日常開發中，塊級作用域中使用的變量，盡量使用或者聲明。使用時，進行合并。很早之前就學過TypeScript和ES6，后來做項目的時候零零散散用了些。這幾天又系統地把ES6的知識看了一遍。感覺對我這種沒實習沒工作的新手，...

Paul_King 2019-08-21 11:51 評論0 收藏0
ES6 常用知識點總結

摘要：常用知識總結之前總結了中的一些知識點。在年正式發布了，簡稱，又稱為。作為構造函數的語法糖，同時有屬性和屬性，因此同時存在兩條繼承鏈。子類的屬性，表示構造函數的繼承，總是指向父類。 ES6常用知識總結之前總結了es5中js的一些知識點。這段時間看了石川blue老師講解的es6課程，結合阮一峰老師的es6教程，隨手做了一些筆記和總結分享給大家。內容還是es6主要的知識點，基本沒有什么創新...

leap_frog 2019-08-30 14:03 評論0 收藏0
ES6 常用知識點總結

摘要：常用知識總結之前總結了中的一些知識點。在年正式發布了，簡稱，又稱為。作為構造函數的語法糖，同時有屬性和屬性，因此同時存在兩條繼承鏈。子類的屬性，表示構造函數的繼承，總是指向父類。 ES6常用知識總結之前總結了es5中js的一些知識點。這段時間看了石川blue老師講解的es6課程，結合阮一峰老師的es6教程，隨手做了一些筆記和總結分享給大家。內容還是es6主要的知識點，基本沒有什么創新...

CODING 2019-08-22 15:04 評論0 收藏0