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

資訊專(zhuān)欄INFORMATION COLUMN

es6中容易忽視的細(xì)節(jié)（三）

Michael_Lin / 506人閱讀

摘要：模塊就是對(duì)象，輸入時(shí)必須查找對(duì)象屬性模塊不是對(duì)象，而是通過(guò)命令顯式指定輸出的代碼，再通過(guò)命令輸入。大括號(hào)里面的變量名，必須與被導(dǎo)入模塊對(duì)外接口的名稱相同。

proxy代理的坑 

var obj = {index:"index"}
    var newObj = new Proxy(obj,{
        get:(target,key)=>{
            console.log(target)  // {index: "index"}
            return target[key]+123;
            // return target.key  如果這塊這樣返回的話訪問(wèn)newObj.index就會(huì)報(bào)undefined
        }
    })
    newObj.index    // index123
    實(shí)踐中遇到這樣的問(wèn)題，但是具體什么原因還還弄清楚，有誰(shuí)希望大家在底部留言告知，不勝感激

es6中模塊與commonJs的區(qū)別

ES6 模塊的設(shè)計(jì)思想，是盡量的靜態(tài)化，使得編譯時(shí)就能確定模塊的依賴關(guān)系，以及輸入和輸出的變量。

CommonJS 模塊就是對(duì)象，輸入時(shí)必須查找對(duì)象屬性；ES6 模塊不是對(duì)象，而是通過(guò)export命令顯式指定輸出的代碼，再通過(guò)import命令輸入。

```
// CommonJS模塊：這種引入方式只有在運(yùn)行時(shí)加載，并且把整個(gè)fs對(duì)象引入，不能夠靜態(tài)加載
let { stat, exists, readFile } = require("fs");
// ES6模塊：es6的模塊中的每一個(gè)組件都是獨(dú)立的，這樣引入只把對(duì)應(yīng)組件引入，能夠靜態(tài)加載(這就導(dǎo)致無(wú)法動(dòng)態(tài)的加載需要模塊，實(shí)現(xiàn)模塊的按需加載)
import { stat, exists, readFile } from "fs";
```

import命令接受一對(duì)大括號(hào)，里面指定要從其他模塊導(dǎo)入的變量名。大括號(hào)里面的變量名，必須與被導(dǎo)入模塊（profile.js）對(duì)外接口的名稱相同。

var a={name:"zhangsan",sex:"man"};
export {person as a};

import {personX as person} form "./person.js";

import命令有自動(dòng)提升的功能，會(huì)自動(dòng)提升到文件的頂部，所以在文件中只要我們引入即可使用，不需要考慮引入的位置，與let相反

console.log(personX);    // {name:"zhangsan",sex:"man"};這樣不會(huì)報(bào)錯(cuò)
import {personX as person} form "./person.js";

import是靜態(tài)執(zhí)行，所有在引入組件過(guò)程中能不能摻雜任何表達(dá)式

// 報(bào)錯(cuò)
if (x === 1) {
  import { foo } from "module1";
} else {
  import { foo } from "module2";
}
import "lodash"    // 這樣會(huì)直接執(zhí)行模塊

import命令與require命令同時(shí)存在時(shí)會(huì)先執(zhí)行import命令，因?yàn)閕mport在靜態(tài)解析階段執(zhí)行，所以它是一個(gè)模塊之中最早執(zhí)行的。

import與export結(jié)合使用

export { es6 as default } from "./someModule";

// 等同于
import { es6 } from "./someModule";
export default es6;
這樣暴露在另一個(gè)文件中引入的時(shí)候就可以 import anyName from "es6";

import()類(lèi)似于commonJs的require()區(qū)別是前者是異步執(zhí)行，后者是同步執(zhí)行

擴(kuò)展

module.exports==export.default，這樣暴露引入的時(shí)候就可以任意指定模塊名稱，exports暴露引入時(shí)只能用{}把內(nèi)部組件包裹起來(lái)

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

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

