ES6學(xué)習(xí)筆記

1、箭頭函數(shù)一般是針對匿名函數(shù)來使用的喻粹,形如var fun = function(a,b,c){ }的形式蟆融,寫成var fun => (a,b,c){ }的樣式。

2守呜、函數(shù)體內(nèi)的this對象型酥,就是定義時所在的對象,而不是調(diào)用時所在的對象(以前的js語法this指向是調(diào)用它的對象)查乒。

3弥喉、擴(kuò)展運算符(...),可以用于拼接數(shù)組(a.push(...b))侣颂;解構(gòu)(let {a,b,c} = {a:1,b:2,c:3,d:4})档桃。

4、模板字符串()憔晒,模板字符串會保留換行藻肄,如果需要使用變量(${變量名})來調(diào)用。

5拒担、解構(gòu)賦值:

          數(shù)組解構(gòu):let arr = [a,b,c] = [1,2,3]

          對象解構(gòu):

                 1)嘹屯、let obj = {id,name} = {id:1,name:'小明'}

                 2)、let  id=1从撼;let name='小明'州弟; let obj = {id,name}钧栖;即可解構(gòu)對象。

         嵌套解構(gòu):let user = '';

                          let obj = {

                                    id:1,

                                    prop:[3,{name:'小明'}]
                         };

                     let objClone = {prop:[,{name:user}]} = obj;

其中user便被解構(gòu)賦值為小明了婆翔!

6拯杠、Promise對象

創(chuàng)建Promise對象
var promiseObj = new Promise(function (resolve, reject) {
  setTimeout(() => {
    resolve('111111');
  }, 5000);
});
promiseObj.then((data) => {
  console.log(data);
}).catch((error) => {
  console.log(error);
});

7、async awite(異步函數(shù))
async 函數(shù)的返回值很特殊: 不管在函數(shù)體內(nèi) return 了什么值, async 函數(shù)的實際返回值總是一個 Promise 對象.

async function foo () {
  var a = await new Promise((resolve) => {
    setTimeout(() => {
      resolve(1);
    }, 2000);
  });
  console.log(a);
}
foo();

Promise對象會順序執(zhí)行啃奴,如下date2會等待date1執(zhí)行完畢后才會執(zhí)行潭陪,
這對于date2需要使用date1的數(shù)據(jù)的情況非常有用

async function getData () {
  // 假裝請求數(shù)據(jù)1
  var data1 = await new Promise((resolve) => {
    setTimeout(() => {
      resolve('data1');
    }, 5000);
  });
    // 假裝請求數(shù)據(jù)2且此請求依賴數(shù)據(jù)1
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve('data2');
    }, 1000);
  });
}

getData().then((v) => {
  console.log(v);
});

8、calss
類的初始化方法

class Person {
  constructor (x, y) {
    this.x = x;
    this.y = y;
  }
  foo () {
    console.log('我是類的方法最蕾!');
    console.log(this.x + this.y);
    return this.x + this.y;
  }
}
 var man = new Person(1, 2);
 man.foo();

類的繼承,需要注意extends和super()關(guān)鍵字依溯;

class Teacher extends Person {
  constructor (x, y, job) {
    super(x, y);
    this.job = job;
  }
  teacherfoo () {
    var count = super.foo();
    console.log(this.job);
  }
}
var te = new Teacher(2, 3, '教師');
te.teacherfoo();

原生javascript類和繼承:

function Person(name,age){
    this.name = name;
    this.age = age;
    this.jos = function(){
        console.log('前端開發(fā)工程師');
    }
}
function Man(name,age,body){
    Person.call(this,name,age);//構(gòu)造函數(shù)式繼承,繼承父類的name和age
    this.body = body;
    this.fun = function(){
        console.log('男人');
    }
}
Man.prototype = new Person();//類式繼承瘟则,子類原型繼承
Man.prototype.constructor = Man;// 修正子類構(gòu)造函數(shù)的指向

