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

資訊專欄INFORMATION COLUMN

vue源碼解讀-Flow

Jacendfeng / 1463人閱讀

摘要:版本基于在閱讀源碼之前建議大家先了解下是出品的靜態(tài)類型檢查工具。的源碼利用了做了靜態(tài)類型檢查,所以了解有助于我們閱讀源碼這里簡單的介紹下的工作方式類型推斷通過變量的使用上下文來推斷出變量類型,然后根據(jù)這些推斷來檢查類型。

版本基于2.5.17-beta.0
在閱讀源碼之前建議大家先了解下Flow
Flow 是 facebook 出品的 JavaScript 靜態(tài)類型檢查工具。Vue.js 的源碼利用了 Flow 做了靜態(tài)類型檢查,所以了解 Flow 有助于我們閱讀源碼
這里簡單的介紹下Flow
Flow 的工作方式
類型推斷:通過變量的使用上下文來推斷出變量類型,然后根據(jù)這些推斷來檢查類型。
類型注釋:事先注釋好我們期待的類型,F(xiàn)low 會基于這些注釋來判斷。

類型推斷

function split(str) {
    return str.split("")
}
split(11)

Flow 檢查上述代碼后會報錯,因為函數(shù) split 期待的參數(shù)是字符串,而我們輸入了數(shù)字。

類型注釋
添加類型注釋可以提供更好更明確的檢查依據(jù)

/*@flow*/
function test(x: number, y: number): number {
    return x + y
}
test("str", 0)

因為函數(shù)參數(shù)的期待類型為數(shù)字,而我們提供了字符串。flow會報錯

flow中對數(shù)組,函數(shù),類和對象都能添加類型注釋
數(shù)組

/*@flow*/

var arr: Array = [1, 2, 3]

arr.push("str")

類和對象

/*@flow*/

class Person {

constructor(name: string, age: string | number) {
this.name= name
this.age= age
this.sex= false
}}

var per: Person = new Person("xiaoli", 4)

var obj: { arr: Array, per: Person} = {
arr: ["hello"]
per: new Person("hello", 3)
}

想到數(shù)據(jù)類型大家當然忘不了 null, undefined
如果先讓任意類型可以是 null 或者 undefined 則需要寫成 ?T 的格式即可,注意T就是類型

/*@flow*/
var age: ?number = null
age可以為數(shù)字或者 null

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

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/108744.html

相關(guān)文章

  • 解讀Vue.use()源碼

    摘要:的作用官方文檔的解釋安裝插件。下面展示源碼源碼中采用了的語法。語法,官方解釋是簡單的意思就是是代碼的靜態(tài)類型檢查工具。官網(wǎng)鏈接使用的好處就是在編譯期對代碼變量做類型檢查,縮短調(diào)試時間,減少因類型錯誤引起的。此時方法內(nèi)的指向?qū)ο蟆? Vue.use() vue.use()的作用: 官方文檔的解釋: 安裝 Vue.js 插件。如果插件是一個對象,必須提供 install 方法。如果插件是一...

    funnyZhang 評論0 收藏0
  • vue源碼解讀-目錄結(jié)構(gòu)

    摘要:目錄結(jié)構(gòu)構(gòu)建相關(guān)的文件,一般情況下我們不需要動鉤子別名配置 目錄結(jié)構(gòu) ├── scripts ------------------------------- 構(gòu)建相關(guān)的文件,一般情況下我們不需要動│ ├── git-hooks ------------------------- git鉤子│ ├── alias.js -------------------------- 別名配...

    philadelphia 評論0 收藏0
  • vue 源碼學習(一) 目錄結(jié)構(gòu)和構(gòu)建過程簡介

    摘要:框架使用了作為類型檢查,來保證項目的可讀性和維護性。的主目錄下有的配置文件,還有目錄,指定了各種自定義類型。表示構(gòu)建出來的文件遵循規(guī)范。 Flow vue框架使用了Flow作為類型檢查,來保證項目的可讀性和維護性。vue.js的主目錄下有Flow的配置.flowconfig文件,還有flow目錄,指定了各種自定義類型。 在學習源碼前可以先看下Flow的語法 官方文檔 目錄結(jié)構(gòu) vue....

    lavnFan 評論0 收藏0
  • Vue源碼之目錄結(jié)構(gòu)

    摘要:運行時用來創(chuàng)建實例渲染并處理虛擬等的代碼?;旧暇褪浅ゾ幾g器的其它一切。版本可以通過標簽直接用在瀏覽器中。為這些打包工具提供的默認文件是只有運行時的構(gòu)建。為瀏覽器提供的用于在現(xiàn)代瀏覽器中通過直接導入。 Vue版本:2.6.9 源碼結(jié)構(gòu)圖 ├─ .circleci // 包含CircleCI持續(xù)集成/持續(xù)部署工具的配置文件 ├─ .github ...

    freewolf 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<