前端高频面试题---js篇（二）

newboolean
141 阅读8分钟

1. 如何区分数组和对象？

在JavaScript中，数组和对象是两种不同的数据类型，它们有一些明显的区别。

数组（Array）：

  • 数组是一种特殊的对象，用于存储多个有序的值。
  • 数组使用数字索引来访问元素，例如 arr[0]、arr[1] 等。
  • 数组可以包含不同类型的元素，例如字符串、数字、对象等。
  • 数组具有一些内置方法，例如 push()、pop()、slice() 等。

对象（Object）：

  • 对象是一种数据结构，包含一系列键值对。
  • 对象使用字符串键来访问值，例如 obj["key"]。
  • 对象的键是区分大小写的，这意味着 "key" 和 "KEY" 是不同的键。
  • 对象可以包含任何类型的值，包括其他对象。

如何区分数组和对象：

  1. 使用 typeof 运算符：typeof 可以返回一个值的类型字符串。例如：
var arr = [1, 2, 3];
var obj = {key: "value"};
console.log(typeof arr); // "object"
console.log(typeof obj); // "object"

注意，typeof 对于数组返回的是 object，而不是 array。这是因为 JavaScript 中所有的对象都是基于 Object 类型派生的，因此它们在类型上都是 object。 2. 使用 instanceof 运算符：instanceof 可以检查一个值是否是一个类的实例。例如：

var arr = [1, 2, 3];
var obj = {key: "value"};
console.log(arr instanceof Array); // true
console.log(obj instanceof Object); // true
  1. 使用 Array.isArray() 方法：Array.isArray() 方法可以检查一个值是否是数组。例如：
var arr = [1, 2, 3];
var obj = {key: "value"};
console.log(Array.isArray(arr)); // true
console.log(Array.isArray(obj)); // false

2.javascript数组常用方法有哪些？

JavaScript数组是一种非常常用的数据结构，它有许多内置的方法可以帮助我们进行操作和处理。以下是一些常用的JavaScript数组方法：

  1. push(): 向数组的末尾添加一个或多个元素，并返回新的长度。
  2. pop(): 删除并返回数组的最后一个元素。
  3. shift(): 删除并返回数组的第一个元素。
  4. unshift(): 向数组的开头添加一个或多个元素，并返回新的长度。
  5. concat(): 用于合并两个或多个数组。
  6. slice(): 返回一个新的数组，包含从 start 到 end（不包括 end）的数组元素。
  7. splice(): 用于添加/删除数组中的元素。
  8. sort(): 对数组的元素进行排序。
  9. reverse(): 反转数组的元素顺序。
  10. indexOf() / lastIndexOf(): 返回在数组中可以找到给定元素的第一个/最后一个索引，如果不存在，则返回 -1。
  11. forEach(): 对数组的每个元素执行一次提供的函数。
  12. map(): 创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。
  13. filter(): 创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。
  14. reduce(): 对数组中的每个元素执行一个由您提供的 reducer 函数(升序执行)，将其结果汇总为单个返回值。
  15. reduceRight(): 与 reduce() 类似，但是从右到左执行（降序执行）。
  16. find(): 返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。
  17. findIndex(): 返回数组中满足提供的测试函数的第一个元素的索引。否则返回 -1。
  18. some(): 测试数组中是否至少有一个元素通过由提供的函数实现的测试。
  19. every(): 测试数组的所有元素是否都通过了由提供的函数实现的测试。
  20. includes(): 判断一个数组是否包含一个指定的值，根据情况，如果需要返回 true 或 false。
  21. fill(): 用一个固定值填充一个数组中从指定位置到尾端的所有元素。
  22. flat() / flatMap(): 用于将嵌套的数组“拉平”，变成一维的数组。
  23. join(): 将数组（或一个类数组对象）的所有元素连接到一个字符串中。
  24. isArray(): 判断对象是否为数组。

以上就是JavaScript原生提供的一些常用数组方法，使用这些方法可以大大简化我们对数组的操作和处理。

3. javascript多维数组如何降维？

在JavaScript中，我们可以通过一些方法来对多维数组进行降维。下面给出两种常见的方法：

  1. 使用Array.prototype.reduce()方法：
const multiDimensionalArray = [[1, 2, 3], [4, 5, 6, 7, 8], [9, 10, 11, 12]];

const flattenedArray = multiDimensionalArray.reduce((acc, curr) => {
  return acc.concat(curr);
}, []);

console.log(flattenedArray); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]

在这个例子中，我们使用了reduce()方法来将多维数组扁平化为一个一维数组。我们创建了一个累加器（acc）和一个当前值（curr），然后将它们连接在一起。初始值是空数组，所以第一个元素直接被添加到累加器中。然后，对于数组中的每个元素，我们都将其添加到累加器中。最后，我们得到了一个扁平化的一维数组。

  1. 使用扩展运算符（Spread Operator）：

