人妻精品在线观看一区二区三区,蜜臀av精品一区二区三区网站,中文一区二区三区亚洲欧美,熟女人妇精品一区二区,人妻av在线观看视频,欧美日韩国产三级精品网站,黄色免费网站直接进入,超碰公开福利正在播放,国产毛片乡下农村妇女毛片

JavaScript怎么判斷數(shù)據(jù)類型?8 種方式分享

來源:php中文網(wǎng) | 2023-02-16 17:57:53 |

JavaScript怎么判斷數(shù)據(jù)類型?本篇文章給大家分享JS 判斷數(shù)據(jù)類型的 8 種方式,有效幫助工作和面試,面試官看了微微一笑。

1、typeof

只能識別基礎(chǔ)類型和引用類型

注意:nullNaN、 document.all的判斷

console.log(typeof null); // objectconsole.log(typeof NaN); // numberconsole.log(typeof document.all); // undefined

2、constructor

constuctor指向創(chuàng)建該實(shí)例對象的構(gòu)造函數(shù)

注意 nullundefined沒有 constructor,以及 constructor可以被改寫


(資料圖片僅供參考)

String.prototype.constructor = function fn() {  return {};};console.log("云牧".constructor); // [Function: fn]

3、instanceof

語法:obj instanceof Type功能:判斷 obj是不是 Type類的實(shí)例,只可用來判斷引用數(shù)據(jù)實(shí)現(xiàn)思路: Type的原型對象是否是 obj的原型鏈上的某個對象注意:右操作數(shù)必須是函數(shù)或者 class

手寫 instanceof

function myInstanceof(Fn, obj) {  // 獲取該函數(shù)顯示原型  const prototype = Fn.prototype;  // 獲取obj的隱式原型  let proto = obj.__proto__;  // 遍歷原型鏈  while (proto) {    // 檢測原型是否相等    if (proto === prototype) {      return true;    }    // 如果不等于則繼續(xù)往深處查找    proto = proto.__proto__;  }  return false;}

4、isPrototypeof

是否在實(shí)例對象的原型鏈上基本等同于 instanceof
console.log(Object.isPrototypeOf({})); // falseconsole.log(Object.prototype.isPrototypeOf({})); // true  期望左操作數(shù)是一個原型,{} 原型鏈能找到 Object.prototype

5、Object.prototype.toString

利用函數(shù)動態(tài) this 的特性
function typeOf(data) {  return Object.prototype.toString.call(data).slice(8, -1);}// 測試console.log(typeOf(1)); // Numberconsole.log(typeOf("1")); // Stringconsole.log(typeOf(true)); // Booleanconsole.log(typeOf(null)); // Nullconsole.log(typeOf(undefined)); // Undefinedconsole.log(typeOf(Symbol(1))); // Symbolconsole.log(typeOf({})); // Objectconsole.log(typeOf([])); // Arrayconsole.log(typeOf(function () {})); // Functionconsole.log(typeOf(new Date())); // Dateconsole.log(typeOf(new RegExp())); // RegExp

6、鴨子類型檢測

檢查自身屬性的類型或者執(zhí)行結(jié)果的類型通常作為候選方案例子:kindofp-is-promise

p-is-promise:

const isObject = value =>  value !== null && (typeof value === "object" || typeof value === "function");export default function isPromise(value) {  return (    value instanceof Promise ||    (isObject(value) && typeof value.then === "function" && typeof value.catch === "function")  );}

kindof:

function kindof(obj) {  var type;  if (obj === undefined) return "undefined";  if (obj === null) return "null";  switch ((type = typeof obj)) {    case "object":      switch (Object.prototype.toString.call(obj)) {        case "[object RegExp]":          return "regexp";        case "[object Date]":          return "date";        case "[object Array]":          return "array";      }    default:      return type;  }}

7、Symbol.toStringTag

原理:Object.prototype.toString會讀取該值適用場景:需自定義類型注意事項(xiàng):兼容性
class MyArray {  get [Symbol.toStringTag]() {    return "MyArray";  }}const arr = new MyArray();console.log(Object.prototype.toString.call(arr)); // [object MyArray]

8、等比較

原理:與某個固定值進(jìn)行比較適用場景:undefined、 window、 documentnull

underscore.js:

總結(jié)

方法基礎(chǔ)數(shù)據(jù)類型引用類型注意事項(xiàng)
typeof×NaN、object、document.all
constructor√ 部分可以被改寫
instanceof×多窗口,右邊構(gòu)造函數(shù)或者class
isPrototypeof×小心 null 和 undefined
toString小心內(nèi)置原型
鴨子類型-不得已兼容
Symbol.toString Tag×識別自定義對象
等比較特殊對象

加餐:ES6 增強(qiáng)的 NaN

NaN 和 Number.NaN 特點(diǎn)

typeof后是數(shù)字

自己不等于自己

delete不能被刪除

isNaN

如果非數(shù)字,隱式轉(zhuǎn)換傳入結(jié)果如果是 NaN,就返回 true,反之返回 false
console.log(isNaN(NaN)); // trueconsole.log(isNaN({})); // true

Number.isNaN

判斷一個值是否是數(shù)字,并且值是否等于 NaN
console.log(Number.isNaN(NaN)); // trueconsole.log(Number.isNaN({})); // false

其他判斷是否 NaN的方法

function isNaNVal(val) {  return Object.is(val, NaN);}function isNaNVal(val) {  return val !== val;}function isNaNVal(val) {  return typeof val === "number" && isNaN(val);}// 綜合墊片if (!("isNaN" in Number)) {  Number.isNaN = function (val) {    return typeof val === "number" && isNaN(val);  };}

indexOf 和 includes

indexOf不可查找 NaNincludes則可以
const arr = [NaN];console.log(arr.indexOf(NaN)); // -1console.log(arr.includes(NaN)); // true

【推薦學(xué)習(xí):javascript高級教程】

以上就是JavaScript怎么判斷數(shù)據(jù)類型?8 種方式分享的詳細(xì)內(nèi)容,更多請關(guān)注php中文網(wǎng)其它相關(guān)文章!

關(guān)鍵詞: JavaScript