JavaScript集合类:Array、Map、Set
2016-11-27 12:27
381 查看
在JavaScript中不像java有那么多的数据结构。在实际工作中,使用对象还是数组需要仔细考虑下。例如:如果实现 Map的功能,既可以使用关联数组,也可以使用对象,那么区别是什么呢?
需要注意的是,在JavaScript中,所有变量实际上都是某种类型的对象。记住这点,就不难理解一个数组其实就是一个Array() 类型的对象,那么就可以给它添加各种属性。而所谓的关联数组,其实就是给该数组对象增加了很多属性,这在访问时就可以看出区别。
Array():传统数组(下标访问);关联数组(其实是数组对象的属性).
既然对象就可以实现Map的功能,为啥要有map? 注意:JavaScript的对象的键必须是字符串。
Map:是一组键值对的结构,具有极快的查找速度。通过传入数组的数组来建立。通过调用 .set(key,value) 来添加新的元素。
Set:Set和Map类似,也是一组key的集合,但不存储value。由于key不能重复,所以,在Set中,没有重复的key。要创建一个Set,需要提供一个Array作为输入,或者直接创建一个空Set:
重复元素在Set中自动被过滤,add(key) 方法可以添加元素到Set中。
for … of循环和for … in循环有何区别?前者只取集合本身元素,而不是属性,后者当我们给数组人为天添加属性后,就会方位所有的key,原数组则返回数组下标。
直接使用iterable内置的forEach方法,它接收一个函数,每次迭代就自动回调该函数。
以Array为例:
那么对于之前提到的 for… in 出现的返回key 的问题用 for … of 或者 forEach 回调都可以解决。
部分内容截取自如下网址,对作者表示感谢.JavaScrip教程
需要注意的是,在JavaScript中,所有变量实际上都是某种类型的对象。记住这点,就不难理解一个数组其实就是一个Array() 类型的对象,那么就可以给它添加各种属性。而所谓的关联数组,其实就是给该数组对象增加了很多属性,这在访问时就可以看出区别。
一、基本概念
对象:对象的每个值都是对象的一个属性。创建对象可以用var obj = {}:var person = {age:18,name:"John"}; var person2 = Object() person2.age = 19 person2.name = "Tim"
Array():传统数组(下标访问);关联数组(其实是数组对象的属性).
var persons = Array(4) //创建只有四个元素的数组 var names1 = ['a','b','c']// var persons2 = Array() persons2["age"] = 18 persons2["name"] = "John"
既然对象就可以实现Map的功能,为啥要有map? 注意:JavaScript的对象的键必须是字符串。
Map:是一组键值对的结构,具有极快的查找速度。通过传入数组的数组来建立。通过调用 .set(key,value) 来添加新的元素。
var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]); m.get('Michael'); // 95 m.set('Adam', 67); // 添加新的key-value
Set:Set和Map类似,也是一组key的集合,但不存储value。由于key不能重复,所以,在Set中,没有重复的key。要创建一个Set,需要提供一个Array作为输入,或者直接创建一个空Set:
var s1 = new Set(); // 空Set var s2 = new Set([1, 2, 3]); // 含1, 2, 3
重复元素在Set中自动被过滤,add(key) 方法可以添加元素到Set中。
二、iterable类型遍历集合:Array、Map和Set都属于iterable类型
具有iterable类型的集合可以通过新的for … of 循环来遍历。var a = ['A', 'B', 'C']; var s = new Set(['A', 'B', 'C']); var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]); for (var x of a) { // 遍历Array alert(x); } for (var x of s) { // 遍历Set alert(x); } for (var x of m) { // 遍历Map alert(x[0] + '=' + x[1]); }
for … of循环和for … in循环有何区别?前者只取集合本身元素,而不是属性,后者当我们给数组人为天添加属性后,就会方位所有的key,原数组则返回数组下标。
var a = ['A', 'B', 'C']; a.name = 'Hello'; for (var x in a) { alert(x); // '0', '1', '2', 'name' } /* for ... in循环将把name包括在内,但Array的length属性却不包括在内。for ... of循环则完全修复了这些问题,它只循环集合本身的元素:*/ var a = ['A', 'B', 'C']; a.name = 'Hello'; for (var x of a) { alert(x); // 'A', 'B', 'C' }
直接使用iterable内置的forEach方法,它接收一个函数,每次迭代就自动回调该函数。
以Array为例:
var a = ['A', 'B', 'C']; a.forEach(function (element, index, array) { // element: 指向当前元素的值 // index: 指向当前索引 // array: 指向Array对象本身 alert(element); }); // 注意,forEach()方法是ES5.1标准引入的,你需要测试浏览器是否支持。Set与Array类似,但Set没有索引,因此回调函数的前两个参数都是元素本身: var s = new Set(['A', 'B', 'C']); s.forEach(function (element, sameElement, set) { alert(element); }); // Map的回调函数参数依次为value、key和map本身: var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]); m.forEach(function (value, key, map) { alert(value); });
那么对于之前提到的 for… in 出现的返回key 的问题用 for … of 或者 forEach 回调都可以解决。
var a = ['A', 'B', 'C']; a.name = 'Hello'; for (var x of a) { alert(x); // 'A', 'B', 'C' } a.forEach(function(v,i){ alert(v); // 'A', 'B', 'C' 与 for ... of 功效相同 })
部分内容截取自如下网址,对作者表示感谢.JavaScrip教程
相关文章推荐
- JavaScript从入门到放弃(1)-基本操作:String,Object,Array,map,set
- JavaScript 对象Array,Map,Set使用
- JavaScript中set,map,array,object用法比较
- JavaScript 对象Array,Map,Set使用
- Java基本概念:集合类 List/Set/Map... 的区别和联系
- Java基本概念:集合类 List/Set/Map... 的区别和联系
- java 集合类Array、List、Map区别和联系
- Hibernate常见的集合映射主要有Set,List,Array,Map,Bag
- 集合映射(set, list, array,bag, map)详解
- hadoop io Sequence, Map, Set, Array, BloomMap Files(译文)
- Java基本概念:集合类 List/Set/Map 的区别和联系
- hadoop io Sequence, Map, Set, Array, BloomMap Files(译文)
- Java基本概念:集合类 List/Set/Map... 的区别和联系
- java 集合类Array、List、Map区别和联系
- [转]NHibernate集合映射中的set, list, map, bag, array
- Java 集合类 map set list arraylist hashmap hashtable
- NHibernate集合映射中的set, list, map, bag, array
- java 集合类 map set list arraylist hashmap hashtable
- Java基本概念:集合类 List/Set/Map... 的区别和联系
- NHibernate集合映射中的set, list, map, bag, array