js数据类型和判断相关

94 阅读5分钟

1. JavaScript 有哪些数据类型,它们的区别?

JavaScript一共有7种数据类型: Undefined, Null, Number, string, Boolean, Objectm, Symbol  
       
基本数据类型(栈存储): Number, String, Boolean, null, undefined。  
引用数据类型(堆存储): Object,Symbol

2. ES6新增加的数据类型有哪些?

Symbol类型, Symbol 是用于表示独一无二的值。
let name = Symbol('狗蛋');
let name2 = Symbol('狗蛋');

console.log(name); // Symbol(狗蛋)
console.log(typeof name); // symbol

console.log(name === name2); // false

// 为什么 name 和 name2不同,类比 Object 类型来看
let obj = {};
let obj2 = {};
console.log(obj === obj2); // false

Symbol 特点: 1. 唯一性 2. 不可变性

Symbol 常见用法和示例:

  1. 创建唯一的属性名,确保对象的key不会重名
let id = Symbol('id');
let obj = {}

obj[id] = '我是id';
console.log(obj);
  1. 使用内置的 Symbol 值

  2. 防止属性被意外访问,就是 Object.keys()不能访问到

const password = Symbol('password');
const user = {
    username: 'john',
    [password]: 'secret'
};

console.log(user[password]);  // 输出: "secret"
console.log(Object.keys(user));  // 输出: ["username"]

Symbol 参考资料 www.cnblogs.com/caihongmin/…

3. 数据类型检测的方式有哪些?

共有四种方式检测数据类型

  1. typeof
console.log(typeof 2);               // number
console.log(typeof true);            // boolean
console.log(typeof 'str');           // string
console.log(typeof []);              // object    
console.log(typeof function(){});    // function
console.log(typeof {});              // object
console.log(typeof undefined);       // undefined
console.log(typeof null);            // object
  1. instanceof, 原理是判断其原型中是否能找到该原型。
console.log(2 instanceof Number);                    // false
console.log(true instanceof Boolean);                // false 
console.log('str' instanceof String);                // false 

console.log([] instanceof Array);                    // true
console.log(function(){} instanceof Function);       // true
console.log({} instanceof Object);                   // true
  1. constructor
console.log((2).constructor === Number); // true
console.log((true).constructor === Boolean); // true
console.log(('str').constructor === String); // true
console.log(([]).constructor === Array); // true
console.log((function() {}).constructor === Function); // true
console.log(({}).constructor === Object); // true

constructor 作用有两个:1.判断数据的类型。2.通过实例对象的 constructor 变量访问构造函数,实力对象的constructor可以改变。
function Fn(){};

Fn.prototype = new Array();

var f = new Fn();

console.log(f.constructor===Fn);    // false
console.log(f.constructor===Array); // true
  1. Object.prototype.toString.call() 这个常用
var a = Object.prototype.toString;

console.log(a.call(2));  // [object Number]
console.log(a.call(true));  // [object Boolean]
console.log(a.call('str'));
console.log(a.call([]));  // [object Array]
console.log(a.call(function(){})); // [object Function]
console.log(a.call({}));  // [object Object]
console.log(a.call(undefined)); // [object Undefined]
console.log(a.call(null)); // [object Null]

// 判断类型
let n = a.call(2);
let type = n.slice(8, -1); // Number

4. null和undefined区别?

null 和 undefined 都是特殊的值,表示缺少值或未定义值,但它们之间有一些区别。
undefined 是一个数据类型,表示未初始化或未赋值的变量。当声明一个变量但未给它赋值时,默认情况下它的值就是 undefined。

let x;
console.log(x);  // 输出: undefined

null 也是一个数据类型,表示一个空值或者特意赋予变量的空值。它表示变量被明确地赋予了空值。

let y = null;
console.log(y);  // 输出: null

5. typeof null 的结果是什么,为什么?

结果是 object。
这是因为 JavaScript 在早期版本的实现中,使用了一个 32 位的二进制表示值的标签位来区分不同类型的对象。其中,对象的标签位是 000,而 null 的二进制表示是全零,也就是也是 000。由于 null 的标签位与对象相同,所以 typeof null 返回 'object'。
这种行为被认为是 JavaScript 的一个历史遗留问题,而不是一个设计意图。为了避免这种混淆,通常建议使用严格相等运算符(===)来检查一个值是否为 null。

6. intanceof 操作符的实现原理及实现

let num = 2;
// console.log(num.constructor == Number)
// console.log(num.__proto__)

