將變量傳遞給對象方法javascript

Question

試圖讓我了解Java語言中的對象，方法，閉包等。

我看不出為什么這不起作用，這是我認為的一些基本缺陷。 我期望將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 {

    }

我正在嘗試學習專業人士如何使他們的代碼如此簡潔，簡潔和模塊化。 我認為一個筆記應用程序將是一個完美的開始，可恥的是我陷入了第一個障礙...

干杯。

Answer 1

問題中的代碼有幾個問題

1. 定義一個名為val的參數並且不將參數傳遞給函數
2. 在對象字面量內調用clearField()時是this.clearField()
3. 您只獲得一次價值，而不是每次點擊
4. val是一個字符串，沒有wrap方法
5. $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) {

    }
}

小提琴

記住要調用init方法

$(function() { noteApp.init(); });

Answer 2

在對addNote()調用中，您沒有傳遞val任何參數，因此它將是undefined ：

noteApp.addNote();
//             ^^ nothing

傳遞輸入（由於val.wrap調用，您似乎希望jQuery對象不是字符串值）：

noteApp.addNote($input);

在函數中聲明val時，它的作用域僅限於該函數，並且僅當函數調用為該參數傳遞值時才會填充。 即使您在較高范圍中還有另一個名為val變量，它們仍然是有區別的。 函數中對val任何引用都將引用局部val而不是上限范圍。