Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/362.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 对象方法在词法范围或此绑定之间使用?_Javascript_This_Lexical Scope - Fatal编程技术网

Javascript 对象方法在词法范围或此绑定之间使用?

Javascript 对象方法在词法范围或此绑定之间使用?,javascript,this,lexical-scope,Javascript,This,Lexical Scope,我很难确定是什么概念解释了为什么在下面的代码中保留对象属性“count”的值的原因 我已经阅读并回顾了Getify的this和object prototype部分 以及他们的部分解释。 但是,我无法理解下面的代码是词汇作用域吗? 或者是这种绑定允许保留count的值吗? 下面是示例代码: var obj = { count: 0, method: function() { console.log("in method: " + this.count)

我很难确定是什么概念解释了为什么在下面的代码中保留对象属性“count”的值的原因

我已经阅读并回顾了Getify的this和object prototype部分 以及他们的部分解释。 但是,我无法理解下面的代码是词汇作用域吗? 或者是这种绑定允许保留count的值吗?

下面是示例代码:

var obj = {
    count: 0,
    method: function() {
        console.log("in method: " + this.count)
        return this.count++;
    },
}

// here is where I have issue, when the method is invoked as a function
for (var i = 0; i<10; i++) {
    console.log(obj.method()) // invoked as a function
}

// I've left this small block in for convenience
// I have no trouble with understanding why this block outputs what it outputs
for (var i = 0; i<10; i++) {
    console.log(obj.method) // "gets its value (a reference to a function) and then logs that" from TJ Crowder
}
我对输出没有问题。我的问题是,是词汇范围界定吗? 或者是这种绑定允许保留count的值吗?

谢谢你花时间帮忙

编辑1
在Tj Crowder下面帖子的帮助下,我编辑了代码片段以澄清错误,因为它有损于我的问题。

这个问题与
这个或范围无关。:-)由于
方法
不返回任何内容,因此您会看到
未定义的
,因此调用它会产生值
未定义的
,您将通过
控制台.log
记录该值。要使其返回值
count
,您需要添加一个
return

method: function() {
    console.log(this.count)
    return this.count++;
//  ^^^^^^
},
它返回增量之前的
this.count
值(这似乎是您期望的输出)

实例:

var obj={
计数:0,
方法:函数(){
console.log(“in方法:”+this.count)
返回这个.count++;
},
timeOutMethod:function(){//我知道这里我们显式绑定了它,这里没有问题
setTimeout(函数(){
console.log(this.count++)
}.bind(这个),100)
}
}
//这里是我遇到的问题,当方法作为函数调用时

对于(var i=0;i它是绑定的

Scope是什么变量可以访问以及语言隐藏了什么变量的概念。在机器语言中,所有内存地址都是可读写的,因此在机器语言和某些汇编语言中,Scope的概念不存在(所有变量基本上都是全局的)后来,随着函数的引入,语言引入了全局变量与局部变量的概念。这一概念进一步演变为闭包,即创建多个作用域实例的能力


<>强>绑定是哪个属性/属性属于哪个对象。在java和C++语言中实现绑定的语言仅仅是约束方法如何访问属性(通常这允许语言不需要这个“关键字”)。.Late binding语言的规则稍微复杂一些,因为绑定是在运行时而不是编译时确定的。Javascript不仅是后期绑定,而且是动态的-允许程序员更改对象指向使用
函数.prototype.call()之类的东西
。并在运行时将一个对象的方法分配给另一个对象(例如
b.foo=a.foo

TL;DR将属性
计数
绑定到此
值的机制是隐式绑定

首先如果我在解释中得出错误的结论,您是否愿意提供您同意或不同意的内容,并分享我应该如何思考这个问题?我希望改进,谢谢

解释:当调用
obj.method()
时,我们有一个
this.count
的属性查找。如果我们在调用
obj.method()
时检查调用站点,
obj
是全局范围内的变量。 通过原型链访问
obj
的属性。当我们执行
this.count
的属性查找时,我们尝试访问obj内的属性。当找不到属性时,我们会在原型链中查找属性。
obj.count
包含/拥有属性
count
通过“this”绑定访问
count
属性

我问题的原因:我混淆了
这个
-绑定如何在箭头、词汇范围和对“this”的解释过于字面化的概念

示例

下面是导致我困惑的代码示例。 我的问题源于将
这种
-绑定如何在不同的代码样式中运行的约定混为一谈。我混淆了以下概念:

  • 关键字在箭头函数中的操作方式(即词法范围)

  • 词法作用域被用作解决方法,而不是理解
    这个
    的实际工作原理

    function foo() {
        return data.count++; // the obj property data.count is accessed via global scope
    }
    
    var data = {
        count: 0,
    }
    
    for (var i = 0; i<10; i++) {
        foo()
    }
    
    console.log(data.count)
    

  • 旁白:感谢@TJ Crowder和@slebetman帮助澄清了关于作用域和
    -binding的其他误解。也许这有助于区分不同的日志调用?然后您可以看到哪个打印了哪个输出,而您没有从
    方法()返回任何内容
    函数,因此它会打印
    未定义的
    。是否要执行
    返回此操作。count;
    ?我编辑了此代码片段以表达我问题的原始意图。我最初提供的代码对根本问题和您将要回答的内容有误导性,我向您道歉并感谢您的回答。完全是额头一巴掌!不是公关提供返回值当然可以解释为什么我没有定义。谢谢!另外,您已经消除了我一段时间以来的困惑-我对访问属性并将其记录到控制台时会发生什么以及如何准确地解释它感到困惑。感谢您在progr中使用范围和绑定的历史背景amming languages.我重新阅读了关于“this”和词法范围界定的参考资料,并希望
    function wait() {
        setTimeout(() => {
            console.log(this) // lexically bound
        }, 100);
    }
    
    wait();
    
    function foo() {
        // console.log(this) - will output {a: 2}
        return (a) => {
            console.log(this.a) // 'this' value is adopted from foo's lexical scope
        }
    }
    
    var obj = {
        a: 2
    }
    
    var obj2 = {
        a: 3
    }
    
    // foo is 'this'-bound to obj1
    // bar, a reference to the returned arrow-function will also be 'this'-bound to obj1
    // the arrow function binding cannot be overridden
    var bar = foo.call(obj) 
    bar.call(obj2)
    
    function foo() {
        return data.count++; // the obj property data.count is accessed via global scope
    }
    
    var data = {
        count: 0,
    }
    
    for (var i = 0; i<10; i++) {
        foo()
    }
    
    console.log(data.count)
    
    function foo(num) {
        console.log( "foo: " + num );
    
        // keep track of how many times `foo` is called
        this.count++;
    }
    
    foo.count = 0;
    
    var i;
    
    for (i=0; i<10; i++) {
        if (i > 5) {
            foo( i );
        }
    }
    // foo: 6
    // foo: 7
    // foo: 8
    // foo: 9
    
    // how many times was `foo` called?
    console.log( foo.count ); // 0 -- not what we expected