JS中檢測資料型別的多種方法

2022-07-15 18:33:15 字數 4166 閱讀 7291

面試當中經常會問到檢測 js 的資料型別,我在工作當中也會用到這些方法。讓我們一起走起!!!

首先給大家上乙個案例

1 console.log(typeof "langshen");       //

string

2 console.log(typeof 666); //

number

3 console.log(typeof

true); //

boolean

4 console.log(typeof

false); //

boolean

5 console.log(typeof

function(){}); //

function

6 console.log(typeof undefined); //

undefined

7 console.log(typeof

null); //

object

8 console.log(typeof ); //

object

9 console.log(typeof {}); //

object

通過這些案例大家不難看出 

第一種 : 當 typeof 檢測基本資料型別(number、string、boolean 、undefined、null)的時候是沒有問題的。

但是檢測引用型資料型別(array、object、regexp等)

的時候全都是 object。

由於 typeof 檢測的資料型別不是那麼的 perfect !!!會有侷限性。

使用場景:

可以判斷傳遞的引數是否有值

1

function

fn(a, b)

5 console.log(a, b); //

1 06

}7 fn(1);

第二種 : instanceof   檢測乙個例項是不是屬於某個類

1 console.log("langshen" instanceof string);         //

false

2 console.log(666 instanceof number); //

false

3 console.log(true

instanceof boolean); //

false

4 console.log(null

instanceof

null);

5 console.log(undefined instanceof

undefined);

6 console.log( instanceof array); //

true

7 console.log(function(){} instanceof function); //

true

8 console.log({} instanceof object); //

true

咱們先不要看 null 和 undefined

首先看基本資料型別,列印出來的都是false,這是為什麼呢?

前三個都是以物件字面量建立的基本資料型別,但是卻不是所屬類的例項,只有例項方式建立出來的才是標準的物件資料型別值

如果我們換種方式來檢測

1

new string("langshen") instanceof string //

true

2new number(666) instanceof number //

true

3new boolean(true) instanceof boolean //

true

當我們通過new的方式去建立基本資料型別就輸出true

所以當我們檢測的資料只要在當前例項的原型鏈上,我們用其檢測出來的結果都是true 。

另外兩個特例:null 和  undefined 這兩個沒有辦法比較,比較特殊

總結:instanceof是乙個操作符,返回值是乙個布林值

instanceof是檢測引用資料型別,而不能檢測基本資料型別

第三種: constructor

constructor這個屬性存在於建構函式的原型上,指向建構函式,物件可以通過__proto__在其所屬類的原型上找到這個屬性

1 console.log(("1").constructor === string);             //

true

2 console.log((1).constructor === number);          //

true

3 console.log((true).constructor === boolean);         //

true

4 console.log(().constructor === array);            //

true

5 console.log((function() {}).constructor === function);    //

true

6 console.log(({}).constructor === object);            //

true

現在看起來是不是很完美呢,其實並不是這樣的,在看下面這個例子

function

fn(){};

fn.prototype=new

array();

var f=new

fn();

console.log(f.constructor===fn); //

false

console.log(f.constructor===array); //

true

看了這個例子是不是覺得對這個世界都沒有愛了!!

但我要告訴你不不不,我們要對世界保持100%熱愛,由於這種熱愛讓我們總結出了最後一種萬能的檢測方法!!!

第四種:object.prototype.tostring.call()

console.log(object.prototype.tostring.call(1));              //

[object number]

console.log(object.prototype.tostring.call(''));             //

[object string]

console.log(object.prototype.tostring.call(true));            //

[object boolean]

console.log(object.prototype.tostring.call(null));            //

[object null]

console.log(object.prototype.tostring.call(undefined));         //

[object undefined]

console.log(object.prototype.tostring.call());             //

[object array]

console.log(object.prototype.tostring.call({}));             //

[object object]

console.log(object.prototype.tostring.call(/^$/));            //

[object regexp]

console.log(object.prototype.tostring.call((function () {})));     //

[object function]

這種方法可以把多有的資料型別進行轉換,是不是很神奇呢!!

js 資料型別 js中檢測資料型別的方法彙總

回顧一下js中資料型別分為兩大類,基礎型別和引用資料型別,主要有 基本資料型別 複雜資料型別 檢測js中的資料型別常用的方法有 typeof instanceof object.prototype.tostring 對比一下這三種方法的優缺點 typeof 5 number 有效typeof dsd...

JS裡檢測資料型別4種方法

第一種 1.typeof 1 console.log typeof 2 console.log typeof 1 3 console.log typeof true 4 console.log typeof null 5 console.log typeof undefined 6 console....

JS中返回資料型別的幾種方法

返回乙個字串,用來判斷資料所屬的基本型別 null除外 但引用型別的判斷結果都為object function除外 console.log typeof1 number console.log typeof 1,2 string console.log typeof false boolean co...