JS里的居民们8-对象和数组转换

编码

学习通用的数据用不同的数据结构进行存储,以及相互的转换

对象转为数组:

var scoreObject = {
    "Tony": {
        "Math": 95,
        "English": 79,
        "Music": 68
    },
    "Simon": {
        "Math": 100,
        "English": 95,
        "Music": 98
    },
    "Annie": {
        "Math": 54,
        "English": 65,
        "Music": 88
    }
}

如上有一个用来存储学习成绩的对象,编写一个函数,将其转为如下的二维数组

var scoreArray = [
    ["Tony", 95, 79, 68],
    ……
];

数组转为对象:

var menuArr = [
    [1, "Area1", -1],
    [2, "Area2", -1],
    [3, "Area1-1", 1],
    [4, "Area1-2", 1],
    [5, "Area2-1", 2],
    [6, "Area2-2", 2],
    [7, "Area1-2-3", 4],
    [8, "Area2-2-1", 6],
];

如上有一个用来存储多级菜单数据的数组,编写一个函数,将其转为如下的对象

var menuObject = {
    "1": {
        name: "Area1",
        subMenu: {
            "3": {
                name: "Area1-1"
            },
            "4": {
                name: "Area1-2",
                subMenu: {
                    "7": {
                        name: "Area1-2-3"
                    }
                }
            }
        }
    }

    ……

}

 1 <!DOCTYPE html>
 2 <html>
 3
 4 <head>
 5     <meta charset="utf-8" />
 6     <title>JS里的居民们9-对象和数组转换</title>
 7 </head>
 8
 9 <body>
10     <script>
11         //对象转数组
12         var scoreObject = {
13             "Tony": {
14                 "Math": 95,
15                 "English": 79,
16                 "Music": 68
17             },
18             "Simon": {
19                 "Math": 100,
20                 "English": 95,
21                 "Music": 98
22             },
23             "Annie": {
24                 "Math": 54,
25                 "English": 65,
26                 "Music": 88
27             }
28         }
29         var arr1 = [];
30         for (var i in scoreObject) {
31             var arr2 = [];
32             arr2.push(i);
33             for (var j in scoreObject[i]) {
34                 arr2.push(scoreObject[i][j]);
35             }
36             arr1.push(arr2);
37         }
38         console.log(arr1);
39         //数组转对象
40         var menuArr = [
41             [1, "Area1", -1],
42             [2, "Area2", -1],
43             [3, "Area1-1", 1],
44             [4, "Area1-2", 1],
45             [5, "Area2-1", 2],
46             [6, "Area2-2", 2],
47             [7, "Area1-2-3", 4],
48             [8, "Area2-2-1", 6],
49         ];
50
51         var menuObject = {};
52         menuArr.forEach((current, index) => {
53             if (current[2] == -1) {
54                 menuObject[current[0]] = {
55                     "name": current[1],
56                     "subMenu": {}
57                 }
58             }
59             if (current[2] == 1) {
60                 menuObject["1"]["subMenu"][current[0]] = {
61                     "name": current[1],
62                     "subMenu": {}
63                 }
64             }
65             if (current[2] == 2) {
66                 menuObject["2"]["subMenu"][current[0]] = {
67                     "name": current[1],
68                     "subMenu": {}
69                 }
70             }
71             if (current[2] == 4) {
72                 menuObject["1"]["subMenu"]["4"]["subMenu"][current[0]] = {
73                     "name": current[1],
74                     "subMenu": {}
75                 }
76             }
77             if (current[2] == 6) {
78                 menuObject["2"][ "subMenu"]["6"]["subMenu"][current[0]] = {
79                     "name": current[1],
80                     "subMenu": {}
81                 }
82             }
83         })
84         console.log(menuObject);
85     </script>
86 </body>
87
88 </html>
 

原文地址:https://www.cnblogs.com/Joe-and-Joan/p/10079662.html

时间: 2024-08-02 14:29:59

JS里的居民们8-对象和数组转换的相关文章

JS里的居民们2-字符串

基于HTML,实现需求 按照HTML中按钮的描述以此实现功能 计算结果显示在 id 为 result 的 P 标签中 1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="utf-8" /> 6 <title>JS里的居民们2</title> 7 8 </head> 9 10 <body> 11 <div> 12 <l

js中如何返回一个存放对象的数组?

我这边需要返回后台数据的形式是这样的 {[ { "ItemId": "18", "SelectId": 2 }, { "ItemId": "19", "SelectId": 1 }, { "ItemId": "20", "SelectId": 1 }, { "ItemId": "21",

对象、数组转换字符串

对象转换成字符串需要使用toString()方法. 1 var a = function(){ 2 console.log(111); 3 }; 4 var b = a.toString(); 5 console.log(a); 函数式的function 6 console.log(b); 字符串function 7 console.log(typeof a); >>function 8 console.log(typeof b); >>string 数组转换字符串 1.0 1 v

ES6 JS里的对象

JS里的对象 对象的创建 { // 1.字面量方式 let obj = { name:"JackAfan", age:"20", hobby(){ console.log("喜欢篮球") } } } { // 2.构造函数 let obj = new Object(); obj.name = "张三"; obj.age = 20; obj.hobby = function(){ console.log("喜欢篮球&q

谈谈JS里的{ }大括号和[ ]中括号的用法

谈谈JS里的{ }大括号和[ ]中括号的用法,理解后就可以看懂JSON结构了. 一.{ } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或是函数. 如:var LangShen = {"Name":"Langshen","AGE":"28"}; 上面声明了一个名为"LangShen"的对象,多个属性或函数用,(逗号)隔开,因为是对象的属性, 所以访问时,应该用.(点)来层层访问:LangShe

JS学习笔记-OO疑问之对象创建

问一.引入工厂,解决重复代码 前面已经提到,JS中创建对象的方法,不难发现,基本的创建方法中,创建一个对象还算简单,如果创建多个类似的对象的话就会产生大量重复的代码. 解决:工厂模式方法(添加一个专门创建对象的方法,传入参数避免重复) function createObject(name,age){ var obj =new Object(); //创建对象 obj.name = name; obj.age = age; obj.run = function(){ return this.nam

JS里设定延时:js中SetInterval与setTimeout用法

js中SetInterval与setTimeout用法 JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操作. setTimeout("function",time) 设置一个超时对象 setInterval("function",time) 设置一个超时对象 SetInterval为自动重复,setTimeout不会重复. clearTimeout(对象) 清除已设置的se

js添加key为数字的对象,通过类似于通过访问数组的中括号形式访问对象属性

var obj={};obj[1] = "mm";obj[2]="nn";console.log(obj[1]); 同var obj={};obj["1"] = "mm";obj["2"]="nn";console.log(obj["1"]); 其实创建对象的时候还可以这么写 var obj={};obj["mm"] = "mm"

js获取html元素? js里&quot;==&quot;和&quot;===&quot;区别?

现在的我的cpu又添加一项进程,那就是javaScript. 一.js获取html元素常用的方法: js获取html元素常用的方法有: 1)var obj = document.getElementById("#id");非常常用是通过Id来获取页面元素的. 2) var obj = document.getElementsByTagName("element");这个是通过html页面标签来获取元素的.在一个页面中相同的标签会出现很多次,如何能定位到自己想要的呢?