前端基础知识-JS篇-变量类型

JS变量类型

• 常见值类型
  undefined、String、Number、Boolean、Symbol
• 常见引用类型
  Object、Array、null、Function
  注: Function为特殊引用各类型, 但不用于存储数据, 所以没有"拷贝、复制"的说法

typeof可以判断的数据类型

1. 识别所有的值类型
2. 识别出是否为函数
3. 判断是否为引用类型 (不可再往下细分, 需要判断可以使用instanceof)

值类型和引用类型的区别

• 存储位置不同
  • 值类型会白村在栈内存中,作用域消失后变量会自动销毁
  • 引用类型变量名会保存在栈内存中(地址值),变量值会保存在堆内存中,引用变量不会自动销毁,当变量不被引用时,系统的垃圾回收机制会回收它
• 拷贝方式不同
  • 值类型的变量拷贝为深拷贝,修改原变量不会影响拷贝后的变量
  • 引用类型变量拷贝为浅拷贝,只是传递的引用,拷贝的是引用地址值,修改的还是同一个变量
• 值类型无法添加属性和方法, 但是引用类型可以
• 引用类型的比较是比较的地址值(如判断是否相等)

类型转换

• 字符串拼接
  当使用 '+'进行变量计算时, 可能会个改变变量的数据类型
  • Number + Number = Number
  • Number + String = String
  • Boolean + String = String
• ==运算符
  变量使用==运算符之后, 会被转化为Boolean类型
  注: 除判断是否==null外,一律使用===进行变量判断 (除非特殊需求)

逻辑判断

if的判断,其实是判断括号内变量是否为truly变量

• truly变量: !!flag === true的变量
• falsely变量: !!flag === false的变量
  除下列变量为falsely变量, 其余全是truly变量
  • 0
  • NaN
  • '' (空字符串)
  • null
  • undefined
  • false
    逻辑运算符
• &&
  用于值运算时, 若前面条件为真则输出后面的值, 反之输出前面的值. 一般用于控制&&后的方法是否执行
• ||
  若前面条件为假则输出后面的值, 反之输出前面的值. 一般用于设置变量默认值

最后附上应用实例, 简单实现深拷贝

 /**
  * 深拷贝
  * @param {Object | Array} obj 需要拷贝的对对象 
  */
function deepClone (obj = {}) {
  if (typeof obj !== 'object' || obj == null) {
    // 如果入参不是对象和数据, 或者入参为空, 直接返回;
    return obj
  }
  // 初始化返回值
  let result
  if (obj instanceof Array) {
    result = []
  } else {
    result = {}
  }
  for (let key in obj) {
    // 保证key不是原型的属性
    if (obj.hasOwnProperty(key)) {
      // 递归调用, 防止对象中还有引用类型数据
      result[key] = deepClone(obj[key]);
    }
  }
  return result;
}