js——数据类型——js数据类型&数据类型检测

01-数据类型

值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。

引用数据类型（对象类型）：对象(Object)、数组(Array)、函数(Function)，还有两个特殊的对象：正则（RegExp）和日期（Date）。

值类型(基本类型)	引用数据类型（对象类型）:
字符串（String）	对象(Object)
数字(Number)	数组(Array)
布尔(Boolean)	函数(Function)
对空（Null）	特殊的对象:
未定义（Undefined）	正则（RegExp）
Symbol	日期（Date）

02-检测数据类型

2.1-type of

示例代码：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    const num = 1
    const str = 'hello'
    const bool = true
    const nu = null
    const un = undefined
    const sym = Symbol('hello')
    const arr =[]
    const obj = {}
    const fn = function () {}
    const date = new Date()
    const reg = new RegExp()
    console.log(typeof num)
    console.log(typeof str)
    console.log(typeof bool)
    console.log(typeof nu)
    console.log(typeof un)
    console.log(typeof sym)
    console.log(typeof arr)
    console.log(typeof obj)
    console.log(typeof fn)
    console.log(typeof date)
    console.log(typeof reg)
  </script>
</body>
</html>

typeof可以正常检测出：number、boolean、string、object、function、undefined、symbol、bigint

检测基本数据类型，null会检测object，因为null是一个空的引用对象
检测复杂数据类型，除function外，均为object

2.2-instanceof

instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上

示例代码：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    function Animal(name) {
      this.name = name
    }

    const dog = new Animal('大黄')

    console.log(dog instanceof Animal)
  </script>
</body>
</html>

检测数据类型：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    function Animal(name) {
      this.name = name
    }

    const dog = new Animal('大黄')

    console.log(dog instanceof Object)
  </script>
</body>
</html>

Copied!

注意：只能检测复杂数据类型

2.3-toString

toString() 是 Object 的原型方法，调用该方法，默认返回当前对象的 [[Class]] 。这是一个内部属性，其格式为 [object Xxx] ，其中 Xxx 就是对象的类型。

对于 Object 对象，直接调用 toString() 就能返回 [object Object] 。而对于其他对象，则需要通过 call / apply 来调用才能返回正确的类型信息。

Object.prototype.toString.call('') ;              // [object String]
Object.prototype.toString.call(1) ;               // [object Number]
Object.prototype.toString.call(true) ;            // [object Boolean]
Object.prototype.toString.call(Symbol());         // [object Symbol]
Object.prototype.toString.call(undefined) ;       // [object Undefined]
Object.prototype.toString.call(null) ;            // [object Null]
Object.prototype.toString.call(new Function()) ;  // [object Function]
Object.prototype.toString.call(new Date()) ;      // [object Date]
Object.prototype.toString.call([]) ;              // [object Array]
Object.prototype.toString.call(new RegExp()) ;    // [object RegExp]
Object.prototype.toString.call(new Error()) ;     // [object Error]
Object.prototype.toString.call(document) ;        // [object HTMLDocument]
Object.prototype.toString.call(window) ;          // [object global] window 是全局对象 global 的引用

2.4-constructor

constructor代表获取由哪个构造函数创建而出，可以检测出字面量方式创建的对象类型，因为字面方式创建，实际由对应类创建而出

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    const arr = []
    console.log(arr.constructor === Array)
  </script>
</body>
</html>

不是字面量的方式只会获取到构造函数

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    function Animal(name) {
      this.name = name
    }

    const dog = new Animal('大黄')

    console.log(dog.constructor === Object) // false
    console.log(dog.constructor === Animal) // true
  </script>
</body>
</html>

2.4-isArray

isArray可以检测出是否为数组

const arr = []
Array.isArray(arr)

03-递减递增

后置递增，先返回后自加
```
let a = 1
a = a+++1
console.log(a)
```
前置递增，先自加后返回
```
let a = 1
a = ++a+1
console.log(a)
```

posted @ 2022-07-25 19:42 Shinnki 阅读(45) 评论(0) 收藏举报

刷新页面返回顶部

Shinnki