类型判断
本文最后更新于 173 天前,如有失效请评论区留言。

类型判断

通过学习Vue源码,获得类型的判断方式

判断对象是否有这个Key

const hasOwnProperty$1 = Object.prototype.hasOwnProperty
const hasOwn = (val, key) => hasOwnProperty$1.call(val, key)

平常都是这样判断的,相当于封装了一下更简便使用 (不过我个人觉得没有必要封装)

let obj = {
  a: 'example',
  b: 'test'
};

if (obj.hasOwnProperty('a')) {
  console.log('The object contains key "a".')
} else {
  console.log('The object does not contain key "a".')
}

判断是否是数组

const isArray = Array.isArray

没啥好说的,ES5系统提供

判断是否是Map

const isMap = (val) => Object.prototype.toString.call(val) === "[object Map]"

判断是否是Set

const isSet = (val) => Object.prototype.toString.call(val) === "[object Set]"

判断是否是Date 日期

const isDate = (val) => Object.prototype.toString.call(val) === "[object Date]"

判断是否是RegExp 正则

const isRegExp = (val) => Object.prototype.toString.call(val) === "[object RegExp]"

判断是否是Function 函数

const isFunction = (val) => typeof val === "function"

判断是否是String 字符串

const isString = (val) => typeof val === "string"

判断是否是Symbol

const isSymbol = (val) => typeof val === "symbol"

判断是否是Object 广泛

const isObject = (val) => val !== null && typeof val === "object"

这个判断是广泛的object,arrayRegExpDateErrorMapWeakMapSetPromisewindow{}都会判断为true。这里null因为历史原因也被认为是object所以需要去除

typeof null 返回 “object” 是 JavaScript 的一个老早的bug。在 JavaScript 的最初版本中,使用的是 32位系统,为了性能考虑使用低位存储了变量的类型信息,000 开头代表是对象,而 null 表示为全零,所以,typeof null 会返回 “object”。

虽然这是一个明显的错误,而且被认识到后,已经修复了很多其他语言的类似错误,但是在 JavaScript 中却被保留下来,主要是因为修复它有可能会破坏现有的代码(这也是常见公司屎山项目的原因,不敢动原有代码只能往上添加修复)。所以至今仍然有 typeof null === ‘object’。

判断是否是Object 精确

const isPlainObject = (val) => Object.prototype.toString.call(val) === "[object Object]"

只会判断普通的 JavaScript 对象(即通过字面量 {}new Object()创建的对象)是对象

判断是否是Promise

const isPromise = (val) => {
  return (isObject(val) || isFunction(val)) && isFunction(val.then) && isFunction(val.catch)
}

获取类型 (Object.prototype.toString.call)

const toRawType = (val) => Object.prototype.toString.call(val).slice(8, -1)

通过 Object.prototype.toString 截取其中的具体类型

目前js中有23种

String、Number、Boolean、Null、Undefined、Symbol、BigInt、Number、Function、GeneratorFunction、AsyncFunction、Object、Array、Function、RegExp、Date、Error、Map、WeakMap、Set、Promise、Math、Window/global

总结

instanceof检查一个对象是否是某个构造函数的实例,或者是否在该构造函数的原型链上

typeof只能判断基础类型 string、number、boolean、undefined、symbol、bigint、number (null无法判断)

如果要精细判断最好采用Object.prototype.toString.call 封装成的 toRawType 方法判断

| 值 | toRawType转换后的值 |
| :——————————— | ——————— |
| ‘1’ | String |
| 1 | Number |
| false | Boolean |
| null | Null |
| undefined | Undefined |
| Symbol(1) | Symbol |
| BigInt(123) | BigInt |
| Infinity | Number |
| -Infinity | Number |
| NaN | Number |
| Object | Function |
| () => {} | Function |
| function*() { } | GeneratorFunction |
| async function() { } | AsyncFunction |
| {} | Object |
| [1, 2] | Array |
| new RegExp(“\d”) | RegExp |
| new Date() | Date |
| new Error(“error”) | Error |
| new Map() | Map |
| new WeakMap() | WeakMap |
| new Set() | Set |
| new Promise(resolve => resolve(1)) | Promise |
| Math | Math |
| window/global | Window/global |

版权声明:本文为BIMiracle原创,依据CC BY-SA 4.0许可证进行授权,转载请附上出处链接及本声明。
暂无评论

发送评论 编辑评论


|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