function myInstanceOf(obj, con) {
    /**
     * 1.首先,检查被操作对象的原型链
     * 2.然后,检查指定类(构造函数)的原型对象是否在被操作对象的原型链上。
    */

    // Object.getPrototypeOf 和 __proto__ 都可以获取原型链
    // let proto = Object.getPrototypeOf(obj);
    let proto = obj.__proto__;

    while(proto != null) {
        
        if(proto === con.prototype) {
            return true;
        }
        
        // proto = Object.getPrototypeOf(proto);
        proto = proto.__proto__;
    }

    return false;
}

let result = myInstanceOf(num, Number);
// let result = myInstanceOf(num, String);
console.log(result);

7. 什么是 NaN?如何检测 NaN 的值?

NaN(Not a Number)是一个特殊的数值,表示一个无效的数值运算结果。可以使用 isNaN() 函数来检测一个值是否为 NaN。

//例如:
isNaN(42); //false
isNaN("Hello"); 返回 true

8. typeof NaN 的结果是什么?

typeof NaN; // "number"

NaN 是一个特殊的值,它和自身不相等是唯一一个非自反(自反及 x === x 不成立)的值。 而 NaN !== NaN 为 true;

9. 判断数组的方式有哪些?


// 1. 通过 Object.prototype.toString.call() 判断
Object.prototype.toString.call(obj).slice(8, -1) === 'Array';

// 2. 通过原型链判断
obj.__proto__ === Array.prototype;

// 3. Array.isArray() 判断
Array.isArray(obj);

// 4. instanceof
obj instanceof Array

// 5. Array.prototype.isPrototypeOf
Array.prototype.isPrototypeOf(obj)

10. 其他类型的值转换为字符串类型?

转换为字符串的方式:
1.String();
    String(123);
2.toString(); null 和 undefined 不能用报错
    param.toString();
3. 连接空字符串 + "";
    123 + ""
    // 转换的值
    undefined => 'undefined'
    null => 'null'
    123 => '123'
    true => 'true'
    {a:1} => [object, object]
    [1,2] => '1,2'
    Symbol(123) => 'Symbol(123)'

11. 其他类型的值转换为数字类型?

转换方式
1. 强制转换 Number()
```
// 1.
console.log(Number(null)) // 0
console.log(Number(undefined)) // NaN
console.log(Number(true)) // 1
console.log(Number(false)) // 0
console.log(Number('123')) // 123
console.log(Number('asdf')) // NaN
console.log(Number('asdf123')) // NaN
console.log(Number('123asdf')) // NaN
console.log(Number({a:1})) // NaN
console.log(Number([1,2])) // NaN
// console.log(Number(Symbol(1))) // 报错
```
2. parseInt() 和 parseFloat()
3. 隐士转化用 + 和 -
```
let a = '132';
let b = true;

console.log(+a); // 132
console.log(+b); // 1
console.log(b-0); // 0
```

12. 其他类型的值转换为布尔类型?

以下这些是假值:  undefined  null  false  +0、-0NaN  ""

13. Object.is() 与比较操作符 “===”、“==” 的区别?

- 使用双等号(==)进行相等判断时,如果两边的类型不一致,则会进行强制类型转化后再进行比较。
- 使用三等号(===)进行相等判断时,如果两边的类型不一致时,不会做强制类型准换,直接返回 false。
- Object.is() 的使用示例 Object.is('1', 1) 使用 Object.is 来进行相等判断时,一般情况下和三等号的判断相同,它处理了一些特殊的情况,比如 -0 和 +0 不再相等,两个 NaN 是相等的。

14. 什么是 JavaScript 中的包装类型?

在 JavaScript 中,包装类型是一种特殊的对象类型,用于将基本数据类型(如字符串、数字和布尔值)包装成对象。这些包装类型分别是 String、Number 和 Boolean。当我们对基本数据类型调用对象的方法时,JavaScript 会自动创建对应的包装类型对象,使得我们可以访问对象的属性和方法。这个过程称为包装。
```
var str = "Hello";
var strObject = new String(str); // 创建一个 String 包装对象
console.log(strObject.length); // 5,访问包装对象的属性
console.log(strObject.charAt(0)); // "H",调用包装对象的方法

var num = 42;
var numObject = new Number(num); // 创建一个 Number 包装对象
console.log(numObject.toFixed(2)); // "42.00",调用包装对象的方法

var bool = true;
var boolObject = new Boolean(bool); // 创建一个 Boolean 包装对象
console.log(boolObject.valueOf()); // true,调用包装对象的方法

```
在 JavaScript 中,基本类型是没有属性和方法的,但是为了便于操作基本类型的值,在调用基本类型的属性或方法时 JavaScript 会在后台隐式地将基本类型的值转换为对象
```
const a = "abc";
a.length; // 3
a.toUpperCase(); // "ABC"
```

juejin.cn/post/694094…