我的es6總結(jié)

JerryWangSAP 發(fā)布于2019-08-29 12:57 / 2266人閱讀

摘要：補(bǔ)充普通方法是實(shí)例化出來(lái)的對(duì)象，靜態(tài)方法屬于類，亦可以被繼承。類的基本定義生成實(shí)例構(gòu)造函數(shù)。默認(rèn)值小王的時(shí)候自動(dòng)執(zhí)行構(gòu)造函數(shù)。構(gòu)造函數(shù)和實(shí)例繼承繼承上一級(jí)，可以調(diào)用父類的構(gòu)造函數(shù)。

一. es6編譯環(huán)境搭建 1 . 初始化 npm 創(chuàng)建package.json文件

    npm init

2. 安裝webpack

    cnpm install webpack -D

3. 安裝babel相關(guān)包來(lái)編譯es6 語(yǔ)法

    cnpm install babel-loader babel-core babel-preset-es2015 -D

二、寫(xiě)webpack.config.js配置文件，配置編譯es6 1. loader相關(guān)配置

        module.exports = {
            entry:"./entry.js",
            output:{
                filename:"./bundle.js"
            },
            module:{
                loaders:[
                    {
                        test:/.js$/,
                        loader:"babel-loader",
                        exclude:/node_modules/
                    }
                ]
            }
        }

2. 創(chuàng)建.babelrc配置文件

        {
            "presets": ["es2015"]
        }

三、es6的遍厲和...替代anguments 1 遍厲對(duì)象和替代anguments

{
     function test3(...arg){
         for(let v of arg){
             console.log("rest",v);
         }
     }
     test3(1,2,3,4,5,"a");
 }

2. es6的遍厲對(duì)象，Object.entries

 {
     let test ={x:1,y:456};
          for(let [key,value] of Object.entries(test)){
              console.log([key,value]);
          }
 }

四、類的繼承class。 補(bǔ)充：普通方法是實(shí)例化出來(lái)的對(duì)象，靜態(tài)方法屬于類，亦可以被繼承。 1.類的基本定義生成實(shí)例

{
    class Person{
        //構(gòu)造函數(shù)。
        constructor(name = "laozhou"){ //默認(rèn)值：laozhou
            this.name = name;
        }
    }
    let p1 = new Person("小王"); //new的時(shí)候自動(dòng)執(zhí)行構(gòu)造函數(shù)。
    console.log("構(gòu)造函數(shù)和實(shí)例",p1);
}

2.繼承

extends 繼承
super   上一級(jí)，可以調(diào)用父類的構(gòu)造函數(shù)。
{
    class Father {
        constructor(name="侯瑞強(qiáng)",sex="男") {
            this.name = name;
            this.sex = sex;
        }
    }
    class Child extends Father {
        constructor(name="child",sex) { //把父類的本事拿了過(guò)來(lái)。
            super(name,sex);     //調(diào)用父類的構(gòu)造函數(shù)。super必須在第一行，否則報(bào)錯(cuò)。
            this.age = 10;
        }
    }
    console.log("子類覆蓋父類屬性的實(shí)例",new Child());
}

3.靜態(tài)屬性

{
    class Person {
        constructor(name="默認(rèn)") {
            this.name = name;
        }
    }
    //靜態(tài)屬性的定義，是直接給類下的屬性賦值，該屬性就是靜態(tài)屬性,類名點(diǎn)什么直接定義
    Person.type = "text"; //type就是靜態(tài)屬性。
    console.log(Person.type);
}

五、模塊化 1.導(dǎo)出exprot,導(dǎo)入import 導(dǎo)出

export default{
    a:1,
    b:2,
    say(){
        console.log("i can say");
    }
}

導(dǎo)入

import Model2 from "./module2.js";
console.log(Model2);

六、尾調(diào)用

一個(gè)函數(shù)執(zhí)行，執(zhí)行到最后的時(shí)候調(diào)用了另一個(gè)函數(shù)。
function go(callback){
    console.log(1231313);
    console.log("vvv");
    callback && callback();
}
function tail(){
    console.log(123131313);
}
go(tail);

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/112264.html

發(fā)表評(píng)論

登陸后可評(píng)論

0條評(píng)論

JerryWangSAP

男|高級(jí)講師

我要關(guān)注我要私信

TA的文章

Dedispec：美國(guó)堪薩斯城便宜服務(wù)器促銷(xiāo)/雙 Intel Xeon 5639/16GB/120G

閱讀 3699·2021-08-10 09:42
JSON的作用

閱讀 592·2019-08-30 15:55
前端每日實(shí)戰(zhàn)：68# 視頻演示如何用純 CSS 創(chuàng)作一本色卡

閱讀 893·2019-08-30 15:54
基于html2canvas實(shí)現(xiàn)網(wǎng)頁(yè)保存為圖片及圖片清晰度優(yōu)化

閱讀 3116·2019-08-30 13:45
前端每日實(shí)戰(zhàn)：102# 視頻演示如何用純 CSS 創(chuàng)作一個(gè)小和尚

閱讀 557·2019-08-29 16:23
前端每日實(shí)戰(zhàn)：103# 視頻演示如何用純 CSS 創(chuàng)作一只監(jiān)視眼

閱讀 1995·2019-08-29 16:23
CSS中寬度與高度

閱讀 987·2019-08-29 15:18
我的es6總結(jié)

閱讀 2267·2019-08-29 12:57

成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！

我的es6總結(jié)

相關(guān)文章