JavaScript 集合基本操作
参考 MDN
集合
Array
1. 2种创建数组的方式
var fruits = [] ;
var friuits = new Array();
2. 遍历
fruits.forEach(function (item, index, array){
console.log(item, index);
});
// Apple 0
// Banana 1
for(var i in friuits){
console.log(friuits[i]);
}
for(var i=0;i<friuits.length;i++){
console.log(friuits[i]);
}
for(var value of friuits){
console.log(value);
}
3. 基本操作
| 操作 | 代码 | 说明 |
|---|---|---|
| 添加元素到数组的末尾 | fruits.push('Orange') | 返回数组长度 |
| 添加元素到数组的头部 | fruits.unshift('Strawberry') | 返回数组长度 |
| 删除头部元素 | fruits.shift(); | 返回头部元素 |
| 删除尾部元素 | fruits.pop(); | 返回尾部元素 |
| 找出某个元素在数组中的索引 | fruits.indexOf('Banana'); | 返回下标 |
| 通过索引删除某个元素 | fruits.splice(index, 1); | 返回被删除的元素 |
| 复制数组 | var shallowCopy = fruits.slice(0,length); | 返回指定范围内元素组成的新数组 |
| 生成数组 | Array.from() | 返回Array.from() 方法从一个类似数组或可迭代对象中创建一个新的数组实例。 |
4. 根据索引删除元素的例子
/* splice(start: number, deleteCount: number, ...items: T[]): T[]; */
var fruits = ["apple","b","c","d"] ;
console.log("array is : ");
fruits.forEach(function (item, index, array){
console.log(item, index);
});
var index = fruits.indexOf("b");
fruits.splice(index,1);
console.log("array is : ");
fruits.forEach(function (item, index, array){
console.log(item, index);
});
5. Array.from()使用例子
var fruits = ["apple","b","c","d"] ;
var f = Array.from(fruits);
f.forEach(function (item, index, array){
console.log(item, index);
});
//apple 0
//b 1
//c 2
//d 3
var f = Array.from("hello");
f.forEach(function (item, index, array){
console.log(item, index);
});
//h
//e
//l
//l
//o
Array.from()还可以用于Set,Map
Set
1. 源码定义
interface Set<T> {
add(value: T): this;
clear(): void;
delete(value: T): boolean;
forEach(callbackfn: (value: T, value2: T, set: Set<T>) => void, thisArg?: any): void;
has(value: T): boolean;
readonly size: number;
}
2. 基本操作说明
| 操作 | 代码 | 说明 |
|---|---|---|
| 创建 | new Set([iterable]); | 可以放入数组,Set, Map来初始化 |
| 添加元素 | set.add(5) | 返回Set本身 |
| 删除元素 | set.delete(5)) | 返回bool |
| 判断是否有 | set.has(5) | 返回bool |
| 长度 | set.size | 注意与数组长度区别,数组是length |
| 清空 | set.clear() | 返回void |
3. 遍历例子
let mySet = new Set([1,3,4,2,5]);
//遍历
for (let item of mySet) console.log(item);
for (let item of mySet.keys()) console.log(item);
for (let item of mySet.values()) console.log(item);
//三个遍历结果一样: 1 3 4 2 5
Map
1. 源码定义
interface Map<K, V> {
clear(): void;
delete(key: K): boolean;
forEach(callbackfn: (value: V, key: K, map: Map<K, V>) => void, thisArg?: any): void;
get(key: K): V | undefined;
has(key: K): boolean;
set(key: K, value: V): this;
readonly size: number;
}
2. 基本操作说明
| 操作 | 代码 | 说明 |
|---|---|---|
| 创建 | var myMap = new Map(); | |
| 添加 | myMap.set(1,"hello") | 返回map本身 |
| 获得 | myMap.get(1) | 返回对应的value |
| 判断是否存在键 | myMap.has(1) | 返回bool |
| 根据键删除 | myMap.delete(1) | 返回bool |
3. 遍历
for (var key of myMap.keys()) {
console.log(key);
}
for (var value of myMap.values()) {
console.log(value);
}
for (var [key, value] of myMap) {
console.log(key + " = " + value);
}
for (var [key, value] of myMap.entries()) {
console.log(key + " = " + value);
}
myMap.forEach(function(value, key) {
console.log(key + " = " + value);
}, myMap)
4. 特殊说明
任何一个NaN 都不等于 NaN, 但是NaN可以作为Map的键,而且是唯一的。
undefined等于undefined ; 所有变量初始值都为undefined
var myMap = new Map();
myMap.set(NaN, "not a number");
console.log(myMap.get(NaN));
// "not a number"
var otherNaN = Number("foo");
console.log(myMap.get(otherNaN));
// "not a number"
JavaScript 集合基本操作的更多相关文章
- javascript DOM基本操作
javascript DOM基本操作 1.DOM(Document Object Model 文档对象模型) 2.节点: 文档节点:document 元素节点:html.head.body.title ...
- javascript集合求交集
两集合求交集 思路: 1. 每一次从B数组中取一值,然后在A数组里逐个比较,如果有相等的,则保存.该算法复杂度为 O(MN). M, N 分别为数组 A B 的长度. 2. 因为A B 都排过序,所以 ...
- javascript集合的交,并,补,子集,长度,新增,删除,清空等操作
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat=&qu ...
- JavaScript 数组基本操作
简介 数组操作无论是在JavaScript中还是在其他语言中都是很常见.经常会用到的,现在我把JavaScript 数组基本操作整理一下,供大家参考学习.里边包含我自己的见解以及案例,希望能够帮助大家 ...
- 集合基本操作 Python DAY2
集合本身具有两个特性 1.去重 2.关系测试 列表转集合的两种写法: list_1=[1,2,3,4,1,2,7,8,] list_1=set(list_1) #方法二 list_2=set([1, ...
- JavaScript 集合对象
1. 集合对象 1.1 Object 关于Object类型的创建和底层存储原理我在另一篇文章有说明: JavaScript 对象属性底层原理 我们知道了大多数情况下Object底层都是Hash结构,我 ...
- set()集合基本操作
运用频次:☆☆ set是一个无序且不重复元素集,基本操作如下: 1. 创建set集合,会自动转换成set类型 2. add():添加元素 def add(self, *args, **kwargs): ...
- JavaScript的基本操作(一)
JavaScript中有大量的方法可供我们使用,详情可参考:http://jquery.cuishifeng.cn/这也同时导致我们不可能去记住每一个的用法,且开发者每天都在新添更多的方法,所以要想掌 ...
- 记录Javascript集合操作
function Set() { var items = {}; /** * 添加元素 * @param {[type]} value [description] */ this.add = func ...
随机推荐
- Java的字节流,字符流和缓冲流对比探究
目录 一.前言 二.字节操作和字符操作 三.两种方式的效率测试 3.1 测试代码 3.2 测试结果 3.3 结果分析 四.字节顺序endian 五.综合对比 六.总结 一.前言 所谓IO,也就是Inp ...
- eatwhatApp开发实战(八)
在App中增,删功能都有了,这次我们来做改的功能.在项目中点击items项时对对应的条目中的商店名称进行修改. 点击items跳出一个对话框,里面包含了输入框.修改按钮和取消按钮: AlertDial ...
- 前端 vue-cli+Webpack 项目开发环境配置、创建一个vue-demo
一.软件及命令: (1)下载node.js 最新的LTS 版本,下载 msi格式的(直接点击安装即可). (2)命令1:npm install cnpm -g 命令2:cnpm install web ...
- javascript -字符串常用方法
let str ="stRing" toUpperCase / toLowerCase 大小写 toUpperCase()把一个字符串全部变为大写; toLowerCas ...
- Beta冲刺 ——5.27
这个作业属于哪个课程 软件工程 这个作业要求在哪里 Beta冲刺 这个作业的目标 Beta冲刺 作业正文 正文 github链接 项目地址 其他参考文献 无 一.会议内容 1.组员一起学习Git分支管 ...
- SchedTune
本文仅是对kernel中的document进行翻译,便于理解.后续再添加代码分析. 1. 为何引入schedtune? schedutil是一个基于利用率驱动的cpu频率governor.它允许调度器 ...
- 转载:windows下安装mac虚拟机(Vmvare+mac)
体验Mac的高效与思想,每个技术人都应该去了解和体验,本文转载自网络,使用Vmvare,虚拟Mac系统 https://blog.csdn.net/qq_31867709/article/detail ...
- linux下使用tcpdump抓包分析tcp的三次握手
首先贴上tcp 三次握手的原理图服务器开启ftp服务并执行tcpdump抓包服务器:192.168.3.14 ftp服务客户端:192.168.3.100 服务器执行以下命令,客户端访问服务器ftp: ...
- python—异常处理
一:什么是异常? (异常就是程序运行时发生错误的信号) 错误分两种: 1.语法错误 2.逻辑错误 二:异常的种类? (在python中不同的异常可以用不同的类型(python中统一了类与类型,类型即类 ...
- web静态页面资源访问路径问题
我使用的是idea,今天搭建一个项目时遇见了css和js路径错误,导致浏览器获取不到资源路径 这是我最开始写的路径 <link href="/main/loginMain.css&qu ...