首頁 > web前端 > js教程 > 主體

JavaScript中的七種值型別與typeof運算符

黄舟
發布: 2017-02-28 14:34:11
原創
2267 人瀏覽過

打算從基礎開始複習JavaScript, 

順便分享總結一下自己學過的知識


內建類型

JavaScript中有七種內建類型,包括六種基本型別和一種引用型別

  • 基本型別

    • number(數字)

    • string(字串)

    • boolean(布林值)

    • undefined(未定義)

    • null(空值)

    • symbol(符號)【ES6規範新增】

  • # #引用類型

    • object(物件)

#注意:array陣列與function函數是特殊的對象,也就是說他們是物件的「子類型」同樣為引用值

其中基本型別是保存在棧記憶體中的簡單資料段,在記憶體中有固定的空間

引用型別是保存在堆記憶體中的對象,按引用訪問,棧記憶體保存指向對象的指針(存有對象的訪問地址)
之所以在內存中分堆疊,是因為它與瀏覽器的垃圾回收機制有關,保證運行時佔記憶體最小
上面的話沒看懂也不要緊,只要知道
基本型別是棧資料引用型別是堆資料就可以了##typeof運算子

說成是typeof運算子也可以,運算子運算子指的是同一個東西

透過這個typeof我們可以查看值型別

它傳回型別的字串(小寫英文),但並不是所有類型它都能鑑別

console.log(typeof 123);
// "number"console.log(typeof '123');
// "string"console.log(typeof true);
// "boolean"console.log(typeof undefined);
// "undefined"console.log(typeof Symbol());
// "symbol"console.log(typeof null);
// "object"  <-注意看这里console.log(typeof {demo: 123});
// "object"
登入後複製

我們把這七種類型打印到控制台發現了問題

typeof null 居然返回“object”

嗯跟我們預想的不太一樣啊
說好的回傳「null」的呢
其實這是一個歷史遺留問題,這個bug存在了二十多年了(比我歲數還大)
大概永遠也不會修復了,因為它牽扯太多Web系統了,「修復」它的代價不可想像

#不過我們可以這樣判斷null空值類型
var foo = null;if(!foo && typeof foo === &#39;object&#39;){    console.log(&#39;这是一个空值...&#39;);
}
登入後複製

因為無論什麼對象,就算空對象,轉換成布林值都是true(以後寫型別轉換的時候再說)

所以可以這樣判斷null,不過我好像沒用過


回到typeof的問題上來,我們還發現了一個問題
console.log(typeof function(){});// "function"
登入後複製

typeof對於JavaScript中的一等公民—— 可執行對象—— 函數有著特別的待遇

所以雖然函數是對象,但是typeof操作符可以區分並且返回“function”

至於函數為什麼可以調用,是因為它有一個內部屬性[[call]],所以是“可調用對象”,以後再說
哦對了,雖然數組也是特殊的對象,但是typeof不認識它
想要區分數組,可以看看我寫的如何鑑定數組
所以typeof回傳值有這些字串
number、string、boolean、undefined、object、function、symbol

既然說到了typeof,還有一個小知識點
console.log(typeof NaN)// "number"
登入後複製

同樣容易出錯,面試題可能會有

不過這可不是什麼bug

非數NaN英文
Not a Number
'不是一個數字' 那麼也就是說:不是數字的數字是數字看蒙沒,沒關係
現在只要記住NaN是number型就好了

哦對了補充一句突然想起來的
typeof雖然可以這麼用

typeof(a + b)
但是它不是函數不是函數不是函數(重要的事情說三遍) 而是一個一元運算符,切記
上面的用法只是對表達式中操作數運算的結果的類型檢查

#值與類型

這裡我說明一個這樣的問題

JavaScript中,變數沒有型,值才有型別

typeof運算子回傳的也是變數所持有值的型別的字串
因為我們是弱型別語言
所以我們可以改變變數持有值的型別

var foo = 123;console.log(typeof foo);
// "number"foo = true;console.log(typeof foo);
// "boolean"foo = &#39;abc&#39;;console.log(typeof foo);
// "string"
登入後複製

雖然變數值型別可以變,但是我們寫項目時千萬不要這麼做

我們可以給變數加前綴或者加上特殊符號讓我們記得自己宣告的是什麼類型的變數

例如,retArr,bFlag,strLen之類的

typeof undeclared

這個undeclared當然是不存在的關鍵字

不過我為什麼要這麼寫呢

來看一個問題

console.log(foo);
登入後複製

我没定义foo就打印,于是
JavaScript中的七種值型別與typeof運算符
果不其然,浏览器蒙圈了
给大家翻译成中文:未捕获引用错误: foo没有定义
可能大家都不会去注意,其实这是很容易让人误会的
在这了 is not defined != is undefind
因为我连声明都没声明,怎么谈定义
所以如果浏览器报出is not declared或许更准确
我们暂且把这种连定义都没定义的变量看作“undeclared”变量
但是对于这种“undeclared”未定义的变量,typeof有特殊的安全防范机制

console.log(typeof foo);// "undefined"
登入後複製

出乎意料的,它对于undeclared变量并没有报错,而是返回了“undefined”
虽然我们觉得它返回“undeclared”更容易理解一些(我们的要求太高了)
其实它没有报错就相当不错了
这种容错对于我们来说还是很有帮助的
比如说我们想知道全局空间有没有变量foo

if(foo){  //若不存在会报错
    //...}if(typeof foo !== &#39;undefined&#39;){  //不存在也不会报错
    //...}if(window.foo){  //不存在同样不会报错
    //...}
登入後複製

最后一种通过window对象调用与undeclared变量不同
访问不存在的对象属性是不会报错的,而是返回undefined(是类型而不是字符串)
不过如果我们全局对象不是window的话,就不能使用这种方法了(比如,node.js)

总结

JavaScript内置类型:

  • 基本类型(栈数据):number、string、boolean、undefined、null、object、symbol(ES6规范新增)

  • 引用类型(堆数据):object

typeof操作符返回值:

  • “number”

  • “string”

  • “boolean”

  • “undefined”

  • “object”

  • “function”【sp】

  • “symbol”

typeof null -> “object” 历史遗留bug

typeof NaN -> ‘number’ 注意

变量没有类型,其持有值有类型

typeof的容错机制可以用来检查undeclared(未声明)变量

 以上就是JavaScript中的七种值类型与typeof运算符的内容,更多相关内容请关注PHP中文网(www.php.cn)!


相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板