js那些容易忽略的小知识

87 阅读2分钟

「这是我参与11月更文挑战的第29天,活动详情查看:2021最后一次更文挑战」。

js遍历对象和数组的方式

遍历数组

  • forEach()
  • 对数组的每个元素执行一次给定的函数,返回值undefined
let arr = [1,2,3];
arr.forEach(item => {
    console.log(item);
})

// 1
// 2
// 3

  • for...in
  • 注意for...in遍历的是索引
let arr = [1,2,3]
for(let item in arr){
  console.log(item, arr[item])
}

// 0 1
// 1 2
// 2 3

  • for...of
  • 无法遍历对象
let arr = [1,2,3];
for(let item of arr){
  console.log(item)
}

// 1
// 2
// 3

遍历对象

  • Object.keys()
  • 返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含Symbol属性).
let obj = {
    name: 'xiaofang',
    sex: 'woman',
    age: 18
}
console.log(Object.keys(obj))
Object.keys(obj).forEach(item => {
    console.log(item, obj[item]);
})

//[ 'name', 'sex', 'age' ]
//name xiaofang
//sex woman
//age 18

  • for...in
  • 循环遍历对象自身的和继承的可枚举属性(不含Symbol属性).
let obj = {
    name: 'lee',
    sex: 'male',
    age: 18
}
for(let item in obj) {
    console.log(item, obj[item]);
}

// name xiaofang
// sex woman
// age 18

  • Object.getOwnPropertyNames()
  • 返回一个数组,包含对象自身的所有属性(不含Symbol属性,但是包括不可枚举属性).
let obj = {
    name: 'xiaofang',
    sex: 'woman',
    age: 18
}
console.log(Object.getOwnPropertyNames(obj))
Object.getOwnPropertyNames(obj).forEach(item => {
  console.log(item, obj[item])
});

// [ 'name', 'sex', 'age' ]
// name xiaofang
// sex woman
// age 18

  • Reflect.ownKeys()
  • 返回一个数组,包含对象自身的所有属性(包括Symbol属性和不可枚举属性).
let obj = {
    name: 'xiaofang',
    sex: 'woman',
    age: 18
}
console.log(Reflect.ownKeys(obj))
Reflect.ownKeys(obj).forEach(item => {
  console.log(item, obj[item])
})

// [ 'name', 'sex', 'age' ]
// name xiaofang
// sex woman
// age 18

null和undefined的区别

  • null 和 undefined 都是基本数据类型,这两个基本数据类型分别都只有一个值,就是其本身。
  • undefined 代表的含义是未定义,null 代表的含义是空对象。一般变量声明了但还没有定义的时候会返回 undefined,null主要用于赋值给一些可能会返回对象的变量,作为初始化。
  • 当我们对两种类型使用 typeof 进行判断的时候,null 会返回 “object”。
  • undefined==null //true
  • undefined===null //false

强制类型转换情况

  • if 语句中的条件判断表达式,根据语句里的内容转换Boolean值
  • for 语句中的条件判断表达式(第二个)。
  • while和 do/while 循环中的条件判断表达式。
  • 三目表达式? xx : xx 中的条件判断表达式。
  • 逻辑运算符 ||(逻辑或)和 &&(逻辑与)左边的操作数(作为条件判断表达式)。