相關(guān)文章

  • es6中容易忽視的細(xì)節(jié)（一）

    摘要：但是對(duì)于復(fù)雜類(lèi)型的數(shù)據(jù)數(shù)組對(duì)象，保存的是一個(gè)指針，真正的數(shù)據(jù)是存儲(chǔ)在堆區(qū)，只能保證這個(gè)指針不會(huì)變化，不能保證里面的數(shù)據(jù)不發(fā)生變化的變量聲明方式在中聲明的全局變量是和頂層對(duì)象的屬性對(duì)等的獲取全局對(duì)象的方法 你可能不知道的let與const let var聲明的變量會(huì)發(fā)生變量提升，在var聲明之前調(diào)用該變量會(huì)數(shù)處undefined,但是let聲明的變量不會(huì)發(fā)生提升，在聲明之前調(diào)用就會(huì)...

    baishancloud 評(píng)論0 收藏0

  • es6中容易忽視的細(xì)節(jié)（二）

    摘要：變量的解構(gòu)賦值結(jié)構(gòu)賦值允許使用默認(rèn)值內(nèi)部使用嚴(yán)格相等運(yùn)算符，判斷一個(gè)位置是否有值。所以，只有當(dāng)一個(gè)數(shù)組成員嚴(yán)格等于，默認(rèn)值才會(huì)生效。這樣的層層判斷非常麻煩，因此現(xiàn)在有一個(gè)提案，引入了傳導(dǎo)運(yùn)算符，簡(jiǎn)化上面的寫(xiě)法。 變量的解構(gòu)賦值 結(jié)構(gòu)賦值允許使用默認(rèn)值 let [foo = true] = []; foo // true ES6 內(nèi)部使用嚴(yán)格相等運(yùn)算符（===），判斷一個(gè)位置是否...

    RayKr 評(píng)論0 收藏0

  • 2018前端值得關(guān)注的技術(shù)

    摘要：年前端有哪些領(lǐng)域，技術(shù)值得關(guān)注，哪些技術(shù)會(huì)興起，哪些技術(shù)會(huì)沒(méi)落。自從谷歌提出后，就持續(xù)的獲得了業(yè)界的關(guān)注，熱度可見(jiàn)一斑。就在今年，谷歌也宣布將獲得與安卓原生應(yīng)用同等的待遇與權(quán)限。但是無(wú)論都值得關(guān)注。 1.前言 2017悄然過(guò)去，2018已經(jīng)來(lái)到。人在進(jìn)步，技術(shù)在發(fā)展。2018年前端有哪些領(lǐng)域，技術(shù)值得關(guān)注，哪些技術(shù)會(huì)興起，哪些技術(shù)會(huì)沒(méi)落。下面就我個(gè)人的判斷進(jìn)行一個(gè)預(yù)測(cè)判斷，希望能對(duì)大家...

    xiao7cn 評(píng)論0 收藏0

  • 2018前端值得關(guān)注的技術(shù)

    摘要：年前端有哪些領(lǐng)域，技術(shù)值得關(guān)注，哪些技術(shù)會(huì)興起，哪些技術(shù)會(huì)沒(méi)落。自從谷歌提出后，就持續(xù)的獲得了業(yè)界的關(guān)注，熱度可見(jiàn)一斑。就在今年，谷歌也宣布將獲得與安卓原生應(yīng)用同等的待遇與權(quán)限。但是無(wú)論都值得關(guān)注。 1.前言 2017悄然過(guò)去，2018已經(jīng)來(lái)到。人在進(jìn)步，技術(shù)在發(fā)展。2018年前端有哪些領(lǐng)域，技術(shù)值得關(guān)注，哪些技術(shù)會(huì)興起，哪些技術(shù)會(huì)沒(méi)落。下面就我個(gè)人的判斷進(jìn)行一個(gè)預(yù)測(cè)判斷，希望能對(duì)大家...

    用戶84 評(píng)論0 收藏0

  • Polyfill：Function.prototype.bind的四個(gè)階段

    摘要：第二階段被忽略的細(xì)節(jié)函數(shù)的屬性，用于表示函數(shù)的形參。第三階段被忽視的細(xì)節(jié)通過(guò)生成的構(gòu)造函數(shù)。五本文涉及的知識(shí)點(diǎn)的用法的用法除操作符外的構(gòu)造函數(shù)的用法下詭異的命名函數(shù)表達(dá)式技術(shù)六總結(jié)在這之前從來(lái)沒(méi)想過(guò)一個(gè)的會(huì)涉及這么多知識(shí)點(diǎn)，感謝給的啟發(fā)。 昨天邊參考es5-shim邊自己實(shí)現(xiàn)Function.prototype.bind，發(fā)現(xiàn)有不少以前忽視了的地方，這里就作為一個(gè)小總結(jié)吧。 一、Fu...

    mudiyouyou 評(píng)論0 收藏0

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

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<