Почему я получаю неопределенное значение

Question

У меня этот код, когда я запускаю его, отображается неопределенный. Однако мы можем получить доступ к глобальному свойству с помощью этого ключевого слова.

var firstName = "Peter", 
     lastName = "Ally"; 

     function showFullName() { 
     // "this" inside this function will have the value of the window object 
     // because the showFullName() function is defined in the global scope, just like the firstName and lastName 
     alert (this.firstName + " " + this.lastName); 
     } 
     showFullName(); 

Answer 1

Обычный вариант использования window ключевое слово вместо. this не зависит от того места, где была объявлена ​​функция, но зависит от места, где был (и как) вызван.

var firstName = "Peter", 
    lastName = "Ally"; 

function showFullName() { 
    alert (window.firstName + " " + window.lastName); 
} 
showFullName(); 

Answer 2

Таким образом, я узнал, что, когда мы используем строгий режим, это ключевое слово содержит значение undefined в глобальных функциях. В строгом режиме, однако, значение этого остается на то, что он был установлен при входе в контекст выполнения, поэтому, в следующем случае, это будет по умолчанию не определено:

function f2(){ 
     "use strict"; // see strict mode 
     return this; 
    } 

    f2() === undefined; 

Так, в строгом режиме, если это не было определено контекстом выполнения, оно остается неопределенным. Я взял этот фрагмент кода из MDN.

Так что в моем случае значение не появляется в скрипке. Но это было бы причиной, на которую указывает @vlaz. Благодаря @vlaz

Answer 3

Это работает, если выполняется должным образом (заменить alert с console.log для облегчения примеров)

var firstName = "Peter", 
 
    lastName = "Ally"; 
 

 
function showFullName() { 
 
    // "this" inside this function will have the value of the window object 
 
    console.log("this and window are the same thing", this === window); 
 
    
 
    // because the showFullName() function is defined in the global scope, just like the firstName and lastName 
 
    console.log(this.firstName + " " + this.lastName); 
 
} 
 

 
showFullName();

Если это помещается в функциональной области он не будет работать, однако - предположительно JS Fiddle делает что-то подобное

(function() { 
 
    var firstName = "Peter", 
 
     lastName = "Ally"; 
 

 
    function showFullName() { 
 
     // "this" inside this function will still have the value of the window object 
 
     console.log("this and window are the same thing", this === window); 
 
     
 
     // however firstName and lastName are not goint to be attached to it because they are in functional scope 
 
     console.log("the names are still reachable", firstName, lastName) 
 
     
 
     //but not attached to the window object (which "this" points to) 
 
     console.log(this.firstName + " " + this.lastName); 
 
    } 
 

 
    showFullName(); 
 
})();

Обратите внимание, что с тем, если у вас есть strict mode enabled то this будет undefined вместо window и код выдаст ошибку

var firstName = "Peter", 
 
    lastName = "Ally"; 
 

 
function showFullName() { 
 
    "use strict"; 
 
    // "this" inside this function will now have the value "undefined" 
 
    console.log("'this' is actually 'undefined'", this); 
 
    console.log("the actual value 'undefined', not a string", typeof this); 
 
    
 
    // the following line will throw a TypeError because it's trying to get a property from "undefined" 
 
    console.log(this.firstName + " " + this.lastName); 
 
} 
 

 
showFullName();