Javascript "это" переменная путаница

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» присваивается каждому контексту функции времени выполнения (и глобальному контексту). Он неизменен в данном контексте. Правила несколько сложны, но важные случаи ...

В глобальном контексте «это» всегда будет глобальным объектом (например, окном)

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

Хорошо, так что, очевидно, я неправильно вызывал функции ... (спасибо 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

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

outF является [окном объекта] и не имеет «внутренней» переменной, поэтому если inF = outF.inner, она не определена