【原创】js遍历Obj和Array，JSON扁平化各种实现（理解js数据类型很重要）

遍历对象

1，使用Object.keys()遍历

返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含Symbol属性)

var obj = {'0':'a','1':'b','2':'c'};

Object.keys(obj).forEach(function(key){

     console.log(key,obj[key]);

});

 

2、使用for..in..遍历  

循环遍历对象自身的和继承的可枚举属性(不含Symbol属性).

var obj = {'0':'a','1':'b','2':'c'};

for(var i in obj) {

     console.log(i,":",obj[i]);

}

 

3、使用Object.getOwnPropertyNames(obj)遍历

返回一个数组,包含对象自身的所有属性(不含Symbol属性,但是包括不可枚举属性).

var obj = {'0':'a','1':'b','2':'c'};
Object.getOwnPropertyNames(obj).forEach(function(key){

    console.log(key,obj[key]);

});

 

4、使用Reflect.ownKeys(obj)遍历

返回一个数组,包含对象自身的所有属性,不管属性名是Symbol或字符串,也不管是否可枚举.

var obj = {'0':'a','1':'b','2':'c'};
Reflect.ownKeys(obj).forEach(function(key){

console.log(key,obj[key]);

});

 

遍历数组

1、使用forEach遍历

var arr=[1,2,3,4];

arr.forEach(function(val, index) {

console.log(val, index);
});

 

2、使用for..in..遍历

for (var i in arr){
console.log(i,":",arr[i]);
}

 

3、使用for-of遍历

还支持大多数类数组对象

DOM NodeList对象，

也支持String遍历它将字符串视为一系列的Unicode字符来进行遍历.

不支持遍历Obj

var arr=["张三","李四","王五","赵六"];

for (var value of arr){

    console.log(value);

}

 

JSON扁平化

show me the code：

var promise = [
    {
        "name":"极速售后",
        "status":1,
        "desc":"",
        "null":null,
        "arrMulFalse":[[[false,true,null]]],
        "arrMulNumber":[[[0,1]]],
        "arrMulString":[[["","hello"]]],
        "arrMulObj":[[[{},{
                "name":"全国包邮",
                "status":1,
                "desc":""
            }]]],//空obj不遍历
        "arrMulArr":[[[[],[1]]]],//空数组不遍历
    },
    {
        "name":"全国包邮",
        "status":1,
        "desc":"",
    },
    {
        "name":"七天无理由退换",
        "status":1,
        "desc":""
    }
];

方法一：空值无效

function expandJsonTool(data, k){
    var jmap = {}
    var expandJson = function (jstr, mapIndex) {
        if (jstr instanceof Array) {
            for (var i in jstr) {
                expandJson(jstr[i], `${mapIndex}[${i}]`);
            }
        } else if (jstr instanceof Object) {
            for (var i in jstr) {
                // 如果mapIndex为false,null,''时，则不加初始索引
                if (!mapIndex) {
                    var key = i;
                } else {
                    var key = `${mapIndex}.${i}`;
                }
                // Array 是 Object 的子集，先判断是否为 Array,如果是，则不走Object的判断
                if (jstr[i] instanceof Array) {
                    for (var j in jstr[i]) {
                        expandJson(jstr[i][j], `${key}[${j}]`);
                    }
                } else if ((jstr[i] instanceof Object)) {
                    expandJson(jstr[i], key);
                } else {
                    jmap[key] = jstr[i]
                }
            }
        }
    }
    expandJson(data, k);
    console.log('jmap', jmap);
    return jmap
}
expandJsonTool(promise);

 

方法二：完美解法

function typeJudge(item) {
    if(Object.prototype.toString.call(item) === '[object Array]'){
        return 'Array';
    }
    else if(Object.prototype.toString.call(item) === '[object Object]'){
        return 'Object';
    }
    else {
        return 'Basic';
    }
 
}
function objectFlat1(obj = {}) {
    let res = {};//外部变量共享
    function flat(item, preKey = '') {
        for(let key in item){
            if(typeJudge(item[key]) != 'Basic'){
                if(typeJudge(item) == 'Object'){
                    flat(item[key],preKey==''? `${key}`:`${preKey}.${key}`)
                }else {
                    flat(item[key],preKey==''? `${key}`:`${preKey}[${key}]`)
                }
            }
            else {
                if(preKey == ''){
                    res[`${key}`] = item[key];
                }else {
                    if(typeJudge(item) == 'Object'){
                        res[`${preKey}.${key}`] = item[key];
                    }else {
                        res[`${preKey}[${key}]`] = item[key];
                    }
                }
            }
        }
    }
    flat(obj)
    return res;
}

console.log(objectFlat1(promise));