ES6数组判断以及原始值转换

一. 数组判断

  1. 情况一
js 复制代码
const target = {}

function isArray(target) {
    return Object.prototype.toString.call(target) === "[object Array]"
}
console.log(isArray(target)) // false
js 复制代码
const target = {
    [Symbol.toStringTag]: "Array",
}

function isArray(target) {
    return Object.prototype.toString.call(target) === "[object Array]"
}
console.log(isArray(target)) // true

  1. 情况二
js 复制代码
const target = {}

function isArray(target) {
    return target instanceof Array
}

console.log(isArray(target)) // false
js 复制代码
const target = {}
Object.setPrototypeOf(target, Array.prototype)
function isArray(target) {
    return target instanceof Array
}

console.log(isArray(target)) // true

使用ES6

js 复制代码
const target = {
    [Symbol.toStringTag]: "Array",
}

Object.setPrototypeOf(target, Array.prototype)

function isArray(target) {
    return Array.isArray(target)
}

console.log(isArray(target)) // false

二. 原始值转换

  1. 情况一
js 复制代码
const target = {}
console.log(target.toString()) // [object Object]
console.log(target + 1) // [object Object]1
  1. 情况二
js 复制代码
const target = {
    toString() { return 1 },
}
console.log(target.toString()) // 1
console.log(target + 1) // 2
  1. 情况三
js 复制代码
const target = {
    toString() { return 1 },
    valueOf() {
        return 2
    },
}
console.log(target.toString()) // 1
console.log(target + 1) // 3
  1. 情况四 参考mdn
js 复制代码
const target = {
    toString() { return 1 },
    valueOf() {
        return 2
    },
    [Symbol.toPrimitive](hint) {
        return 3
    },
}
console.log(target.toString()) // 1
console.log(target + 1) // 4

原始值强制转换优先权重:[Symbol.toPrimitive] > valueOf > toString

相关推荐
一个不爱写代码的瘦子22 分钟前
迭代器和生成器
前端·javascript
拳打南山敬老院23 分钟前
漫谈 MCP 构建之概念篇
前端·后端·aigc
前端老鹰23 分钟前
HTML <output> 标签:原生表单结果展示容器,自动关联输入值
前端·html
OpenTiny社区25 分钟前
OpenTiny NEXT 内核新生:生成式UI × MCP,重塑前端交互新范式!
前端·开源·agent
耶耶耶11130 分钟前
web服务代理用它,还不够吗?
前端
Liamhuo1 小时前
2.1.7 network-浏览器-前端浏览器数据存储
前端·浏览器
洋葱头_1 小时前
vue3项目不支持低版本的android,如何做兼容
前端·vue.js
前端小书生1 小时前
React 组件渲染
前端·react.js
sjd_积跬步至千里1 小时前
CSS实现文字横向无限滚动效果
前端
维他AD钙1 小时前
前端基础避坑:3 个实用知识点的简单用法
前端