亚洲精品中文字幕无乱码_久久亚洲精品无码AV大片_最新国产免费Av网址_国产精品3级片

java語言

如何檢查JavaScript變量的類型

時間:2024-09-19 19:05:08 java語言 我要投稿
  • 相關(guān)推薦

如何檢查JavaScript變量的類型

  JavaScript基本數(shù)據(jù)類型有5種:字符串、數(shù)字、布爾、null、undefined。 用戶定義的類型(object)并沒有類的聲明,因此繼承關(guān)系只能通過構(gòu)造函數(shù)和原型鏈來檢查。 如何檢查一個變量的類型?以下僅供參考!

  先給結(jié)論:

  如果你要判斷的是基本數(shù)據(jù)類型或JavaScript內(nèi)置對象,使用toString; 如果要判斷的時自定義類型,請使用instanceof。

  不同的編程語言都有自己的方式來提供類型信息,例如C#的反射、C++的Traits, JavaScript提供類型信息的方式更加靈活,因而也容易產(chǎn)生很多誤用。 下面來分析常見類型檢查手段的區(qū)別:typeof, instanceof, constructor, toString。

  如果你在尋找類型轉(zhuǎn)換的解決方案,而非類型檢查,請移步JavaScript類型轉(zhuǎn)換。

  typeof

  typeof 操作符返回的是類型字符串,它的返回值有6種取值:

  typeof 3 // "number"

  typeof "abc" // "string"

  typeof {} // "object"

  typeof true // "boolean"

  typeof undefined // "undefined"

  typeof function(){} // "function"

  所有對象的typeof都是"object",不能用于檢測用戶自定義類型。 比如Date, RegExp, Array, DOM Element的類型都是"object":

  typeof [] // "object"

  typeof還有一個知名的bug:

  typeof null  // "object"

  null是基本數(shù)據(jù)類型,它的類型顯然是Null。其實(shí)這也反映了null的語義, 它是一個空指針表示對象為空,而undefined才表示什么都沒有。 總之,typeof只能用于基本數(shù)據(jù)類型檢測,對于null還有Bug。

  instanceof

  instanceof操作符用于檢查某個對象的原型鏈?zhǔn)欠癜硞構(gòu)造函數(shù)的prototype屬性。例如:

  obj instanceof Widget

  obj的原型鏈上有很多對象(成為隱式原型),比如:obj.__proto__, obj.__proto__.__proto__, ...如果這些對象里存在一個p === Widget.prototype,那么instanceof結(jié)果為true,否則為false。

  instanceof是通過原型鏈來檢查類型的,所以適用于任何"object"的類型檢查。

  // 比如直接原型關(guān)系

  function Animal(){ }

  (new Animal) instanceof Animal  // true

  // 原型鏈上的間接原型

  function Cat(){}

  Cat.prototype = new Animal

  (new Cat) instanceof Animal   // true

  instanceof也可以用來檢測內(nèi)置兌現(xiàn),比如Array, RegExp, Object, Function:

  [1, 2, 3] instanceof Array // true

  /abc/ instanceof RegExp // true

  ({}) instanceof Object // true

  (function(){}) instanceof Function // true

  instanceof對基本數(shù)據(jù)類型不起作用,因?yàn)榛緮?shù)據(jù)類型沒有原型鏈。

  3 instanceof Number // false

  true instanceof Boolean // false

  'abc' instanceof String // false

  null instanceof XXX // always false

  undefined instanceof XXX // always false

  但你可以這樣:

  new Number(3) instanceof Number // true

  new Boolean(true) instanceof Boolean // true

  new String('abc') instanceof String // true

  但這時你已經(jīng)知道數(shù)據(jù)類型了,類型檢查已經(jīng)沒有意義了。

  constructor

  constructor屬性返回一個指向創(chuàng)建了該對象原型的函數(shù)引用。需要注意的是,該屬性的值是那個函數(shù)本身。例如:

  function Animal(){}

  var a = new Animal

  a.constructor === Animal // true

  constructor不適合用來判斷變量類型。首先因?yàn)樗且粋屬性,所以非常容易被偽造:

  var a = new Animal

  a.constructor === Array

  a.constructor === Animal // false

  另外constructor指向的是最初創(chuàng)建當(dāng)前對象的函數(shù),是原型鏈最上層的那個方法:

  function Cat(){}

  Cat.prototype = new Animal

  function BadCat(){}

  BadCat.prototype = new Cat

  (new BadCat).constructor === Animal // true

  Animal.constructor === Function  // true

  與instanceof類似,constructor只能用于檢測對象,對基本數(shù)據(jù)類型無能為力。 而且因?yàn)閏onstructor是對象屬性,在基本數(shù)據(jù)類型上調(diào)用會拋出TypeError異常:

  null.constructor   // TypeError!

  undefined.constructor // TypeError!

  與instanceof不同的是,在訪問基本數(shù)據(jù)類型的屬性時,JavaScript會自動調(diào)用其構(gòu)造函數(shù)來生成一個對象。例如:

  (3).constructor === Number // true

  true.constructor === Boolean // true

  'abc'.constructor === String // true

  // 相當(dāng)于

  (new Number(3)).constructor === Number

  (new Boolean(true)).constructor === Boolean

  (new String('abc')).constructor === String

  這種將一個值類型轉(zhuǎn)換為對象引用類型的機(jī)制在其他語言中也存在,在C#中稱為裝箱(Boxing)。

  跨窗口問題

  我們知道Javascript是運(yùn)行在宿主環(huán)境下的,而每個宿主環(huán)境會提供一套ECMA標(biāo)準(zhǔn)的內(nèi)置對象,以及宿主對象(如window, document),一個新的窗口即是一個新的宿主環(huán)境。 不同窗口下的內(nèi)置對象是不同的實(shí)例,擁有不同的內(nèi)存地址。

  而instanceof和constructor都是通過比較兩個Function是否相等來進(jìn)行類型判斷的。 此時顯然會出問題,例如:

  var iframe = document.createElement('iframe');

  var iWindow = iframe.contentWindow;

  document.body.appendChild(iframe);

  iWindow.Array === Array   // false

  // 相當(dāng)于

  iWindow.Array === window.Array // false

  因此iWindow中的數(shù)組arr原型鏈上是沒有window.Array的。請看:

  iWindow.document.write('

  ');

  iWindow.arr instanceof Array   // false

  iWindow.arr instanceof iWindow.Array // true

  toString

  toString方法是最為可靠的類型檢測手段,它會將當(dāng)前對象轉(zhuǎn)換為字符串并輸出。 toString屬性定義在Object.prototype上,因而所有對象都擁有toString方法。 但Array, Date等對象會重寫從Object.prototype繼承來的toString, 所以最好用Object.prototype.toString來檢測類型。

  toString = Object.prototype.toString;

  toString.call(new Date); // [object Date]

  toString.call(new String); // [object String]

  toString.call(Math);  // [object Math]

  toString.call(3);   // [object Number]

  toString.call([]);   // [object Array]

  toString.call({});   // [object Object]

  // Since JavaScript 1.8.5

  toString.call(undefined); // [object Undefined]

  toString.call(null);  // [object Null]

  toString也不是完美的,它無法檢測用戶自定義類型。 因?yàn)镺bject.prototype是不知道用戶會創(chuàng)造什么類型的, 它只能檢測ECMA標(biāo)準(zhǔn)中的那些內(nèi)置類型。

  toString.call(new Animal) // [object Object]

  因?yàn)榉祷刂凳亲址脖苊饬丝绱翱趩栴}。當(dāng)然IE彈窗中還是有Bug,不必管它了。 現(xiàn)在多少人還在用IE?多少人還在用彈窗?

  和Object.prototype.toString類似地,F(xiàn)unction.prototype.toString也有類似功能, 不過它的this只能是Function,其他類型(例如基本數(shù)據(jù)類型)都會拋出異常。

  總結(jié)

  typeof只能檢測基本數(shù)據(jù)類型,對于null還有Bug;

  instanceof適用于檢測對象,它是基于原型鏈運(yùn)作的;

  constructor指向的是最初創(chuàng)建者,而且容易偽造,不適合做類型判斷;

  toString適用于ECMA內(nèi)置JavaScript類型(包括基本數(shù)據(jù)類型和內(nèi)置對象)的類型判斷;

  基于引用判等的類型檢查都有跨窗口問題,比如instanceof和constructor。

  總之,如果你要判斷的是基本數(shù)據(jù)類型或JavaScript內(nèi)置對象,使用toString; 如果要判斷的時自定義類型,請使用instanceof。

  有時Duck Typing的方式也非?尚校菜埔呀(jīng)成為了前端的慣例。 比如jQuery是這樣判斷一個Window的:

  isWindow: function(obj){

  return obj && typeof obj === 'object' && "setInterval" in obj;

  }

  另外DOM Element的類型檢測也可以通過上述的方法來完成,但沒有一種方法在任何瀏覽器上都可行。 DOM Element的類型檢測可以參見這篇文章:http://tobyho.com/2011/01/28/checking-types-in-javascript/

  同時發(fā)表在:http://harttle.com/2015/09/18/js-type-checking.html

【如何檢查JavaScript變量的類型】相關(guān)文章:

PHP數(shù)據(jù)類型之?dāng)?shù)組變量詳解03-14

JavaScript如何實(shí)現(xiàn)JSON.stringify12-09

如何實(shí)現(xiàn)JavaScript的DIV塊來回滾動效果03-24

如何使用javascript實(shí)現(xiàn)瀑布流及效果加載12-09

如何使用JavaScript快速獲取頁面高度寬度03-23

JAVA語法基礎(chǔ)之變量和基本數(shù)據(jù)類型12-03

JavaScript的應(yīng)用03-30

JavaScript與Java的區(qū)別11-26

如何查看Linux系統(tǒng)架構(gòu)類型03-14