Javascript：遍歷數組

Question

這真讓我抓狂！ 我對javascript非常陌生（可以閱讀但不能總是寫出來）我的問題有三點。
用戶需要輸入（提示）“高個拿鐵”。
我想對這個問題做一個數組，以存儲a。）咖啡串和b。）咖啡價格。
2.我想使用for循環輸出到目前為止訂購的咖啡總量。
3.我的輸出應為表格格式ex。

短單杯拿鐵的價格是R10
雙高咖啡的價格是R15

var coffee = [ ];
var price = [ ];

for (var i = 0; i < 2; i++) {

var coffee = prompt("What coffee do you want:", "");

// Size
if (coffee.indexOf('short') > -1) {
    var size = 7;
}
if (coffee.indexOf('tall') > -1) {
    var size = 9;
}
if (coffee.indexOf('grande') > -1) {
    var size = 11;
} 

// Shots
if (coffee.indexOf('single') > -1) {
    var shots = 1;
}
if (coffee.indexOf('double') > -1) {
    var shots = 2;
}
if (coffee.indexOf('triple') > -1) {
    var shots = 3;
}

// Is cappuccino?
if (coffee.indexOf('cappuccino') > -1) {
    var extra = 2;
} else {
    var extra = 0;
}

var price = (size + (3 * shots) + extra);    
console.log(coffee + "'s price is R" + price);  
}

我要實現的示例：

var coffee = [ ];
var price = [ ];

coffee.push("short single latte");
price.push(10);

coffee.push("double tall latte");
price.push(15);

var i;
for (i = 0; i < coffee.length ; i++)
{
    console.log(coffee[i] + "'s price is R" + price[i]);
}

Answer 1

我根據您要實現的目標（您的第二個代碼塊）來回答這個問題。

-1 （通常由有效輸出包括0的函數/方法返回）稱為“前哨值”，並且在javascript中，它使用~捕獲它們：所有非-1都會強制轉換為true。

作為代碼注釋的進一步說明：

 (window.Orders=function(){ // our constructor function this.clr(); // init by calling clr. }).prototype={ // set inherited methods clr: function(){ // clear this.coffee=[]; // empty array of unknown length this.price=[]; // empty array of unknown length } , add: function(){ // build orders list var inp, size, shots, extra; while((inp=prompt('What coffee do you want:')) !== null){ size=0; // Size if( ~inp.indexOf('short' ) ) size= 7; else if( ~inp.indexOf('tall' ) ) size= 9; else if( ~inp.indexOf('grande') ) size= 11; shots=0; // Shots if( ~inp.indexOf('single') ) shots= 1; else if( ~inp.indexOf('double') ) shots= 2; else if( ~inp.indexOf('triple') ) shots= 3; extra= ~inp.indexOf('cappuccino') ? 2 : 0; //cappuccino? if( size && shots ){ //abuse price to check input this.coffee.push(inp); this.price.push(size + 3 * shots + extra); } else alert('please enter valid order'); } } , get: function(EOL){ //output orders var i=0, L=this.coffee.length, r=new Array(L); for(; i<L; i++){ //using a for loop as you requested. r[i]=this.coffee[i] + "'s price is R" + this.price[i]; } return r.join(EOL || '<br>'); //return string using arg EOL or '<br>' } }; 

 <!-- HTML AND *EXAMPLE* usage --> <button onclick=" var orders=new Orders(); // Construct new var orders orders.add(); // Start filling it document.getElementById('out').innerHTML=orders.get(); //get output //orders.clr() //clears orders if you want to reuse it without spawning a new ">get orders (cancel/escape to quit)</button> <br> Output: <div id="out"></div> 

現在，..真正的挑戰是想辦法解析用戶輸入的字符串，確定什么是有效和完整的，什么不是（感謝您沒有要求該問題的解決方案）。 我檢查是否設置了size和shots 。

希望這對您的學習體驗有所幫助。

Answer 2

謝謝大家，我想我想出來了..大概知道很長的路要走...但是...

var coffeeName = new Array();
var priceSingle = new Array();

// Loop 2 times
for ( var i = 0; i < 2; i++){

// Prompt Coffee
coffee = prompt("What coffee do you want:", "");

// Size
if (coffee.indexOf('short') > -1) {
    var size = 7;
}
if (coffee.indexOf('tall') > -1) {
    var size = 9;
}
if (coffee.indexOf('grande') > -1) {
    var size = 11;
} 

// Shots
if (coffee.indexOf('single') > -1) {
    var shots = 1;
}
if (coffee.indexOf('double') > -1) {
    var shots = 2;
}
if (coffee.indexOf('triple') > -1) {
    var shots = 3;
}

// Is cappuccino?
if (coffee.indexOf('cappuccino') > -1) {
    var extra = 2;
} else {
    var extra = 0;
}

// Work out Price
var price = (size + (3 * shots) + extra);

// Push coffee to coffeeNameArray
coffeeName.push(coffee);

// Push price to priceSingleArray
priceSingle.push(price);

}

// Loop coffeeName length - Output List
for (var i = 0; i < coffeeName.length; i++)
{
    console.log(coffeeName[i]+"'s price is R"+priceSingle[i]);
}