前端易忽略的小知识点汇总

数字中,只有0转boolean时为false。负数转boolean值时也是true;

'' 或者 "",undefined, null, NaN, 0,false 转换成Boolean值均为false

"!!"将表达式进行强制转化为bool值的运算,运算结果为true或者false。

例如 array=[1,2,3]      array.num=undefind   !array.num=true   !!array.num=false

filter() 返回值为新的数组,不会改变原数组

splice() 返回的是删除后的数组元素,splice()会改变原来数组  添加时第二个参数设置成0就可以

//语法
arrayObject.splice(index,howmany,item1,.....,itemX)
//使用
arr.splice(0,0,1);//在起始位置添加数字‘1’
arr.splice(1,1); // 删除数组中第二位元素

和splice相似的slice

slice() 方法可从已有的数组中返回选定的元素。原数组不变(这一点与splice不同)
使用方法:  arr.slice(start,end);   //start为初始位置,end为结尾位置,返回的结果是从start到end(不取)的新数组
       arr.slice(start);     //选取从start开始直至最后一个元素
 
Array.from() 方法可以让我们通过类数组(array-like)或可迭代对象来创建一个新的 Array(数组) 实例。
//1、该类数组对象必须具有length属性,用于指定数组的长度。如果没有length属性,那么转换后的数组是一个空数组。
//2、该类数组对象的属性名必须为数字(可加引号,也可不加)
// 使用
let arrayLike = {
    0: '1111', 
    1: '2222',
    2: '3333',
    3: ['apple','banana','paper'],
    'length': 4
}
let arr = Array.from(arrayLike)
console.log(arr) // ['1111','2222','3333',['apple','banana','paper']]

 

 
for...of  允许你遍历 Arrays(数组), Strings(字符串), Maps(映射), Sets(集合)等可迭代的数据结构等。支持新的ES6的迭代协议.
// array-example    输出 各个元素
const iterable = ['mini', 'mani', 'mo'];
for (const value of iterable) {
  console.log(value);
}

// map-example   输出   Key: one and Value: 1
const iterable = new Map([['one', 1], ['two', 2]]);
for (const [key, value] of iterable) {
  console.log(`Key: ${key} and Value: ${value}`);
}

// set-example   输出 1,2
const iterable = new Set([1, 1, 2, 2, 1]);
for (const value of iterable) {
  console.log(value);
}


// string-example   输出 "j"   "a"  "v"  "a"  "s"  "c" "r"   "i"   "p"   "t"
const iterable = 'javascript';
for (const value of iterable) {
  console.log(value);
}

// arguments-example 输出  a   b   c
function args() {
  for (const arg of arguments) {
    console.log(arg);
  }
}
args('a', 'b', 'c');

// 终止迭代时使用  break、continue、return 和 throw
//普通对象不可以用 for of 迭代   会报错:TypeError: obj[Symbol.iterator] is not a function。

for...of  for...in map  foreach  filter的使用方式和区别

for...of 与 for...in的区别

for in 会遍历数组内或对象上所有可枚举的属性,包括原型上的属性和方法(更适合于对象的遍历,尽量不要使用 for in 遍历数组)
for of 不会遍历构造函数原型上的可枚举属性。即若 Array.prototype.newArr = () => {}; 也不会遍历newArr,一般不用于对象属性和方法的迭代
 
foreach会从头到尾对数组里的每个元素遍历一遍 ,他不会生成新数组,也不改变原数组,回调函数接收三个值,分别是 数组的元素,索引和当前数组
    let arr = ["a","b","c","d"]
    arr.forEach((el,index,array) => {
        if(el == "b" ) return
        console.log(el,index,array)
    })

 

上边的例子中加一个判断,如果满足元素等于b,return出去,按理说遍历时满足这个条件后边就不遍历了,但是foreach不会,他会接着向下进行

map 和foreach类似,map也会把数组的每一项都遍历一遍,会返回一个新数组,原数组保持不变,值得注意的是,map不会对空数组进行检测
//新数组会将return后边的值计算得出新的数组,如果是表达式会返回boolean值
let arr = [1,2,3,4,5]
let  b =  arr.map((el,val,array) => {
   return el > 2
})
console.log(b)
//返回结果  [false,false,true,true,true]

filter 为过滤的意思,也就是说它会把满足条件的元素拿出来形成一个新的数组

         0 | -0 / null / undefined / ’ ’ / NaN 返回false其余都为true,-1/-2负数都为true

    let arr = [1,2,3,4,5,6,7,8,9]
    let result = arr.filter(el => {
        return el % 2 == 0
    })
    console.log(result)
// 返回结果  [2,4,6,8]

运用filter去除数组中重复的元素:

let phone = ['苹果','锤子','三星','华为','锤子','苹果','小米','锤子']
let result = phone.filter((el,index,arr) => {
  return arr.indexOf(el) == index
})
console.log(result)

 

 
 
 
 
(不定期更新中...)
 
 
 
  
posted @ 2020-08-13 15:31  千城。  阅读(149)  评论(0编辑  收藏  举报