Question

在我的页面的<head>中，我这样做：

<script type="text/javascript" src="js/foo.js"></script>
<script type="text/javascript">
  console.log(foo.bar);
</script>

foo.js代码：

var foo = function()
{
    this.bar = function()
    {
        console.log('here');
    }
}

稍后在html文档中：

<a href="#" onclick="foo.bar();">Test</a>

但是，如果单击上面的链接，即使已包含foo.js，也表示函数未定义。此外，如果我console.log(foo)它只显示'function（）'，console.log(foo.bar)显示未定义。为什么这样，为什么我不能访问该功能？

Answer 1

因为您尚未创建对象。这是运行代码的正确方法：

var foo = function()
{
    this.bar = function()
    {
        console.log('here');
    }
}

var instance = new foo();
instance.bar();

http://jsfiddle.net/zerkms/wDaEn/

或者，您可以用其他方式定义它：

var foo = {
    bar: function() {
        console.log('here');
    }
};

foo.bar();

http://jsfiddle.net/zerkms/wDaEn/1/

Answer 2

由于您正在使用this并创建实例类成员，因此您需要首先 实例化 该类：

var fooClass = new foo;
console.log(fooClass.bar());

Answer 3

我不确定你是否想要这样，但为了让你的console.log(foo.bar);能够工作，你可以这样做：

var foo = {
    bar: function() {
        console.log('here');
    }
};

Answer 4

要进行最少的代码更改，请使用以下命令：

<script type="text/javascript">
    var foo = function()
    {
        this.bar = function()
        {
           console.log('here');
        };
        return this; // magic yes ?
    };


foo().bar();
</script>

Answer 5

foo.js的内容只是将foo初始化为函数...在调用foo()之前，实现中的内容并不重要。所以foo.bar未定义。

Answer 6

以上答案并非都是正确的，请记住javascript没有类的概念或所述类的实例。我会对Javascript范围和闭包进行一些阅读。

将对象分配给变量名称栏时，将其分配给本地范围。然后，您尝试从全局上下文访问本地函数。这是错误的。

我愿意打赌你正在尝试以下方面： -

var foo = {
      bar: function() {

      }
}

等等...

为什么这个变量没有被初始化？

6 个答案: