这两个结果为什么不一样？第一个看不懂 能解释一下吗？

Question

var o={
  fn:function (){
    console.log(fn);
  }
};
o.fn();//ERROR报错

var fn=function (){
  console.log(fn);
};
fn();//function (){console.log(fn);};正确

Answer 1

第一个是错在

console.log(fn);

这里的fn未定义, 因为在当前的函数体内, 没有fn的定义, javascript会顺着原型链找到全局环境, 发现也没有fn的定义, 所以报错. 你改成如下2种方式就不会报错:

console.log(this.fn);
console.log(o.fn);

第二个不报错是因为 全局环境下有 fn

Answer 2

我们可以这样理解 第一个o是一个对象，然后这个对象有一个key 是fn 对应的value是一个function。
然后这个console.log(fn)打印了一个变量，但是在上下文中你没有找到任何对这个变量的定义。 所以会error。

Answer 3

因为对象的key值不算变量?

Answer 4

第一个找不到fn

Answer 5

var o={
  fn:function (){
    console.log(fn); <--- `fn` 没有定义
  }
};
o.fn();//ERROR报错

把上面的改成这个就行：

var o={
  fn:function (x){
    console.log(x);
  }
};
o.fn("test")
// test

Answer 6

这是作用域的问题
第二个 fn 是全局作用域，不会报错，但是第一很久之前（现在也有）没有模块的概念封装工具类，使用的对象闭包，避免污染全局作用域的封装方法

Answer 7

由于函数内部没有声明变量 fn，因此会进一步搜索 window 中声明的 fn。
但第一个例子中 widow 中仅定义了 o，因此报错。
第二个例子中 window 中定义了 fn，因此输出该函数。

var o={
  fn:function (){
    console.log(this.fn);
  }
};

如果想要正确的访问到对象中的 fn 函数，可以使用 this.fn

Answer 8

第一个例子里的 fn 不是一个变量，只是 object literal 里的一个属性名。

console.log(fn) 需要找到一个叫 fn 的变量，于是找不到。