為什么forEach返回undefined但會登錄到控制台

Question

我正在嘗試遍歷數組並添加一些HTML標記。 我已經嘗試過.map ，但是由於它返回了另一個數組，因此我可以在HTML中看到逗號。 我嘗試了.forEach ，當我將其登錄到控制台時它可以工作，但是在HTML中.forEach定義。 我搜索了此問題的答案，發現了幾個答案，表明沒有返回到調用函數。 有些具有回調，並且正在從回調返回，但沒有返回到調用函數。 我找不到我不回去的地方。

我知道wrapTag會返回，因為我可以將它記錄到控制台，但似乎沒有傳遞給wrappedItems 。

我缺少回報嗎？或者是.forEach我執行不正確的東西嗎？

$(document).ready(function(){
let objR = {
    key1:"5",
    key2:"8",
    key3:"6",
    key4:"9",
    key5:
        {subKey1:"1",subKey2:"2",subKey3:"3",subKey4:"4"}
}

let arr = [];
let html = '';

const s = x => document.getElementById(x);
const isObject = val => (typeof val === "object") ? true : false;

const keyValueToArray = (obj) => {
    for(let key in obj) {
        let value = obj[key],
             n = [];

        if(!isObject(value)){
            n.push(key, value);
            arr.push(n);
        }
        else{
            arr.push(key);
            keyValueToArray(value);

        }
    }
    return arr;
}

const typeCheck = (x) => {
    console.log(typeof x);
    return x;
}

const wrapTag = (item, tag, i) => isObject(item) ? '<' + tag + '>' + item[0] + ' : ' + item[1] + '</' + tag  +'>' 
                            :'<' + tag +'>' + item + ':</' + tag +'>';

//const wrappedItems = keyValueToArray(objR).map(x => wrapTag(x, 'li'))

const wrappedItems = keyValueToArray(objR).forEach(function(x, i, z){
    var res = wrapTag(x, 'li');
    console.log(res);
    return res;
})

html = '<ul>';
html +=  wrappedItems;
html += '</ul>';
console.log(`html = ${html}`);


s('cards').innerHTML = html;

}）;

我通過將forEach封裝在一個匿名函數中並使用let聲明res來使其工作。 我必須將obj傳遞給wrappedItems函數，但這與我要實現的目標相差不遠。 這是修改后的功能。

    const wrappedItems = (obj) => {
        let res = '';
        keyValueToArray(objR).forEach(function(x, i, z){
        res += wrapTag(x, 'li');
        console.log(res);
        });
        return res;
        }

    html = '<ul>';
    html +=  wrappedItems(objR);
    html += '</ul>';

Answer 1

forEach()不返回任何內容，因此wrappedItems是未定義的。 （ docs ）。 您可以嘗試使用map()代替：

keyValueToArray(objR).map(function(x, i, z){}

或者在forEach()內推送到新數組

編輯：

映射值后，可以使用join()將它們設置為一個字符串而無需逗號，如下所示：

html +=  wrappedItems.join(" "); // or whatever you want to join with (maybe "\n")

這應該給您：

<ul><li>key1 : 5</li> <li>key2 : 8</li> ...