コーディングブックを入手する - 理解変数

Question

私はプログラミングの世界に入っていて、早急に質問することで少し銃を飛ばしているかもしれませんが、読んでいる本から何かを理解できませんでした。要素パスワードボックスの変数を作成する必要があるのはなぜですか。変数に入力された値が保持されません。 〜申し訳ありません：

function checkPassword() { 
    var password = document.getElementById("passwordBox"); 
    var passwordGuessed = password.value; 

    if(passwordGuessed == "Ernest300") { 
     return true; 
    } 

    alert("I'm sorry, your login credentials were incorrect buddy!"); 
    return false; 
} 

Answer 1

document.getElementById("passwordBox") cは、入力に入力しただけの値よりも方法の詳細が含まれているHTML要素オブジェクトを返します。もしあなたが望むのであれば、var passwordGuessed = document.getElementById("passwordBox").value;のような1つの変数の代入だけで済ませることができますが、大部分は2行が読みやすく、要素オブジェクトから何かをチェックしたいかもしれません。値にアクセスする前に

Answer 2

必要がない限り、別のvarを作成する必要はありません。たとえば、次のように

function checkPassword() { 
    var password = document.getElementById("passwordBox").value; 
    if (password == "Ernest300") { 
     return true; 
    } 

    alert("I'm sorry, your login credentials were incorrect buddy!"); 
    return false; 
} 

またはさらに短い対

function checkPassword() { 
    var password = document.getElementById("passwordBox"); // gets the HTML object 
    var passwordGuessed = password.value; // gets the value of it 

    if(passwordGuessed == "Ernest300") { 
    return true; 
    } 
    alert("I'm sorry, your login credentials were incorrect buddy!"); 
    password .focus(); // reuse the var 
} 

- あなたが妥当性をテストしたい場合は、VARを使用することが常に賢明であるしかし：

function checkPassword() { 
    if(document.getElementById("passwordBox").value == "Ernest300") { 
     return true; 
    } 

    alert("I'm sorry, your login credentials were incorrect buddy!"); 
    return false; 
} 

Answer 3

変数はありませんパスワードボックスに入力された値を保持しませんが、パスワードボックスHTML要素自体への参照を保持します。要素のvalueプロパティにアクセスして、パスワードボックスに入力された値を取得できます。

ここの変数はコードを読みやすくしますが、実際にはにはが必要です。スニペット全体を次のように書き換えることができました：

function checkPassword() { 
    if(document.getElementById("passwordBox").value == "Ernest300") { 
     return true; 
    } 

    alert("I'm sorry, your login credentials were incorrect buddy!"); 
    return false; 
}