javaScript问下这个this是指向哪里？顺便解读下这段代码？

问题描述

问 题

function wrap(value, wrapper) {
    return function() {
      var args = [value];
      push.apply(args, arguments);
      return wrapper.apply(this, args);
    };
  }

解决方案

如果我印象沒記錯，你這代碼可能不太全，這應該是 underscore 的 wrap 函數
作用是包裝一個函數進行擴展

function wrap(func, wrapper) {
    return function() {
        var args = [func];
        Array.prototype.push.apply(args, arguments);
        return wrapper.apply(this, args);
    };
}

例子

舉個例子，現在有一函數 greeting 可以打招呼：

function greeting() {
    return '你好！'
}

console.log(greeting()) // => 你好!

那現在我要現有函數的基礎下進行擴展，讓其能對人打招呼

var greetingTo = wrap(greeting, function(func, name) {
    return name + func()
})

console.log(greetingTo('王大錘')) // => 王大錘你好!

原理

function wrap(func, wrapper) {
    // func 被包裝的函數
    // wrapper 擴展的函數
    return function() {
        // 這邊先把被包裝的函數給放在一個數組裡
        var args = [func];
        // arguments 是內建的屬性，可以取得該函數的參數
        // 這裡作用等同於 args.push(arguments)
        Array.prototype.push.apply(args, arguments);
        
        // 這裡的 this 是為了保持原函數的上下文
        // 被包裝後的函數是被誰呼叫的其 this 就是指向誰
        // 下面舉例
        return wrapper.apply(this, args);
    };
}

var robot = {
    name: 'A-1',
    greeting: '你好!',
    hello: function() {
        return this.greeting
    }
}

robot.hello = wrap(robot.hello, function(func, name) {
    // 這裡的 this 指向 robot
    return name + func.bind(this)()
})

console.log(robot.hello('王大錘')) // => 王大錘你好

这篇关于javaScript问下这个this是指向哪里？顺便解读下这段代码？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！