js常用函数引发的思考

183 阅读1分钟

几个js常用函数

1.Array.forEach() 本身不改变原数组(并且不可以通过赋值,改变原数组),因为没有返回值,是将原数组中的每一个元素执行传进提供的函数中。类似for,但是不能break. 问题:forEach为什么不能通过break和return跳出循环? 答:

// 手写一个forEach函数
Array.prototype.forEach = 
  function(callback,thisArg){ 
    var len = this.length; 
    for(var i = 0; i < len; i++){ 
      callback.call(thisArg,this[i], i, this); 
    } 
}

答: forEach第一个参数是一个回调函数,break和return是回调函数提中,而for循环在回调函数的外层包裹着回调函数,我们根本没有办法操作到真正的for循环体。故除抛出异常之外,没有其他方法可以停止或中断循环。

let arr = [0, 1, "stop", 3, 4];
try {
    arr.forEach(element => {
        if (element === "stop") {
            throw new Error("forEachBreak"); // 抛出异常
        }
        console.log(element); // 输出 0 1 后面不输出
    });
} catch (e) {
    console.log(e.message); // forEachBreak
};

2.Array.filter()是将所有元素传递进提供的函数中进行判断,不改变原数组,返回一个由满足条件的元素构成的新数组。(过滤,过滤出满足条件的数组元素组成新数组,并返回)

Array.prototype.filter = function(fn){ 
    let newArr = []; 
    for(let i=0;i< this.length;i++){
    let flag = fn (this[i]); 
    flag&&newArr.push(this[i]) 
    return newArr; 
 } 
}


  1. Array.map()本身不改变原数组(但是可以通过重新赋值,改变原数组),原因map返回一个新数组,新数组中元素为原始数组元素调用函数处理后的值(也说明新数组中的元素长度和原数组一样,不满足条件也会返回undefined项)。
Array.prototype.myMap = function(fn){ 
    var len = this.length; 
    var arr = []; //创建新数组 
    for(var i = 0; i < len; i ++){ 
      arr.push(fn(this[i],i)) 
    } 
    return arr; 
}

思考

1.原型、原型链、原型对象、修改原型链导致的影响

2.this指向问题

3.break 与 return、continue

其他

浅谈对Css预编语言的理解?有哪些区别?