建站
咨詢
售后
建站咨詢
新聞中心
近日，筆者在認真搬磚的過程中，突然遇到一個問題，請看大屏幕（代碼）：
創(chuàng)新互聯(lián)主要從事網站設計制作、做網站、網頁設計、企業(yè)做網站、公司建網站等業(yè)務。立足成都服務名山,十多年網站建設經驗,價格優(yōu)惠、服務專業(yè),歡迎來電咨詢建站服務:18980820575
data() {
return {
statusList: [
{
code: "1",
name: "已保存"
},
{
code: "2",
name: "已提交"
}
]
}
},
computed: {
statusShow() {
return function(type) {
this.statusList.forEach(el => {
if (el.code == type) {
return el.name;
}
});
return ""
};
}
},這段代碼的意義在于，將數(shù)組中對象的 code 值與傳入的 type 值進行對比，如果相等的話，即返回對應的 name 值，否則返回空。你猜猜當傳入的 type 值為 1 時，statusShow 應該顯示什么？按設想，statusShow 應該顯示為 已保存 ，然而實際情況返回的是 空 。是不是一臉問號？？？不急，在解決這個問題前，我們先來了解了解涉及到的知識。
javascript中 return 有什么用處
在 JavaScript 中，return 是一個關鍵字，用于從函數(shù)中返回一個值，并且停止函數(shù)的執(zhí)行。return 語句是函數(shù)中非常重要的一個組成部分，因為它允許函數(shù)將計算結果返回給函數(shù)調用者。 return 語句有以下用處：
1.返回一個值：return 語句允許函數(shù)返回一個值。函數(shù)可以對輸入值進行計算，并將結果作為輸出返回給函數(shù)調用者。例如：
function add(a, b) {
return a + b;
}
const sum = add(2, 3);
console.log(sum); // 輸出：5在上面的代碼中，add 函數(shù)接收兩個參數(shù) a 和 b，將它們相加并使用 return 語句返回結果。在 add 函數(shù)被調用時，返回的結果被存儲在 sum 變量中，并被打印出來。
2.終止函數(shù)執(zhí)行：return 語句還可以用于終止函數(shù)的執(zhí)行。當 return 語句被執(zhí)行時，函數(shù)將立即停止執(zhí)行，并返回指定的值（如果有）。這對于在函數(shù)執(zhí)行過程中遇到錯誤或特定條件時需要立即停止函數(shù)執(zhí)行的情況非常有用。例如：
function divide(a, b) {
if (b === 0) {
return "Division by zero is not allowed.";
}
return a / b;
}
const result1 = divide(10, 2);
console.log(result1); // 輸出：5
const result2 = divide(10, 0);
console.log(result2); // 輸出："Division by zero is not allowed."在上面的代碼中，divide 函數(shù)檢查除數(shù)是否為零。如果是，它將使用 return 語句返回錯誤消息。如果除數(shù)不為零，它將使用 return 語句返回計算結果。
3.返回 undefined：如果函數(shù)沒有指定 return 語句，或者 return 語句沒有指定返回值，則函數(shù)將返回 undefined。例如：
function greet(name) {
console.log(`Hello, ${name}!`);
}
const result = greet("John");
console.log(result); // 輸出：undefined在上面的代碼中，greet 函數(shù)將 Hello, John! 字符串打印到控制臺上，但未使用 return 語句返回任何值。因此，result 變量包含 undefined。
forEach 中使用 return
在 JavaScript 中，使用 forEach 方法遍歷數(shù)組時，如果在函數(shù)內部使用 return 語句，它只會跳出當前的循環(huán)，而不會跳出整個函數(shù)。 例如，下面的代碼演示了在 forEach 循環(huán)中使用 return 語句：
const numbers = [1, 2, 3, 4, 5];
numbers.forEach(num => {
if (num === 3) {
return;
}
console.log(num);
});
// 輸出：
// 1
// 2
// 4
// 5
在上面的代碼中，當 num 等于 3 時，使用 return 語句跳出了當前循環(huán)，所以數(shù)字 3 沒有被打印出來。但是，forEach 循環(huán)仍然會繼續(xù)執(zhí)行，直到遍歷完整個數(shù)組。
因此，如果我們想要跳出整個函數(shù)，可以使用 Array.prototype.some() 或 Array.prototype.every() 方法來代替 forEach，或使用異常捕捉 try{}catch{} 在需要結束循環(huán)處 throw new Error(“退出循環(huán)”) 這三個方法可以在滿足某個條件時提前跳出循環(huán)。
針對案例中，還可以使用一種方法，即不跳出循環(huán)，在循環(huán)未開始前定義一個變量，循環(huán)中給此變量賦值，最后 return 出此變量。
statusShow() {
return function(type) {
let ret = "";
this.statusList.forEach(el => {
if (el.code == type) {
ret = el.name;
}
});
return ret;
};
} 當前標題：Web前端Tips：使用forEach循環(huán)中的return語句會發(fā)生什么？
本文地址：http://m.fisionsoft.com.cn/article/ccdhdsg.html
