JS 变量类型

变量类型

1.1 值类型与引用类型的区别

值类型：string，number，boolean，symbol，undefined，null，symbol
引用类型：object，array，function
 
值类型：值保存在栈中，保存与复制的是值本身

let value1 = 100;
let value2 = value1;
value2 = 200;
console.log(value1, value2);	// 100  200

可以看到，将 value1 赋值给 value2 时，即使再次修改 value2 的值，也不会影响 value1 的值
 
引用类型：值保存在堆中，堆的地址保存在栈中，保存与复制的是栈中指向值的一个地址

let value1 = { a: 1, b: 2 };
let value2 = value1;
value2.a = 100;
value2.b = 200;
console.log(value1, value2); // {a: 100, b: 200} {a: 100, b: 200}

可以看到，将 value1 赋值给 value2 时，再次修改 value2 的值，value1 的值也一起改变。
 

1.2 使用 typeof 来判断类型

console.log(typeof 'string');      // string
console.log(typeof 100);           // number
console.log(typeof true);          // boolean
console.log(typeof Symbol('s'))    // symbol
console.log(typeof undefined);     // undefined
console.log(typeof null);          // object
console.log(typeof {a: 1});        // object
console.log(typeof [1,2,3]);       // object
console.log(typeof function() {}); // function

 

1.3 instanceof

instanceof 运算符用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。
 

从 1.2 中可以看到，使用 typeof 判断 null，对象，数组都返回了 object，这样就没办法细分这三种类型，因此需要一个新的方式来进一步判断

console.log(null instanceof Object, null === null);				  // false true
console.log({a: 1} instanceof Object);                            // true
console.log([1,2,3] instanceof Array, Array.isArray([1,2,3]));    // true

使用 instanceof 判断 null，仍然会返回 false，判断 null 可以直接使用 === 即可；
使用 instanceof 判断对象，返回true；
使用 instanceof 判断数组，返回true，使用 Array.isArray 判断返回 true，建议使用后者；
 

注：“1” 和 new String(“1”)的区别

console.log("1", new String("1"), "1" === new String("1"));// 1 String{"1"} false
console.log(typeof "1", typeof new String("1"));// string object
console.log(typeof String(1));	// string

可以看到，“1”是基本类型 string ，而 new String(“1”) 是对象，且二者不相等
并且只有使用 new 才是封装对象，仅仅使用 String() 仅仅是基本类型转换

其他基础类型一样的：Number，Boolean

1.4 手写深拷贝

从 1.1 中看到，引用类型的赋值仅仅是复制其地址，这只是一种浅拷贝，那么如何做到真正复制引用类型的值呢。
下面给出示例供参考：

const deepClone = (value) => {
  // 非数组和非对象直接返回值即可
  if (value == null || typeof value !== 'object') {
    return value;
  }
  // 初始化
  let result = Array.isArray(value) ? [] : {};
  for (let key in value) {
    if (value.hasOwnProperty(key)) {
      result[key] =  deepClone(value[key]);
    }
  }
  return result;
}

欢迎大家点赞，收藏，关注！！！