-
{ ??//?ES5 ??var?Person?=?{ ????name:?'es5', ????age:?15 ??}; ??Object.defineProperty(Person,?'sex',?{ ????writable:?false, ????value:?'male' ??}); ??console.table({name:?Person.name,?age:?Person.age,?sex:?Person.sex}); ??Person.name?=?'es5-cname'; ??console.table({name:?Person.name,?age:?Person.age,?sex:?Person.sex}); ??try?{ ????Person.sex?=?'female'; ????console.table({name:?Person.name,?age:?Person.age,?sex:?Person.sex}); ??}?catch?(e)?{ ????console.log(e); ??} }{ ??//?ES6 ??let?Person?=?{ ????name:?'es6', ????sex:?'male', ????age:?15 ??}; ??let?person?=?new?Proxy(Person,?{ ????get(target,?key)?{ ??????return?target[key] ????}, ????set(target,key,value){ ??????if(key!=='sex'){ ????????target[key]=value; ??????} ????} ??}); ??console.table({ ????name:person.name, ????sex:person.sex, ????age:person.age ??}); ??try?{ ????person.sex='female'; ??}?catch?(e)?{ ????console.log(e); ??}?finally?{ ??} }查看全部 -
{ ??//?ES3,ES5?可變參數(shù) ??function?f()?{ ????var?a?=?Array.prototype.slice.call(arguments); ????var?sum?=?0; ????a.forEach(function(item)?{ ??????sum?+=?item?*?1; ????}) ????return?sum ??} ??console.log(f(1,?2,?3,?6)); }{ ??//?ES6?可變參數(shù) ??function?f(...a)?{ ????var?sum?=?0; ????a.forEach(item?=>?{ ??????sum?+=?item?*?1 ????}); ????return?sum ??} ??console.log(f(1,?2,?3,?6)); }查看全部 -
{ ??//?ES6?默認(rèn)參數(shù) ??function?f(x,?y?=?7,?z?=?42)?{ ????return?x?+?y?+?z ??} ??console.log(f(1,?3)); }查看全部 -
{ ??//?ES3,ES5 ??var?evens?=?[1,?2,?3,?4,?5]; ??var?odds?=?evens.map(function(v)?{ ????return?v?+?1 ??}); ??console.log(evens,?odds); };{ ??//?ES6 ??let?evens?=?[1,?2,?3,?4,?5]; ??let?odds?=?evens.map(v?=>?v?+?1); ??console.log(evens,?odds); }?{ ??//?ES3,ES5 ??var?factory?=?function()?{ ????this.a?=?'a'; ????this.b?=?'b'; ????this.c?=?{ ??????a:?'a+', ??????b:?function()?{ ????????return?this.a ??????} ????} ??} ??console.log(new?factory().c.b()); };{ ??//?ES3,ES5 ??var?factory?=?function()?{ ????this.a?=?'a'; ????this.b?=?'b'; ????this.c?=?{ ??????a:?'a+', ??????b:?function()?{ ????????return?this.a ??????} ????} ??} ??console.log(new?factory().c.b()); }; { ??var?factory?=?function()?{ ????this.a?=?'a'; ????this.b?=?'b'; ????this.c?=?{ ??????a:?'a+', ??????b:?()?=>?{ ????????return?this.a ??????} ????} ??} ??console.log(new?factory().c.b()); }查看全部 -
ES6箭頭函數(shù)語法：當(dāng){}中的表達(dá)式只有一個(gè)時(shí)，可以省略{}
查看全部 -
立即執(zhí)行函數(shù)
;((function()?{ ????const?foo?=?function()?{ ????????return?1 ????} ????console.log("foo()===1",?foo()?===?1) ????;((function()?{ ????????const?foo?=?function()?{ ????????????return?2 ????????} ????????console.log("foo()===2",?foo()?===?2) ????})()) })())ES6中使用{}指定作用域
{ ????function?foo()?{ ????????return?1 ????} ????console.log("foo()===1",?foo()?===?1) ????{ ????????function?foo()?{ ????????????return?2 ????????} ????????console.log("foo()===2",?foo()?===?2) ????} ????console.log("foo()===1",?foo()?===?1) }查看全部 -
//?ES5?中作用域 const?callbacks?=?[] for?(var?i?=?0;?i?<=?2;?i++)?{ ????callbacks[i]?=?function()?{ ????????return?i?*?2 ????} } console.table([ ????callbacks[0](), ????callbacks[1](), ????callbacks[2](), ])const?callbacks2?=?[] for?(let?j?=?0;?j?<=?2;?j++)?{ ????callbacks2[j]?=?function()?{ ????????return?j?*?2 ????} } console.table([ ????callbacks2[0](), ????callbacks2[1](), ????callbacks2[2](), ])查看全部 -
touch表示創(chuàng)建文件。
//?ES5?中常量的寫法 Object.defineProperty(window,?"PI2",?{ ????value:?3.1415926, ????writable:?false, })//?ES6?的常量寫法 const?PI?=?3.1415926 console.log(PI)
查看全部 -
使用npm或cnpm命令下載源碼
查看全部 -
ES6入門環(huán)境準(zhǔn)備
查看全部 -
ES6入門前置知識(shí)包括git、webpack和js.
查看全部 -
查看全部
-
npm start 出錯(cuò)如下：
提示：Error: listen EADDRINUSE: address already in use 127.0.0.1:9000，這說明9000端口被占用，查看一下是什么進(jìn)程在使用：lsof -i tcp:9000，發(fā)現(xiàn)是php-fpm，結(jié)束php進(jìn)程即可：brew services stop php@7.2再運(yùn)行 `npm start`，成功：
查看全部 -
npm i出錯(cuò)如下：
`node-pre-gyp ERR! Tried to download(404): https://fsevents-binaries.s3-us-west-2.amazonaws.com/v1.1.3/fse-v1.1.3-node-v64-darwin-x64.tar.gz`
經(jīng)過查閱，發(fā)現(xiàn)是由于node.js版本太新導(dǎo)致，我默認(rèn)版本為10，切換為8來安裝就可以了。老師也不說一下自己的node.js版本，這基礎(chǔ)課一點(diǎn)都不基礎(chǔ)。
查看全部 -
對(duì)象操作：
es3:通過使用閉包在函數(shù)作用域內(nèi)創(chuàng)建api的方法（get，set），用if判斷是否可修改
es5:直接創(chuàng)建一個(gè)對(duì)象，賦值修改，用Object.defineProperty()設(shè)置是否可讀
es6原生語法代理 :?
new Proxy() ; ?object 為 用戶訪問操作的代理對(duì)象，而不是原始對(duì)象 //ES6??
?let Person = { ?//創(chuàng)建一對(duì)象 ? ??
name: 'es6', ? ??
sex: 'male', ? ??
age: 15 ?
?}; ??
let person = new Proxy(Person, { ?//Person為代理的對(duì)象 ? ?
?get(target, key) { ? //get為讀取操作，參數(shù)target為代理對(duì)象的數(shù)據(jù)，key是你要讀的哪個(gè)屬性。? return target[key] ? ??
}, ? ??
set(target,key,value){ //set為設(shè)置修改操作，value為屬性值 ? ? ?
?if(key!=='sex'){ ? ? ? ? target[key]=value; ? ? ? } ? ?
?} ?
?});
訪問：person.age
修改：person.age=12
set方法中可以寫邏輯，不影響業(yè)務(wù)邏輯
查看全部
舉報(bào)