Question

我目前正在阅读“Javascript：The Good Parts”这本书并正在使用函数。我制作了一个测试脚本来测试一些属性，我对结果感到有些困惑。这是代码：

<h3>Object</h3>
        <div style="padding-left: 10px;">
            <script type="text/javascript">
                function outterF()
                {
                    document.writeln("outterF.this = " + this + "<br>");

                    function innerF() 
                    {
                        document.writeln("innerF.this = " + this + "<br>");
                        return this;
                    };

                    var inner = innerF();
                    return this;
                }

                document.writeln("<b>From Inside:</b><br>");
                var outF = outterF();
                var inF = outF.inner;

                document.writeln("<br>");
                document.writeln("<b>From Outside:</b><br>");
                document.writeln("outterF.this = " + outF + "<br>");
                document.writeln("innerF.this = " + inF + "<br>");
            </script>
        </div>

结果是：

Object
From Inside:
outterF.this = [object Window]
innerF.this = [object Window]

From Outside:
outterF.this = [object Window]
innerF.this = undefined

请注意，outF.inner返回“undefined”，是某种语言错误吗？显然，outF.inner指向与我的对象无关的Window对象，但它不应该至少指向一个Function对象吗？

感谢
-Assaf

Answer 1

这是确定this的值的方式。

// function case
foo(); // this inside foo will refer to the global object

// method case
test.foo(); // this inside foo will refer to test

// constructor case
new foo(); // this inside foo will refer to the newly created object

因此，除非您处理方法或构造函数this，否则无用。

Answer 2

outF.inner

指向一个在代码行所在的范围内无法访问的变量。

inner在outterF中声明，并且只能在那里访问。

如果您使用

this.inner = innerF();

它可以访问（现在无法测试）

Answer 3

'this'是关键字而非属性，因此您需要将其作为独立语义引用：

//correct syntax...that gets value of this keyword
var that = this 

//unusual syntax...that is undefined, unless you explicitly set foo.this earlier
vat that = foo.this;

具体而言，为每个运行时函数上下文（以及全局上下文）分配“this”值。它在给定上下文中是不可变的。规则有些复杂，但重要的案例是......

在全局上下文中，“this”将始终是全局对象（例如窗口）

var that = this; //window

当从方法调用'this'调用时，它将成为方法调用的接收者

obj.foo = function() {
    return this;
}

obj.foo(); //obj

从函数调用中调用'this'将是全局对象

var obj = {};
obj.foo = function() {
    return this;
}

var myFn = obj.foo;
myFn(); //window

您还可以使用call / apply在函数上下文中设置自定义'this'值。如果你有兴趣了解更多，请阅读:(没有双关语:-)）http://javascriptweblog.wordpress.com/2010/08/30/understanding-javascripts-this/

Answer 4

outF是[对象窗口]并且没有“内部”变量，如果inF = outF.inner，它是未定义的

Answer 5

请注意，outF（在outF.inner行中）并未引用outF的范围，而是值已分配到outF。

function MyCtor() {
    this.someVal = function() {
        document.write("someVal's this? " + this);
    };
}

var myobj = new MyCtor();
myobj.someVal();

给出someVal's this? [object Object]（或其他），这就是你想要的。

Answer 6

好吧显然我错误地调用了这些功能......（感谢Ivo Wetzel指出）。将代码更改为更好看：

<h3>Object</h3>
        <div style="padding-left: 10px;">
            <script type="text/javascript">
                var outF = function outterF()
                {
                    var that = this;
                    function getThat() {return that;}

                    document.writeln("outterF.this = " + this + "<br>");

                    var inner = function innerF() 
                    {
                        document.writeln("innerF.this = " + this + "<br>");
                        return this;
                    };


                    document.writeln("inner is " + typeof inner + "<br>");

                    return this;
                }

                document.writeln("<b>From Inside:</b><br>");
                var inF = outF.inner;

                document.writeln("<br>");
                document.writeln("<b>From Outside:</b><br>");
                document.writeln("outterF.this = " + typeof outF + "<br>");
                document.writeln("innerF.this = " + typeof inF + "<br>");
            </script>
        </div>

结果：

Object
From Inside:

From Outside:
outterF.this = function
innerF.this = undefined

Javascript“这个”变量混乱

6 个答案: