【js jQuery】map集合 循环迭代取值---以及 map、json对象、list、array循环迭代的方法和区别

简介: 后台给前台传来一个map   @ResponseBody @RequestMapping(value = "getSys") public Map getSys(){ Map map = orderService.

后台给前台传来一个map

   @ResponseBody
    @RequestMapping(value = "getSys")
    public Map<Long,String> getSys(){
        Map<Long,String> map = orderService.getSysDate();
        return map;
    }

 

前台js中怎么迭代呢?【注意each的使用】这只是一种方法,如果想看更多的方法和各个方法的区别,请往下看分割2.

$.post("getSys.jhtml", function(data){
           
           var temp = "";
           $.each(data,function(i,d){
               temp += '<option value="'+i+'"  >'+d+'</option>';
           });
           
           console.log(temp);
           debugger;
           
           $("#lab").append(temp);
           
     });

结果如下:

 

 ================================================================分割1:js小知识==========================================================

 【小知识点】:

①debugger;     页面刷新会停留在代码的debugger;行。类似于js中打断点

②console.log(temp);  打印在控制台

 

 

 

 ========================================================分割2:下面对比each两种写法的区别========================================================================

【注意一点】:

each的写法有两种,有一种可以map迭代、json对象迭代、数组迭代、list迭代。

         有一种,不能迭代map、json对象,只能迭代数组和list。

 

数组和list都靠下标取值,且js中并无list或map的概念。

所以,数组和list等同,在这里示例中。

    map和json对象等同,在这里示例中。【唯一区别在于下面示例中map的key并没有引号,而json对象的key一定要被引号引起来】

 

[$().each 迭代数组]

 

 [$().each 迭代map]

 

[$.each() 迭代map]

[$.each()  迭代数组]

 

 [for 循环数组]

 [for循环map]

 

 

=============================================================分割3:map和json转化===========================================================

 

而将map转化为标准json字符串,再转化为JSON对象就是可以的。

 

相关文章
|
3天前
|
存储 JavaScript 前端开发
JavaScript对象方法详解
JavaScript对象方法详解
13 1
|
4天前
|
JavaScript
js多维数组去重并使具有相同属性的对象数量相加
js多维数组去重并使具有相同属性的对象数量相加
9 1
|
11天前
|
前端开发 JavaScript 数据安全/隐私保护
前端javascript的DOM对象操作技巧,全场景解析(二)
前端javascript的DOM对象操作技巧,全场景解析(二)
|
11天前
|
移动开发 缓存 JavaScript
前端javascript的DOM对象操作技巧,全场景解析(一)
前端javascript的DOM对象操作技巧,全场景解析(一)
|
11天前
|
缓存 编解码 自然语言处理
前端javascript的BOM对象知识精讲
前端javascript的BOM对象知识精讲
|
11天前
|
JavaScript 前端开发
JavaScript 日期对象
JavaScript 日期对象
|
11天前
|
存储 JavaScript 前端开发
JavaScript对象
JavaScript对象
|
11天前
|
JavaScript 前端开发
JavaScript的math对象
JavaScript的math对象
|
11天前
|
JavaScript 前端开发
JavaScript DOM 文档对象模型(获取、改变html元素)
JavaScript DOM 文档对象模型(获取、改变html元素)
|
11天前
|
JavaScript 前端开发
【专栏】Javascript 对象的深浅拷贝的区别以及如何实现它们
【4月更文挑战第29天】JavaScript中的对象拷贝分为浅拷贝和深拷贝。浅拷贝仅复制对象引用,修改拷贝会影响原始对象,如使用直接赋值、`Object.assign()`、扩展运算符和`Array.prototype.concat()`。深拷贝则创建独立副本,修改不影响原始对象,可通过递归、`JSON.stringify()`和`JSON.parse()`、Lodash的`cloneDeep()`或jQuery的`jQuery.extend()`实现。