lodash fromPairs数组转换成对象

我们可以通过lodash的fromPairs方法把键值对数组转换成javascript的对象,当然你还可以把对象继续转换成json数据结构,_.toPairs方法正好相反。
注:json是一种数据结构不能完全称为js对象,最简单的例子就是js对象可以有function而json没有。

fromPairs

var result=_.fromPairs(pairs);
参数
pairs : 键值对数组参数。
返回值
result: 返回的新对象。

例子

//正确的例子
var result=_.fromPairs([['id', 1], ['name', 'www.itxst.com']]);
result 等于 { 'id': 1, 'name': 'www.itxst.com' }

//错误示范1,返回了一个空对象
var result=_.fromPairs([1,2,3]);
result 等于 {}

//错误示范2,返回了一个空对象
var result=_.fromPairs([['id',1],[['name','lili'],['age',18]]]);
result 等于 {"id":1,"name,lili":["age",18]}

在线试一试

完整代码

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>lodash fromPairs例子</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">
    <script src="https://www.itxst.com/package/lodash/lodash.min.js"></script>
    <script src="https://www.itxst.com/package/jquery-3.5.1/jquery.min.js"></script>
</head>
<body style="padding:10px;">
    <div class="btn" onclick="ck1()">正确例子</div> 
    <div class="btn" onclick="ck2()">错误示范1</div>
    <div class="btn" onclick="ck3()">错误示范2</div>
    <div id="result">点击按钮试一试</div>
    <script>
     function ck1() {
       var result=_.fromPairs([['id', 1], ['name', 'www.itxst.com']]);
       $("#result").html(JSON.stringify(result));
     }
     function ck2() {
       var result=_.fromPairs([1,2,3]);
       $("#result").html(JSON.stringify(result));
     }
     function ck3() {
        var result=_.fromPairs([['id',1],[['name','lili'],['age',18]]]);
        $("#result").html(JSON.stringify(result));
     }     
    </script>
    <style>
        .btn {
            border: solid 1px #ddd;
            background-color: #eee;
            border-radius: 5px;
            padding: 5px 12px;
            text-align: center;
            cursor: pointer;
            display: inline-block;
            margin-right: 8px;
        } 
           .btn:active {
                border: solid 1px #cac9c9;
                background-color: #cac9c9;
            }
    </style>
</body>
</html>