手写实现数组方法之去重、concat、slice 和 扁平化

一、数组去重

1. 数组的去重，有三种方法，如下所示：

• 利用 forEach() 和 indexOf()，本质上是双重遍历，效率差些
• 利用 forEach() + 对象容器，只需一重遍历，效率高些
• 利用 ES6 语法：from + Set 或者 ... + set，编码简洁

2. 数组去重的实现，代码如下所示：

function unique1 (arr) {
  // 声明一个空数组
  const result = [];
  // 遍历原始数组
  arr.forEach(item => {
    // 检测 result 数组中是否包含这个元素
    if (result.indexOf(item) === -1) {
      // 若没有该元素，则插入到 result 中
      result.push(item);
    }
  });
  // 返回
  return result;
}


function unique2 (arr) {
  // 声明空数组
  const result = [];
  // 声明空对象
  const obj = {};
  // 遍历数组
  arr.forEach(item => {
    if (obj[item] === undefined) {
      // 将 item 作为下标存储在 obj 中
      obj[item] = true;
      result.push(item);
    }
  });
  // 返回结果
  return result;
}


function unique3 (arr) {
  // // 将数组转化为集合 Set
  // let set = new Set(arr);
  // // 将 set 展开创建一个数组
  // let array = [...set];
  // return array;
  return [...new Set(arr)];
}

3. 手写函数数组去重的应用，代码如下所示：

// 声明一个数组
const arr = [1,2,3,4,2];

// 去重
console.log(unique1(arr));
console.log(unique2(arr));
console.log(unique3(arr));

二、concat 方法

1. concat 方法，数组元素的拼接。
2. concat 的实现，代码如下所示：

export function concat (arr, ...args) {
  // 声明一个空数组
  const result = [...arr];
  // 遍历数组
  args.forEach(item => {
    // 判断 item 是否为数组
    if (Array.isArray(item)) {
      result.push(...item);
    } else {
      result.push(item);
    }
  });
  // 返回 result
  return result;
}

3. 手写函数 concat 的应用，代码如下所示：

// 数组合并
let arr = [1,2,3];
const result = arr.concat([4,5,6], 7,8);
console.log(result);
const result = concat(arr, [4,5,6], 7,8,[9,10]);

三、slice 方法

1. slice 方法，数组元素的切片。
2. slice 的实现，代码如下所示：

function slice (arr, begin, end) {
  // 若 arr 数组长度为 0 
  if (arr.length === 0) {
    return [];
  }
  // 判断 begin
  begin = begin || 0;
  if (begin >= arr.length) {
    return [];
  }
  // 判断 end
  end = end || arr.length;
  if (end < begin) {
    end = arr.length;
  }

  // 声明一个空数组
  const result = [];
  
  // 遍历对象
  for(let i=0;i<arr.length;i++) {
    if (i >= begin && i< end) {
      // 将下标对应的元素压入数组
      result.push(arr[i]);
    }
  }

  return result;
}

3. 手写函数 slice 的应用，代码如下所示：

// 数组切片
let arr = [1,3,4,52,2,8];
let result = arr.slice(1, 5);
console.log(result);

const result = slice(arr, 1, 5);
const result = slice(arr);
console.log(result);

四、数组扁平化

1. 数组扁平化，取出嵌套数组，多维中的所有元素放到一个新数组，一维中。数组的扁平化，有两种方法，如下所示：

• 递归 + reduce() + concat()
• ... + some() + concat()

2. 数组扁平化的实现，代码如下所示：

function flatten1 (arr) {
  // 声明空数组
  let result = [];
  // 遍历数组
  arr.forEach(item => {
    // 判断
    if (Array.isArray(item)) {
      result = result.concat(flatten1(item));
    } else {
      result = result.concat(item);
    }
  });
  // 返回结果
  return result;
}


function flatten2 (arr) {
  // 声明数组
  let result = [...arr];
  // 循环判断
  while(result.some(item => Array.isArray(item))) {
    result = [].concat(...result);
  }
  // 返回结果
  return result;
}

3. 手写函数数组扁平化的应用，代码如下所示：

// 声明一个数组
let arr = [1,2,3[6,7,8],6];
// 数组扁平化
console.log(flatten1(arr));
console.log(flatten2(arr));