9黎炉、Proxy(代理)
Proxy 可以理解成,在目標(biāo)對象之前架設(shè)一層“攔截”醋拧,外界對該對象的訪問慷嗜,都必須先通過這層攔截,因此提供了一種機(jī)制趁仙,可以對外界的訪問進(jìn)行過濾和改寫洪添。Proxy 這個詞的原意是代理,用在這里表示由它來“代理”某些操作雀费,可以譯為“代理器”。

let targetObj = {
    _name:'小明',
    _age:18,
    score:90
};

let handlerFun = {
    set:()=>{

    },
    get:(target,key)=>{
        if(key.startsWith('_')){
            console.log('私有變量');
            return false;
        }
        return target[key];
    },
};
let targetProxy = new Proxy(targetObj,handlerFun);

console.log(targetProxy._name);
console.log(targetProxy._age);
console.log(targetProxy.score);

上面的例子重寫了對象的get方法痊焊,每次在調(diào)用對象的屬性時都會經(jīng)過這個函數(shù)盏袄,以上添加的是判斷私有變量的代碼,是私有變量就會返回false薄啥。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末辕羽,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子垄惧,更是在濱河造成了極大的恐慌刁愿,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,546評論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件到逊,死亡現(xiàn)場離奇詭異铣口,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)觉壶,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,224評論 3 395
  • 文/潘曉璐 我一進(jìn)店門脑题,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人铜靶,你說我怎么就攤上這事叔遂。” “怎么了?”我有些...
    開封第一講書人閱讀 164,911評論 0 354
  • 文/不壞的土叔 我叫張陵已艰,是天一觀的道長痊末。 經(jīng)常有香客問我,道長哩掺,這世上最難降的妖魔是什么凿叠? 我笑而不...
    開封第一講書人閱讀 58,737評論 1 294
  • 正文 為了忘掉前任,我火速辦了婚禮疮丛,結(jié)果婚禮上幔嫂,老公的妹妹穿的比我還像新娘。我一直安慰自己誊薄,他們只是感情好履恩,可當(dāng)我...
    茶點故事閱讀 67,753評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著呢蔫,像睡著了一般切心。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上片吊,一...
    開封第一講書人閱讀 51,598評論 1 305
  • 那天绽昏,我揣著相機(jī)與錄音,去河邊找鬼俏脊。 笑死全谤,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的爷贫。 我是一名探鬼主播认然,決...
    沈念sama閱讀 40,338評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼漫萄!你這毒婦竟也來了卷员?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,249評論 0 276
  • 序言:老撾萬榮一對情侶失蹤腾务,失蹤者是張志新(化名)和其女友劉穎毕骡,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體岩瘦,經(jīng)...
    沈念sama閱讀 45,696評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡未巫,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,888評論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了担钮。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片橱赠。...
    茶點故事閱讀 40,013評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖箫津,靈堂內(nèi)的尸體忽然破棺而出狭姨,到底是詐尸還是另有隱情宰啦,我是刑警寧澤,帶...
    沈念sama閱讀 35,731評論 5 346
  • 正文 年R本政府宣布饼拍,位于F島的核電站赡模,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏师抄。R本人自食惡果不足惜漓柑,卻給世界環(huán)境...
    茶點故事閱讀 41,348評論 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望叨吮。 院中可真熱鬧辆布,春花似錦、人聲如沸茶鉴。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,929評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽涵叮。三九已至惭蹂,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間割粮,已是汗流浹背盾碗。 一陣腳步聲響...
    開封第一講書人閱讀 33,048評論 1 270
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留舀瓢,地道東北人廷雅。 一個月前我還...
    沈念sama閱讀 48,203評論 3 370
  • 正文 我出身青樓,卻偏偏與公主長得像京髓,于是被迫代替她去往敵國和親榜轿。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,960評論 2 355

推薦閱讀更多精彩內(nèi)容