js中判斷變量類型函數(shù)typeof的用法總結(jié)
1、作用:
typeof 運算符返回一個用來表示表達式的數(shù)據(jù)類型的字符串。
可能的字符串有:"number"、"string"、"boolean"、"object"、"function" 和 "undefined"。
2、常用返回值說明
表達式 | 返回值 |
typeof undefined | 'undefined' |
typeof null | 'object' |
typeof true | 'boolean' |
typeof 123 | 'number' |
typeof "abc" | 'string' |
typeof function() {} | 'function' |
typeof {} | 'object' |
typeof [] | 'object' |
typeof unknownVariable | 'undefined' |
注意:類型返回值都是字符串、而且都是小寫打頭
3、常規(guī)應(yīng)用:
1).檢查一個變量是否存在,是否有值.
typeof在兩種情況下會返回"undefined":一個變量沒有被聲明的時候,和一個變量的值是undefined的時候.例如:
> typeof undeclaredVariable === "undefined" true
> var declaredVariable;
> typeof declaredVariable 'undefined'
> typeof undefined 'undefined'
還有其他辦法檢測某個值是否是undefined:
> var value = undefined;
> value === undefined true
但這種方法如果使用在一個未聲明的變量上的時候,就會拋出異常,因為只有typeof才可以正常檢測未聲明的變量的同時還不報錯:
> undeclaredVariable === undefined ReferenceError: undeclaredVariable is not defined
注意:未初始化的變量,沒有被傳入?yún)?shù)的形參,不存在的屬性,都不會出現(xiàn)上面的問題,因為它們總是可訪問的,值總是undefined:
> var declaredVariable;
> declaredVariable === undefined true
> (function (x) { return x === undefined }()) true
> ({}).foo === undefined true
注:因此,如果想檢測一個可能沒有被聲明的全局變量是否存在,也可以使用 if(window.maybeUndeclaredVariable){}
問題: typeof在完成這樣的任務(wù)時顯得很繁雜.
解決辦法: 這樣的操作不是很常見,所以有人覺的沒必要再找更好的解決辦法了.不過也許有人會提出一個專門的操作符:
> defined undeclaredVariable false
> var declaredVariable;
> defined declaredVariable false
或者,也許有人還需要一個檢測變量是否被聲明的操作符:
> declared undeclaredVariable false
> var declaredVariable;
> declared declaredVariable true
譯者注:在perl里,上面的defined操作符相當(dāng)于defined(),上面的declared操作符相當(dāng)于exists(),
2.判斷一個值不等于undefined也不等于null
問題:如果你想檢測一個值是否被定義過(值不是undefined也不是null),那么你就遇到了typeof最有名的一個怪異表現(xiàn)(被認為是一個bug):typeof null返回了"object":
> typeof null 'object'
注:這只能說是最初的JavaScript實現(xiàn)的bug,而現(xiàn)在標準就是這樣規(guī)范的.V8曾經(jīng)修正并實現(xiàn)過typeof null === "null",但最終證明不可行.http://wiki.ecmascript.org/doku.php?id=harmony:typeof_null
解決辦法: 不要使用typeof來做這項任務(wù),用下面這樣的方法來代替:但是變量x必須事先聲明,否則會報錯。
function isDefined(x) { return x !== null && x !== undefined; }
另一個可能性是引入一個“默認值運算符”,在myValue未定義的情況下,下面的表達式會返回defaultValue:
myValue || defaultValue
上面的表達式等價于:
(myValue !== undefined && myValue !== null) ? myValue : defaultValue
其實是下面這條語句的簡化:
myValue = myValue || defaultValue
3.區(qū)分對象值和原始值
下面的函數(shù)用來檢測x是否是一個對象值:
function isObject(x) { return (typeof x === "function" || (typeof x === "object" && x !== null)); }
問題: 上面的檢測比較復(fù)雜,是因為typeof把函數(shù)和對象看成是不同的類型,而且typeof null返回"object".
解決辦法: 下面的方法也經(jīng)常用于檢測對象值:
function isObject2(x) { return x === Object(x); }
警告:你也許認為這里可以使用instanceof Object來檢測,但是instanceof是通過使用使用一個對象的原型來判斷實例關(guān)系的,那么沒有原型的對象怎么辦呢:
> var obj = Object.create(null);
> Object.getPrototypeOf(obj) null
obj確實是一個對象,但它不是任何值的實例:
> typeof obj 'object'
> obj instanceof Object false
在實際中,你可能很少遇到這樣的對象,但它的確存在,而且有它的用途.
譯者注:Object.prototype就是一個默認存在的,沒有原型的對象
>Object.getPrototypeOf(Object.prototype) null
>typeof Object.prototype 'object'
>Object.prototype instanceof Object false
4.原始值的類型是什么?
typeof是最好的用來查看某個原始值的類型的方式.
> typeof "abc" 'string'
> typeof undefined 'undefined'
問題: 你必須知道typeof null的怪異表現(xiàn).
> typeof null // 要小心! 'object'
解決辦法: 下面的函數(shù)可以修復(fù)這個問題(只針對這個用例).
function getPrimitiveTypeName(x) {
var typeName = typeof x;
switch(typeName) {
case "undefined": case "boolean": case "number": case "string": return typeName;
case "object": if (x === null) { return "null"; }
default: // 前面的判斷都沒通過 throw new TypeError("參數(shù)不是一個原始值: "+x);
} }
更好的解決辦法: 實現(xiàn)一個函數(shù)getTypeName(),除了可以返回原始值的的類型,還可以返回對象值的內(nèi)部[[Class]]屬性.這里講了如何實現(xiàn)這個函數(shù)(譯者注:jQuery中的$.type就是這樣的實現(xiàn))
5.某個值是否是函數(shù)
typeof可以用來檢測一個值是否是函數(shù).
> typeof function () {} 'function'
> typeof Object.prototype.toString 'function'
原則上說,instanceof Function也可以進行這種需求的檢測.乍一看,貌似寫法還更加優(yōu)雅.但是,瀏覽器有一個怪癖:每一個框架和窗口都有它自己的全局變量.因此,如果你將某個框架中的對象傳到另一個框架中,instanceof就不能正常工作了,因為這兩個框架有著不同的構(gòu)造函數(shù).這就是為什么ECMAScript5中會有Array.isArray()方法的原因.如果有一個能夠跨框架的,用于檢查一個對象是否是給定的構(gòu)造函數(shù)的實例的方法的話,那會很好.上述的getTypeName()是一個可用的變通方法,但也許還有一個更根本的解決方案.
6.綜述
下面提到的,應(yīng)該是目前JavaScript中最迫切需要的,可以代替一些typeof目前職責(zé)的功能特性:
isDefined() (比如Object.isDefined()): 可以作為一個函數(shù)或者一個運算符
isObject()
getTypeName()
能夠跨框架的,檢測一個對象是否是指定的構(gòu)造函數(shù)的實例的機制
檢查某個變量是否已經(jīng)被聲明這樣的需求,可能沒那么必要有自己的運算符.
以上這篇js中判斷變量類型函數(shù)typeof的用法總結(jié)就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript實現(xiàn)文件下載的超簡單兩種方式分享
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)文件下載的超簡單兩種方式,文中的示例代碼講解詳細,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-12-12JavaScript實現(xiàn)獲取img的原始尺寸的方法詳解
在微信小程序開發(fā)時,它的image標簽有一個默認高度,這樣你的圖片很可能出現(xiàn)被壓縮變形的情況,所以就需要獲取到圖片的原始尺寸對image的寬高設(shè)置,本文就來分享一下JavaScript實現(xiàn)獲取img的原始尺寸的方法吧2023-03-03基于原生JavaScript實現(xiàn)SPA單頁應(yīng)用
單頁Web應(yīng)用?(single?page?web?application,SPA)?,就是只有一張Web頁面的應(yīng)用,是加載單個HTML?頁面并在用戶與應(yīng)用程序交互時動態(tài)更新該頁面的Web應(yīng)用程序。本文將利用原生JS實現(xiàn)SPA單頁應(yīng)用,需要的可以參考一下2023-03-03javascript中Date()函數(shù)在各瀏覽器中的顯示效果
本文給大家分享的是javascript中Date()函數(shù)在各瀏覽器中的顯示效果,由于各大瀏覽器的兼容性問題,本文做了這個測試,希望有需要的小伙伴可以少走些彎路2015-06-06微信小程序開發(fā)搜索功能實現(xiàn)(前端+后端+數(shù)據(jù)庫)
這篇文章主要介紹了微信小程序開發(fā)搜索功能實現(xiàn),文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-03-03bootstrap Validator 模態(tài)框、jsp、表單驗證 Ajax提交功能
這篇文章主要介紹了bootstrap Validator 模態(tài)框、jsp、表單驗證 Ajax提交功能的實現(xiàn)代碼,非常不錯,具有參考借鑒價值,需要的朋友參考下2017-02-02