将变量传递到对象方法javascript中

试着了解对象、方法、闭包等。。。在Javascript中

我不明白为什么这不起作用，我想我的思维有一些根本性的缺陷。我希望val变量能传递给addNote（）函数，但事实并非如此。我认为任何在函数外部声明的变量都可以用于该函数，只要它们不在另一个函数中。这不对吗

if(typeof(Storage) !== "undefined") {
      console.log(localStorage);

      var $input = $('#input'),
          $submit = $('#submit'),
          $list = $('#list'),
          val = $input.val();

      var noteApp = {

        addNote : function(val) {
          var item = val.wrap('<li />');
          item.appendTo($list);

          clearField();
        },

        clearField : function() {
          $input.val = '';
        },

        delNote : function(note) {

        }

      };

      $submit.on('click', function(){
        noteApp.addNote();
      });

    } else {

    }

if（类型（存储）！=“未定义”）{
log（本地存储）；
变量$input=$（“#input”），
$submit=$（“#submit”），
$list=$（“#list”），
val=$input.val（）；
var noteApp={
地址：功能（val）{
var item=val.wrap（“
”）；
项目.附件（$清单）；
clearField（）；
},
clearField:function（）{
$input.val=''；
},
delNote：功能（注）{
}
};
$submit.on（'click'，function（）{
noteApp.addNote（）；
});
}否则{
}

我正在努力学习专业人士如何使他们的代码变得如此干净、简洁和模块化。我想一个便条应用程序会是一个完美的开始，可惜我在第一关就被卡住了

---

干杯。

在调用

addNote（）

时，您没有为

val

传递任何参数，因此它将是

未定义的

：

noteApp.addNote();
//             ^^ nothing

传递输入（由于

val.wrap

调用，您似乎希望jQuery对象不是字符串值）：

---

在函数中声明

val

时，它的作用域是该函数，并且仅当函数调用传递该参数的值时才会填充。即使在更高范围内有另一个变量具有相同的名称

val

，它们仍然是有区别的。函数中对

val

的任何引用都将引用本地

val

而不是上层作用域。

在调用

addNote（）

时，您没有传递

val

的任何参数，因此它将是

未定义的
：

noteApp.addNote();
//             ^^ nothing

传递输入（由于
val.wrap
调用，您似乎希望jQuery对象不是字符串值）：

在函数中声明
val
时，它的作用域是该函数，并且仅当函数调用传递该参数的值时才会填充。即使在更高范围内有另一个变量具有相同的名称
val
，它们仍然是有区别的。函数中对
val
的任何引用都将引用本地
val
而不是上限范围。
问题中的代码有几个问题

定义名为
val
的参数，并且不将参数传递给函数
在对象文本内部调用
clearField（）
时，它是
this.clearField（）
您只能获取一次值，而不是每次单击
val
是一个字符串，它没有
wrap
方法
$input.val=''不是有效的jQuery

我会像这样把它清理干净

var noteApp = {
    init: function() {
        if (this.hasStorage) {
            this.elements().events();
        }
    },
    elements: function() {
        this.input  = $('#input');
        this.submit = $('#submit');
        this.list   = $('#list');
        return this;
    },
    events: function() {
        var self = this;

        this.submit.on('click', function(){
            self.addNote();
        });
    },
    hasStorage: (function() {
        return typeof(Storage) !== "undefined";
    })(),
    addNote: function() {
        this.list.append('<li>' + this.input.val() + '</li>');
        this.clearField();
        return this;
    },
    clearField: function() {
        this.input.val('');
    },
    delNote : function(note) {

    }
}

问题中的代码有几个问题

定义名为
val
的参数，并且不将参数传递给函数
在对象文本内部调用
clearField（）
时，它是
this.clearField（）
您只能获取一次值，而不是每次单击
val
是一个字符串，它没有
wrap
方法
$input.val=''不是有效的jQuery

我会像这样把它清理干净

var noteApp = {
    init: function() {
        if (this.hasStorage) {
            this.elements().events();
        }
    },
    elements: function() {
        this.input  = $('#input');
        this.submit = $('#submit');
        this.list   = $('#list');
        return this;
    },
    events: function() {
        var self = this;

        this.submit.on('click', function(){
            self.addNote();
        });
    },
    hasStorage: (function() {
        return typeof(Storage) !== "undefined";
    })(),
    addNote: function() {
        this.list.append('<li>' + this.input.val() + '</li>');
        this.clearField();
        return this;
    },
    clearField: function() {
        this.input.val('');
    },
    delNote : function(note) {

    }
}

addNote:function（val）{…}
您的
addNote
函数需要一个参数，而您调用它时没有参数。您需要调用
noteApp.addNote（val）
调用
addNote（）
，即形式参数
val
随
未定义
一起提供。如果将
addNote
声明为
function（）
，系统将尝试解析外部作用域在其正文中出现的
val
。在您的例子中，它将访问全局变量
val
addNote:function（val）{…}
您的
addNote
函数需要一个参数，而您调用它时没有参数。您需要调用
noteApp.addNote（val）
调用
addNote（）
，即形式参数
val
随
未定义
一起提供。如果将
addNote
声明为
function（）
，系统将尝试解析外部作用域在其正文中出现的
val
。在你的例子中，它将访问全局变量
val
绝对精彩，这正是我想要的答案：）我喜欢你不仅回答并解决了问题，而且还为我提供了关于如何创建这种JS的完美建议。在编写JS时，我所读到的东西似乎都没有教过这种方法，所以我只能观察其他人的代码，并尝试找出他们为什么这么做。我还在学习基础知识，这是一个很大的帮助。非常感谢。读到这篇文章，我的脑海里浮现出几个问题。你知道有什么资源可以学习更多关于用这种方式编写js的知识吗？比如我不确定你是否使用了
这个
关键字，init函数是如何工作的，为什么hasStorage没有一个（）以及为什么它是一个自调用函数等等。我可以问一下，但是如果能从某个地方正确地学习，并且不占用你的时间，那就太好了：）再次干杯。绝对精彩，正是我想要的答案：）我喜欢你不仅回答和解决了这个问题，你还为我提供了关于如何着手创建这种JS的完美建议。在编写JS时，我所读到的东西似乎都没有教过这种方法，所以我只能观察其他人的代码，并尝试找出他们为什么这么做。我还在学习基础知识，这是一个很大的帮助。非常感谢。读懂它