js----数组极值 方法封装 箭头函数

424 阅读2分钟

数组求极值

  1. 先升序排序 然后再取第一项------最小值
let num = [23,32,14,5,2,99,54,0];
num.sort(function(a,b){
    return a - b ;
})
let min = num[0];
  • 降序相反
  1. 假设法
//求最小值
let min = num[0];
for(let i = 1;i<num.length;i++){
    num[i]<min ? min = num[i] : void 0;
}
console.log(min);

//求最大值
let max = num[0];
for(let i = 0 ;i<num.length -1; i++){
    num[i]>max ? max = num[i] : void 0;
}
console.log(min);
  1. 排序算法 只能处理一个一个的参数
  • Math.max() 获取最大值
  • Math.min() 获取最小值

把数组变成一个一个的

  1. ES6 扩展运算符 ...对象 Math.max(...ary);
  2. 让max 和 min 接收一个数组用apply方法 Math.min.apply(null, ary)
  3. 数组转成字符串 再用eval求值 eval方法 是解释器 可以把字符串转换成代码并执行
let numString = num.toString();
let min = eval(`Max.min(${numString})`)

数组方法模拟实现

  1. push方法 向数组末尾添加项 返回数组新长度
  2. push原理
Array.prototype.myPush = function(){
    for(let i = 0; i < arguments.length;i++){
        this[this.length] = arguments[i];
    }
    retrun this.length;
}
let a = ary.myPush(11);
console.log(a);
  1. pop 原理

Array.prototype.myPop = function(){
    let last = this[this.length - 1];
    this.length--;
    return last;
}
let b = ary.myPop();
console.log(b);
  1. forEach
Array.prototype.myForEach = function (callback) {
  for (let i = 0; i < this.length; i++) {
    callback(this[i], i);
  }
};
ary.myForEach(function (item, index) {
  console.log(item, index);
});
  1. map
Array.prototype.myMap = function (cb) {
  let newArr = [];
  for (let i = 0; i < this.length; i++) {
    let result = cb(this[i], i);
    newArr.push(result);
  }
  return newArr;
};

let r6 = ary.myMap(function (item, idx) {
  return item * 2;
});
console.log(r6);

类数组转数组

  • 类数组 有索引 有length的对象
  • 常见的类数组 arguments DOM集合

类数组转数组的方法

  1. 准备一个空数组 遍历类数组 把类数组中的每一项push到新数组
function sum(){
    let arr = [];
    for(let i= 0;i<arguments.length;i++){
        ary.push(arguments[i]);
    }
    console.log(arr);
}
sum(1,2,3,4);
  1. 扩展运算符
function sum(){
    let arr=[...arguments];
    console.log(arr)
}
sum(1,4,6,7)

  1. slice.call() 使用call 借用数组slice方法 赋值一个数组
  • Array.prototype.slice.call()
  • [].slice.call() 这种写法 在IE低版本会报错
function sum(){
    var arr = Array.prototype.slice.call(arguments);
    console.log(arr);
}
sum(1,2,3)
  1. Array.from() ES6新增的方法 将类数组结构转成数组
function sum(){
    let arr = Array.from(arguments);
    console.log(arr);
}
sum(1,2,3,4)

方法封装与容错处理

  • 将类数组转换成数组的方法
function arrLikeToAry(arg){
    return Array.from(arg);
}

因为 Array.from 是 ES6 新的方法,IE 低版本不兼容 因此需要做容错处理

JS容错处理

try{
    //通常这里是第一方案
}catch(e){
//catch是捕捉异常 异常信息
    console.log(e)
}

箭头函数 ES6新语法

  1. 函数体重只有一行代码时 可以省略 return 和 花括号
  2. 若需要return一个对象 对象需要用小括号包裹
  3. 只有一个形参时 可以省略小括号
  4. 箭头函数没有arguments 但是可以使用不定参数(剩余参数 : ...形参名)
  5. 箭头函数中的this 指向其生命所在作用域中的this 箭头函数中没有this
  6. 箭头函数 不能用构造函数
  7. 不能用call apply bind 修改 this
  8. this 和arguments 是两个特殊的变量 是在函数执行时解析引擎传入给函数的

utils 工具包封装

window.utils = (function () {
  function arrLikeToAry(args) {
    try {
      return Array.from(args);
    } catch (e) {
      var arr = [];
      for (var i = 0; i < args.length; i++) {
        arr.push(args[i])
      }
      return arr;
    }
  }

  return {
    arrLikeToAry // arrLikeToAry: arrLikeToAry
  }
})();