JavaScript面试题十

一、请解释JavaScript中的原型链（Prototype Chain），并给出一个简单的例子。

JavaScript中的原型链是JavaScript实现继承的主要方式。每个对象都有一个内置的 [[Prototype]]（内部链接）指向它的原型对象。当我们试图访问一个对象的属性时，如果该对象自身没有这个属性，那么JavaScript会沿着原型链向上查找，直到找到该属性或到达原型链的末端（通常是null）。

原型链的基本规则如下：

1. 当我们试图访问一个对象的某个属性时，会首先在该对象自身的属性中查找。
2. 如果对象自身没有该属性，那么JavaScript会查看该对象的原型（也就是它的 [[Prototype]]）。
3. 如果在原型对象中找到了该属性，那么就直接返回该属性的值。
4. 如果没有在原型对象中找到该属性，那么就会继续查找原型的原型，依此类推，直到找到该属性或到达原型链的末端（通常是null）。

以下是一个简单的例子，说明JavaScript中的原型链：

// 创建一个构造函数Animal
function Animal(name) {
    this.name = name;
}

// 在Animal的原型上添加一个方法
Animal.prototype.speak = function() {
    console.log(this.name + ' makes a noise.');
};

// 创建一个新的构造函数Dog，它继承自Animal
function Dog(name) {
    Animal.call(this, name); // 调用父构造函数，以继承其属性
}

// 将Dog的原型设置为一个新的Animal实例
Dog.prototype = Object.create(Animal.prototype);

// 在Dog的原型上添加一个新的方法
Dog.prototype.bark = function() {
    console.log(this.name + ' barks.');
};

// 创建一个Dog的实例
var d = new Dog('Mitzie');

// 访问Dog实例自身的属性
console.log(d.name); // 输出: Mitzie

// 访问Dog实例继承自Animal的方法
d.speak(); // 输出: Mitzie makes a noise.

// 访问Dog实例自身的方法
d.bark(); // 输出: Mitzie barks.

在这个例子中，Dog 对象有一个 name 属性（它继承自 Animal 构造函数），以及两个方法：speak（它继承自 Animal.prototype）和 bark（它定义在 Dog.prototype 上）。当我们尝试访问 d.speak() 时，由于 Dog 实例自身没有 speak 方法，所以JavaScript会沿着原型链向上查找，最终在 Animal.prototype 上找到了 speak 方法。同样地，当我们访问 d.bark() 时，由于 bark 方法直接定义在 Dog.prototype 上，所以JavaScript会立即找到并调用它。

二、JavaScript中的Array.prototype.forEach、Array.prototype.map和Array.prototype.filter方法有什么区别？

在JavaScript中，Array.prototype.forEach、Array.prototype.map和Array.prototype.filter这三个方法都是数组（Array）的内置方法，用于处理数组元素，但它们各自的目的和返回的结果有所不同。

1. Array.prototype.forEach

forEach方法用于遍历数组的每个元素，并对每个元素执行一次提供的函数。这个方法没有返回值（或者说它的返回值是undefined），它主要是用来执行某种副作用（比如修改外部变量或触发某些操作）。

示例：

let array = [1, 2, 3];
let sum = 0;

array.forEach(function(value) {
  sum += value;
});

console.log(sum); // 输出 6

2. Array.prototype.map

map方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。这个方法常用于数组元素的转换或映射。

示例：

let array = [1, 2, 3];
let newArray = array.map(function(value) {
  return value * 2;
});

console.log(newArray); // 输出 [2, 4, 6]

3. Array.prototype.filter

filter方法创建一个新数组，新数组中的元素是通过检查指定函数而得出的所有元素。这个方法常用于过滤数组中的元素。

示例：

let array = [1, 2, 3, 4, 5];
let newArray = array.filter(function(value) {
  return value > 2;
});

console.log(newArray); // 输出 [3, 4, 5]

总结：

• forEach：遍历数组元素并执行函数，没有返回值。
• map：遍历数组元素并执行函数，返回一个新数组，新数组中的元素是原数组元素执行函数后的结果。
• filter：遍历数组元素并执行函数，返回一个新数组，新数组中的元素是原数组中使得函数返回true的元素。