一些前端编程题目（一）

题目和解题代码

1、如果数组中存在 item，则返回元素在数组中的位置，否则返回 -1

// 解法一
function indexOf(arr, item){
	return arr.indexOf(item);
}
// 解法二 若不支持indexOf
function indexOf(arr, item) {
            if (Array.prototype.indexOf) { // 判断浏览器是否支持indexOf
                return arr.indexOf(item);
            } else {
                for (var i = 0; i < arr.length; i++) {
                    if (arr[i] === item) {
                        return i;
                    }
                }
            }
            return -1;
        }
        

2、计算给定数组 arr 中所有元素的总和

// 普遍解法
function sum(arr) {
    var num=0;
    for(var i=0;i<arr.length;i++){
        num=num+arr[i];
    }
    return num;
}
// forEach遍历
function sum(arr) {
    var s = 0;
    arr.forEach(function(value, index, arr) {
        s += value;
    }, 0);
  
    return s;
}

3、移除数组 arr 中的所有值与 item 相等的元素。不要直接修改数组 arr，结果返回新的数组

// 解法一 push()： 在数组末尾添加元素
function remove(arr,item){
    var newArr = [];
    for(var i=0;i<arr.length;i++){
        if(arr[i] != item){
            newArr.push(arr[i]);
        }
    }
    return newArr;
}
// 解法二 
function remove(arr, item) {
    var newArr=[];
    for(var i=0;i<arr.length;i++){
        if(arr[i]!==item){
            newArr[newArr.length]=arr[i];
        }
    }
    return newArr;
}
// 解法三 splice(index,num)：index：数组元素的位置，num：删除几位元素
function remove(arr,item){
    var newArr = arr.slice(0);
    for(var i=0;i<newArr.length;i++){
        if(newArr[i] == item){
            newArr.splice(i,1);
            i--;
        }
    }
    return newArr;
}

4、移除数组 arr 中的所有值与 item 相等的元素，直接在给定的 arr 数组上进行操作，并将结果返回

/*前道题不同之处在于要求给定数组上进行操作*/
// splice()
function removeWithoutCopy(arr, item) {
   for(var i=0;i<arr.length;i++){
       if(arr[i]==item){
           arr.splice(i,1);
           i--;
       }
   }
    return arr;
}

5、在数组 arr 末尾添加元素 item。不要直接修改数组 arr，结果返回新的数组

// 解法一 利用concat将item连接到数组arr上，返回新的数组，不会更改现有数组
function append(arr, item) {
   return arr.concat(item);
}
// 解法二 普通的迭代拷贝 push()
function append(arr, item) {
    var newArr=[];
    for(var i=0;i<arr.length;i++){
        newArr.push(arr[i]);
    }
    newArr.push(item);
    return newArr; 
}

6、删除数组 arr 最后一个元素。不要直接修改数组 arr，结果返回新的数组

// 解法一 pop()
function truncate(arr) {
 var newArr = arr.slice(0);
     newArr.pop();
     return newArr;
 }
// 解法二 slice() 方法返回一个新的数组对象，这一对象是一个由 begin 和 end 决定的原数组的浅拷贝（包括 begin，不包括end）。原始数组不会被改变。
// slice(begin,end) end被删除
function truncate(arr) {
        return arr.slice(0,arr.length-1);
}

7、 封装函数 f，使 f 的 this 指向指定的对象

// 解法一 使用call方法 注意arguments对象的参数形式
function bindThis(f, oTarget) {
	return function(){
		return f.call(oTarget,...arguments)
	}
} 
// 解法二 使用apply方法
function bindThis(f, oTarget) {
	return function(){
		return f.apply(oTarget,arguments)
	}
} 
// 解法三 bind方法 直接绑定this方向
function bindThis(f, oTarget) {
	return f.bind(oTarget)
}
/*考察点：call，apply和bind的作用和区别？
  相同点：1：都能改变this指向
  2：都能传递参数
  3：都能通过方法"."方法名调用
  不同点：1：函数名不同
  参数传递方式不同（注意看第二个）
  改变this指向的时机不同(bind在复制时改变，其他两个在调用时改变)
  参数传递时机不同（注意看第三个） */