【前端--面试】常见面试题(五)—— JavaScript

206 阅读3分钟

这是我参与8月更文挑战的第17天,活动详情查看:8月更文挑战

今天看到有个同学说自己笔试做错题,想到我面试时候,笔试也做的很一般,特别是手写代码,今天就整理一些手写代码的问题,看看写的怎么样~

数组去重

const arr = [1, 1, '1', 17, true, true, false, false, 'true', 'a', {}, {}];

方法一:for循环和splice

const uniqueArr = arr => {
  let len = arr.length;
  for (let i = 0; i < len; i++) {
    for (let j = i + 1; j < len; j++) {
      if (arr[i] === arr[j]) {
        arr.splice(j, 1);
        len--;
        j--;
      }
    }
  }
  return arr;
}

双层循环来判断是否有重复值,有了使用splice删除;在这里,j--保证j的值经过自加后不变。同时,len--减少循环次数提升性能。

方法二:使用set方法

const uniqueArr = Array.from(new Set(arr));

ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。

方法三:使用indexOf

const uniqueArr = arr => {
  const res = [];
  for (let i = 0; i < arr.length; i++) {
    if (res.indexOf(arr[i]) === -1) res.push(arr[i]);
  }
  return res;
}

indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。

strArr.indexOf(searchvalue,fromindex)
  • searchvalue: 必需。规定需检索的字符串值。

  • fromindex :可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的首字符开始检索。

该方法将从头到尾地检索字符串 strArr,看它是否含有子串 searchvalue。开始检索的位置在字符串的 fromindex 处或字符串的开头(没有指定 fromindex 时)。如果找到一个 searchvalue,则返回 searchvalue 的第一次出现的位置。strArr 中的字符位置是从 0 开始的。

要注意的是,indexOf()方法对大小写敏感,如果要检索的字符值没有出现,该方法就返回-1。

方法四:使用include方法

const uniqueArr = arr => {
  const res = [];
  for (let i = 0; i < arr.length; i++) {
    if (!res.includes(arr[i])) res.push(arr[i]);
  }
  return res;
}

includes() 方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。

arr.includes(searchElement, fromIndex)
  • searchElement: 必须。需要查找的元素值。
  • fromIndex:可选。从该索引处开始查找 searchElement。如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。

方法五:使用filter方法

const uniqueArr = arr => {
  return arr.filter((item, index) => {
    return arr.indexOf(item) === index;
  });
}

filter用于对数组进行过滤,filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

要注意的是: filter() 不会对空数组进行检测, 不会改变原始数组。

array.filter(function(currentValue,index,arr), thisValue)
  • function(currentValue, index,arr) :必须的。函数和数组中的每个元素都会执行这个函数。函数参数:
  1. currentValue:必须。当前元素的值;
  2. index :可选。当前元素的索引值
  3. arr :可选。当前元素属于的数组对象
  • hisValue: 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。如果省略了 thisValue"this" 的值为 "undefined"

方法六:使用map方法

const uniqueArr = arr => {
  const map = new Map();
  const res = [];
  for (let i = 0; i < arr.length; i++) {
    if (!map.has(arr[i])) {
      map.set(arr[i], true)
      res.push(arr[i]);
    }
  }
  return res;
}

map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。map() 方法按照原始数组元素顺序依次处理元素。

要注意的是: map() 不会对空数组进行检测, 不会改变原始数组。

array.filter(function(currentValue,index,arr), thisValue)
  • function(currentValue, index,arr) :必须的。函数和数组中的每个元素都会执行这个函数。函数参数:
  1. currentValue:必须。当前元素的值;
  2. index :可选。当前元素的索引值
  3. arr :可选。当前元素属于的数组对象
  • hisValue: 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。如果省略了 thisValue ,或者传入 nullundefined,那么回调函数的 this 为全局对象。

(map方法和filter方法还是很相似的~)