如果你使用的是ES6及以上的版本，可以使用扩展运算符来简化这个过程：

const multiDimensionalArray = [[1, 2, 3], [4, 5, 6, 7, 8], [9, 10, 11, 12]];

const flattenedArray = [...multiDimensionalArray];

console.log(flattenedArray); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]

这种方法更加简洁，它使用了扩展运算符来展开多维数组的所有元素到一个新的数组中。这种方法在处理嵌套数组时非常方便。

4. javascript数组去重有哪些方法？

在JavaScript中，有多种方法可以用来去除数组中的重复元素。以下是其中的几种方法：

  1. 使用Set：JavaScript的Set对象是一种数据结构，它只存储唯一值。因此，你可以通过将数组转换为Set来去除重复。然后再转换回数组。这种方法在处理数组中的对象时特别有用，因为对象在JavaScript中是引用类型，只有引用相同才认为是一样的。
let arr = [1, 2, 2, 3, 4, 4, 5];
let uniqueArr = [...new Set(arr)];
  1. 使用filter方法：filter方法是Array对象的一个内置方法，它创建一个新数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
let arr = [1, 2, 2, 3, 4, 4, 5];
let uniqueArr = arr.filter((value, index, self) => {
  return self.indexOf(value) === index;
});
  1. 使用indexOf方法：在上面的filter方法中，我们使用了indexOf方法来判断元素是否在数组中。但你也可以直接使用indexOf方法去除重复。
let arr = [1, 2, 2, 3, 4, 4, 5];
let uniqueArr = [];
for(let i=0; i<arr.length; i++){
  if(uniqueArr.indexOf(arr[i]) === -1){
    uniqueArr.push(arr[i]);
  }
}
  1. 使用reduce方法：你可以使用reduce方法将数组中的所有元素合并到一个新数组中，同时去除重复的元素。
let arr = [1, 2, 2, 3, 4, 4, 5];
let uniqueArr = arr.reduce((acc, val) => {
  if (!acc.includes(val)) {
    acc.push(val);
  }
  return acc;
}, []);
  1. 使用findIndex方法：你可以使用findIndex方法找到元素在数组中的索引，如果找不到则返回-1。这种方法与indexOf方法类似，但是它返回的是第一个找到的索引，而不是最后一个找到的索引。这可能在一些情况下更有用。
let arr = [1, 2, 2, 3, 4, 4, 5];
let uniqueArr = [];
for(let i=0; i<arr.length; i++){
  if(uniqueArr.findIndex(val => val === arr[i]) === -1){
    uniqueArr.push(arr[i]);
  }
}

5. javascript数组遍历的方法有哪些，分别有什么特点，性能如何？

在JavaScript中，有几种主要的方法可以用来遍历数组。每种方法都有其自身的特点和性能。

  1. for循环：这是最传统的遍历方法。你可以通过设定一个起始值和一个结束值，来逐个访问数组中的元素。它的优点是简单直接，但是缺点是在结束值的判断上，如果使用硬编码的值，可读性会较差。
for(let i = 0; i < array.length; i++){
    console.log(array[i]);
}
  1. for...of循环：这是ES6引入的一种新的遍历语法，可以直接获取到数组中的每一个元素，而不需要使用索引。它的优点是代码简洁，可读性强，但是它不能用于非可迭代对象，且在遍历过程中不能使用break来中断循环。
for(let element of array){
    console.log(element);
}
  1. forEach方法：这也是一种常用的遍历方法。它会对数组中的每个元素执行一次提供的函数。它的优点是语法简洁，且可以方便地处理异步操作，但是它不能用于解构赋值。
array.forEach(element => console.log(element));
  1. map方法：这个方法会创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后的返回值。与forEach不同，map方法会返回一个新数组，而不仅仅是执行回调函数。因此，如果需要获取处理后的结果，map方法更为合适。
let newArray = array.map(element => console.log(element));
  1. for...in循环：这个方法遍历数组的键名。由于JavaScript中对象的属性可能存在非数字键名，因此for...in循环不仅适用于数字键名的数组，也适用于对象。但是在遍历对象时，它不仅会遍历对象的所有可枚举属性，还会遍历原型链上的属性，这可能导致一些不可预见的结果。因此在使用for...in循环时需要谨慎。

性能方面，一般来说，对于简单的遍历操作，for循环和forEach方法性能相当，而for...of循环性能稍差一些。map方法和for...in循环在处理复杂操作时可能会有较好的性能，但如果只是简单的遍历操作，它们的性能可能会低于前述的几种方法。具体的性能差异可能会因具体的使用场景和浏览器实现而有所不同。

avatar
文章
阅读
粉丝