// 通过原型链访问方法
const arr = [];
console.log(arr.__proto__ === Array.prototype); // true
arr.push(1, 2, 3); // 通过原型链调用Array.prototype.push


// 方法借用：直接使用Array.prototype上的方法
const obj = { length: 0 };
Array.prototype.push.call(obj, 1, 2, 3);
console.log(obj); // { '0': 1, '1': 2, '2': 3, length: 3 }

// 不同调用方式下的this指向
function showThis() {
  console.log(this);
}


// 默认绑定
showThis(); // 全局对象(非严格模式)或undefined(严格模式)


// 隐式绑定
const obj = { method: showThis };
obj.method(); // obj


// 显式绑定(方法借用)
showThis.call({ name: '张三' }); // { name: '张三' }


// new绑定
new showThis(); // showThis {}


// 箭头函数
const arrowFn = () => { console.log(this); };
arrowFn.call({ name: '李四' }); // 不受call影响，this仍指向定义时的外层作用域

function greet(greeting) {
  console.log(`${greeting}, 我是${this.name}`);
}


const person1 = { name: '张三' };
const person2 = { name: '李四' };


// 借用greet函数
greet.call(person1, '你好'); // 输出: 你好, 我是张三
greet.call(person2, '早上好'); // 输出: 早上好, 我是李四

3. bind()方法

bind()方法创建一个新函数，该函数的this值被永久绑定到指定对象，不会在调用时被改变。

function sayHobby() {
  console.log(`${this.name}喜欢${this.hobby}`);
}


const person = { name: '赵六', hobby: '编程' };


// 创建一个绑定到person的新函数
const boundFunction = sayHobby.bind(person);
boundFunction(); // 输出: 赵六喜欢编程


// 即使尝试改变this，也不会成功
const anotherPerson = { name: '钱七', hobby: '游泳' };
boundFunction.call(anotherPerson); // 仍然输出: 赵六喜欢编程

四、实际应用场景

1. 类数组对象转换为数组

一个经典的方法借用案例是将类数组对象（如arguments、DOM元素集合）转换为真正的数组。

function convertToArray() {
  // 借用Array.prototype.slice方法
  return Array.prototype.slice.call(arguments);
}


const args = convertToArray(1, 2, 3, 4);
console.log(args); // [1, 2, 3, 4]
console.log(Array.isArray(args)); // true

更现代的方式是使用Array.from()或展开运算符：

function modernConvert() {
  // 使用Array.from
  const argsArray1 = Array.from(arguments);
  
  // 使用展开运算符
  const argsArray2 = [...arguments];
  
  return [argsArray1, argsArray2];
}

2. 借用数组方法处理字符串

字符串没有数组的许多实用方法，但我们可以借用它们：

3. 继承和混入模式

方法借用在实现继承和混入模式时非常有用：

// 基础对象
const calculator = {
  add(x, y) {
    return x + y;
  },
  subtract(x, y) {
    return x - y;
  }
};


// 科学计算器对象
const scientificCalculator = {
  square(x) {
    return x * x;
  },
  // 借用calculator的方法
  performOperation(operation, x, y) {
    return calculator[operation].call(this, x, y);
  }
};


console.log(scientificCalculator.performOperation('add', 5, 3)); // 8
console.log(scientificCalculator.square(4)); // 16

五、方法借用的高级技巧

1. 批量方法借用

有时我们需要一次性借用多个方法：

const arrayMethods = ['push', 'pop', 'shift', 'unshift', 'slice', 'map', 'filter'];
const myCollection = {
  length: 0,
  addAll(...items) {
    Array.prototype.push.apply(this, items);
    return this;
  }
};


// 批量借用数组方法
arrayMethods.forEach(method => {
  myCollection[method] = function(...args) {
    return Array.prototype[method].apply(this, args);
  };
});


myCollection.addAll(1, 2, 3, 4);
console.log(myCollection.length); // 4
console.log(myCollection.map(x => x * 2)); // [2, 4, 6, 8]

2. 借用原生方法提高性能

借用原生方法通常比自己实现更高效：

// 低效方式
function hasOwnPropertyCustom(obj, prop) {
  for (let key in obj) {
    if (key === prop && !obj.constructor.prototype[key]) {
      return true;
    }
  }
  return false;
}


// 高效方式：借用Object.prototype.hasOwnProperty
function hasOwnPropertyEfficient(obj, prop) {
  return Object.prototype.hasOwnProperty.call(obj, prop);
}


// 性能测试会显示第二种方法更快

3. 安全的方法借用

在某些情况下，我们需要确保方法借用的安全性：

六、方法借用的注意事项

1. 箭头函数无法借用

箭头函数的this值在定义时就已确定，无法通过call、apply或bind改变：

const obj = { name: '小明' };


const regularFunction = function() {
  console.log(this.name);
};


const arrowFunction = () => {
  console.log(this.name);
};


regularFunction.call(obj); // "小明"
arrowFunction.call(obj); // undefined (或全局对象的name属性)

2. 严格模式下的差异

在严格模式下，如果未指定this值，函数内的this将为undefined而非全局对象：

"use strict";


function showThis() {
  console.log(this);
}


showThis(); // undefined
showThis.call(null); // null

3. 性能考虑

方法借用虽然灵活，但可能带来性能开销。在性能敏感的场景中，应谨慎使用：

// 性能测试
function testPerformance() {
  const arr = [];
  console.time('直接调用');
  for (let i = 0; i < 1000000; i++) {
    arr.push(i);
  }
  console.timeEnd('直接调用');
  
  const obj = { length: 0 };
  console.time('方法借用');
  for (let i = 0; i < 1000000; i++) {
    Array.prototype.push.call(obj, i);
  }
  console.timeEnd('方法借用');
}


// 通常，方法借用会比直接调用慢

七、现代JavaScript中的替代方案

随着JavaScript的发展，一些方法借用的经典用例现在有了更简洁的替代方案：

1. 展开运算符和解构赋值

2. Object.assign()和对象展开

// 旧方式：通过方法借用实现对象混入
function mixin(target, source) {
  Object.keys(source).forEach(key => {
    if (typeof source[key] === 'function') {
      target[key] = function(...args) {
        return source[key].apply(this, args);
      };
    }
  });
  return target;
}


// 新方式：使用Object.assign或对象展开
const target = {};
const source = { method() { return this; } };


// 使用Object.assign
Object.assign(target, source);


// 或使用对象展开
const enhanced = { ...target, ...source };

// 原型链示例
function Person(name) {
  this.name = name;
}


Person.prototype.sayHello = function() {
  console.log(`你好，我是${this.name}`);
};


const person = new Person('王小明');
person.sayHello(); // 输出: 你好，我是王小明


// person对象本身没有sayHello方法
console.log(person.hasOwnProperty('sayHello')); // false


// sayHello方法位于Person.prototype上
console.log(Person.prototype.hasOwnProperty('sayHello')); // true

// 原型链继承
const array = [1, 2, 3];
array.forEach(item => console.log(item)); // 通过原型链调用Array.prototype.forEach


// 方法借用
const arrayLike = { 0: 1, 1: 2, 2: 3, length: 3 };
// arrayLike.forEach不存在，无法通过原型链调用
Array.prototype.forEach.call(arrayLike, item => console.log(item)); // 通过方法借用调用

参考文章：原文链接​