javaScript问下这个this是指向哪里?顺便解读下这段代码?
阿神
阿神 2017-04-11 11:34:01
[JavaScript讨论组]
function wrap(value, wrapper) {
    return function() {
      var args = [value];
      push.apply(args, arguments);
      return wrapper.apply(this, args);
    };
  }
阿神
阿神

闭关修行中......

全部回复(5)
天蓬老师

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

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('王大錘')) // => 王大錘你好
PHP中文网
var greetingTo = wrap(greeting, function(func, name) {
    return name + func()
})

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


‘王大锤’这个参数怎么传过去的?@Tomoe
巴扎黑

this永远是表示上下文的 开一个例子

var a = wrap(10, function(){});
var b = [11];
b.a();

这里给了a()一个调用对象, this就是指向b. 这里的push应该是this.push, 不然感觉会报错啊

call的意思就是替换上下文, 这里本来是b.push(arguments), 替换之后会变成args.push(arguments)

PHP中文网

仅仅是函数调用,此处this指向全局变量global(浏览器window,NodeJS global)。

ringa_lee

此处this是 指向wrapper,谁调用指向谁。这个像是wrap函数的源码,它可以将函数再包裹一层,返回一个新的函数,新的函数里面可以调用原来的函数,将原函数的处理结果再处理一次返回。类似与AOP切面。在函数处理前/后动态的添加一些额外的处理。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号