javascript中的this

Question

function outer(){
            var age = 20;
            function inner(){
                console.log(this.age);//undefined
            }
            inner.apply(outer);
        }
        outer();

请问这里为何会输出undefined呢，另外某个函数内部的函数的this是指向谁，不是说this是指向函数据以执行的作用域吗，在外部函数执行的函数，它的this应该指向外部函数才对啊，为什么是window

Answer 1

我注意到你的代码，inner.apply(outer)。你是想让inner指定使用context为outer？
的确，我测试过代码是成功的，你绑定了this 为 outer。但是outer此时又不是作为函数在调用，而是一个对象在调用。outer又没有age这个属性，所以结果为undefined。
要执行成功，我稍微修改了下代码

 <script>
        var age = 20;
        function outer(){
            var age = 20;
            function inner() {
                console.log(this === outer);//true
                console.log(this.age);//20

            }
            outer.age = 20;//此时，将outer设置一个age属性
            inner.apply(outer);
        }
        outer();
    </script>

Answer 2

你的this指向的是outer啊，只是你的outer.age确实是undefined
你在function里面用var定义变量，和this没有半毛钱关系

Answer 3

function outer(){
            var age = 20;
            function inner(){
                console.log(this.age);//undefined
            }
            inner.apply(outer);
        }; 
        outer.age=22; 
        outer();

这代码怎么感觉怪怪的

Answer 4

呵呵，this对于初学者来说是有点搞的。懂得不多，说说我的理解，大家共同提高！
首先在调试环境下，例如Chrome F12的Console中看看这个程序的运行结果：

age = 1
this.age = 2
function outer(){
    this.age = 3
    var age = 4
    function inner(){
        this.age = 5
        console.log(this.age)
    }
    inner.apply(outer)
}
outer()

然后再看看以下一些变量的值：

age
this.age
window.age
outer.age
window.outer.age

相信就有所体会。

另外，不是所有的JavaScript程序最上层的对象都是window。

Answer 5

1.请问这里为何会输出undefined呢

function outer() {
    var age = 20;
    function inner() {
        console.log(this.age);
    }
    inner.apply(outer);
}

outer.age = 123;
outer()  //123

var age = 20;inside Function outer is not work. that's special in javascript

2.try to use prototype

function outer() {
    var age = 20;
    return function inner() {
        console.log(age);
    }
    //inner.apply(outer); //not used
}

outer()() //20

this way is called closure.

Answer 6

调用了谁this就指向谁

Answer 7

如果不进行原型链接，每个function里的this都会指向这个function，js里每个function都是一个通过new都可以得到对象。
其实其实如果不懂可以多举些例子编写调试自己都会得到结论的

Answer 8

首先这个代码的等价代码如下：

var outer = function(){
var age = 20 
console.log(this); //this==window
function inner(){
  console.log(this.age)
}
  inner.apply(outer);
}
outer()

outer函数其实就是一个普通的函数，而不是一个对象中的方法.

outer函数跟例如parseInt('15')这种函数的this指向是一样的.

对于一个普通的函数，它的this的指向就是globalObj，在浏览器中就是window，而在window中没有变量age所以输出就是undefined.

在这里inner.apply(outer)想把outer的this绑定到inner毫无意义，因为outer的this就是window，绑定到inner，inner的this依旧是window。

在JavaScript中，函数的调用可以认为有以下四种：

1. 函数调用，例如alert('hello world')
2. 方法调用，例如console.log('hello world')
3. 构造函数调用，例如new RegExp('\d')
4. 间接调用，例如alert.call(undefined,'hello world')

你的示例，就是属于第一种，第一种的调用方式this就是指向全局对象，浏览器中就是window.
且在strict模式下，这里的this也不是window了，而是undefined。

"use strict";
var outer = function () {
  var age = 20;
  console.log(this); // this==undefined
  function inner() {
    console.log(this.age);
  }
  inner.apply(outer);
};
outer();

你要是想输出age变量，直接就可以如下代码，inner函数的作用域中能访问到outer函数的作用域

var outer = function () {
  var age = 20;
  function inner() {
    console.log(age);
  }
  inner.apply(outer);
};
outer();

💡Tips:   在思考this指向的问题时，不要问自己this指向的是谁，而首先要问问自己，这个函数是如何调用的，this的指向与函数是如何调用的是密切相关的， 也就是我上面所有的四种方式的哪一种，然后再来看this的指向，就一目了然了。