javaScript 基础知识汇总(八)

1、Map Set WeakMap 和WeakSet

  Map

  是一个键值对的集合,主要的方法包括:

  new Map() 创建Map

  map.set(key,value)  根据键(key)存储值(value).

  map.get(key)  根据键返回值,如果map中该值不存在,返回undefined

  map.has(key)   如果键值存在,返回true,否则返回false

  map.delete(key)  移除该键的值

  map.clear()      清空map

  map.size      返回当前元素个数

 1 let map = new Map();
 2
 3 map.set(‘1‘, ‘str1‘);   // 字符串作为 key
 4 map.set(1, ‘num1‘);     // 数字作为 key
 5 map.set(true, ‘bool1‘); // 布尔值作为 key
 6
 7 // 还记得普通对象 Object 吗?它将会把所有的键转化为字符串类型
 8 // 但是 Map 将会保留键的类型,所以下面这两个是不同的:
 9 alert( map.get(1)   ); // ‘num1‘
10 alert( map.get(‘1‘) ); // ‘str1‘
11
12 alert( map.size ); // 3

  将Object转化为Map

  通过一个方法Object,entries(obj),它可以返回一个对象的键值对数组,如下

1 let map = new Map(Object.entries({
2   name: "John",
3   age: 30
4 }));

  遍历Map

 1 let recipeMap = new Map([
 2   [‘cucumber‘, 500],
 3   [‘tomatoes‘, 350],
 4   [‘onion‘,    50]
 5 ]);
 6
 7 // 迭代键(vegetables)
 8 for (let vegetable of recipeMap.keys()) {
 9   alert(vegetable); // cucumber, tomatoes, onion
10 }
11
12 // 迭代值(amounts)
13 for (let amount of recipeMap.values()) {
14   alert(amount); // 500, 350, 50
15 }
16
17 // 迭代键值对 [key, value]
18 for (let entry of recipeMap) { // 和 recipeMap.entries() 一样
19   alert(entry); // cucumber,500(等等)
20 }recipeMap.forEach( (value, key, map) => {  alert(`${key}: ${value}`); // cucumber: 500 等等});

  Set

  Set 是一个值得集合,这个集合中的所有的值仅出现一次

  主要方法包括:

  new Set()  创建Set,利用数组创建是可选的(任何迭代对象都可以)

  set.add(value)  添加值,返回set本身

  set.delete(value)  删除值,如果该value在调用方法的时候存在则返回true,否则返回false。

  set.has(value)  如果set中存在该值则返回true,否则返回false。

  set.clear()    清空set

  set.size  元素的个数

  Set 迭代

  for ... of  或者 forEach

1 let set = new Set(["oranges", "apples", "bananas"]);
2
3 for (let value of set) alert(value);
4
5 // 和 forEach 相同:
6 set.forEach((value, valueAgain, set) => {
7   alert(value);
8 });

  WeakMap 和 WeakSet  

  WeakMap 仅有如下方法:

  • weakMap.get(key)
  • weakMap.set(key, value)
  • weakMap.delete(key, value)
  • weakMap.has(key)

  WeakSet同理

   这两者的键必须是对象

1 let weakMap = new WeakMap();
2
3 let obj = {};
4
5 weakMap.set(obj, "ok"); // 运行正常(对象作为键)
6
7 weakMap.set("test", "Whoops"); // 错误,因为“test”是原始类型

  2、Json 方法

   Json.stringify  将对象转换为json 完整语法:let json = JSON.stringify(value[, replacer, space])

  Json.parse 将Json 转换为对象 语法:let value = JSON.parse(str[, reviver]);

let student = {
  name: ‘John‘,
  age: 30,
  isAdmin: false,
  courses: [‘html‘, ‘css‘, ‘js‘],
  wife: null
};

let json = JSON.stringify(student);

alert(typeof json); // we‘ve got a string!

alert(json);
/* JSON-encoded object:
{
  "name": "John",
  "age": 30,
  "isAdmin": false,
  "courses": ["html", "css", "js"],
  "wife": null
}
*/
1 // a number in JSON is just a number
2 alert( JSON.stringify(1) ) // 1
3
4 // a string in JSON is still a string, but double-quoted
5 alert( JSON.stringify(‘test‘) ) // "test"
6
7 alert( JSON.stringify(true) ); // true
8
9 alert( JSON.stringify([1, 2, 3]) ); // [1,2,3]
1 // stringified array
2 let numbers = "[0, 1, 2, 3]";
3
4 numbers = JSON.parse(numbers);
5
6 alert( numbers[1] ); // 1
1 let user = ‘{ "name": "John", "age": 35, "isAdmin": false, "friends": [0,1,2,3] }‘;
2
3 user = JSON.parse(user);
4
5 alert( user.friends[1] ); // 1

原文地址:https://www.cnblogs.com/xiaoqiyaozou/p/11481821.html

时间: 2024-10-17 07:04:54

javaScript 基础知识汇总(八)的相关文章

JavaScript 基础知识汇总目录

一.标签.代码结构.现代模式.变量.数据类型.类型转换 GO 二.运算符.值的比较.交互.条件运算符.逻辑运算符 GO 三.循环 while 和 for .switch语句.函数.函数表达式和箭头函数 GO 四.对象(创建.属性的添加和删除.对象中括号的使用,属性计算,属性值简写,检查,for .. in 循环,引用复制,比较引用,常量对象,对象复制合并)GO 五.垃圾回收.Symbol类型.对象方法和this.构造函数和操作符 new GO 六.基本类型和对象的区别,作为对象的基本类型,数字类

javascript基础学习(八)

javascript之日期对象 学习要点: 日期对象 将日期对象转换为字符串 将日期对象中的日期和时间转换为字符串 日期对象中的日期 日期对象中的时间 设置日期对象中的日期 设置日期对象中的时间 与毫秒相关的方法 一.日期对象 在javascript中并没有日期型的数据类型,但是提供了一个日期对象可以操作日期和时间. 日期对象的创建: new Date(); 二.将日期对象转换为字符串 将日期对象转换为字符串可以使用以下4种方法: date.toString();//将日期对象转换为字符串时,采

Javascript基础知识5

不要把相等运算符(==)与赋值运算符(=)搞混. 以&&运算符隔开的两个条件中的前者为错,则不会检测第二个条件的真假.利用这一点,可以提高脚本的速度. 使用带switch的多个条件 if(button=="next") window.location = "next.html"; else if(button=="previous") window.location = "pre.html"; else if(

javascript 基础知识

javascript 基础知识编程规范注释 //驼峰对象化编程 数据类型字符串.数字.布尔.数组.对象.Null.Undefined定义 var carname=new String; var x= new Number; var y= new Boolean; var cars= new Array; var person= new Object; 字符串 var word = "Hello World!"; 数字 var x1 = 34.00; //使用小数点来写 var x2 =

JavaScript基础知识梳理--数组

JavaScript基础知识梳理--数组 1.创建方法 空数组:var obj=new Array(); 指定长度数组: var obj=new Array( size ); 指定元素数组 :  var obj=new Array( 元素1,元素2,....): 单位数组:var obj=new Array[ 元素1,元素2,元素3,...,元素N]; 多维数组:var a=new Array( [数组1],[数组2],[数组3],...,[数组N] ); 2.基本操作 存取数组元素: 单维数组

(1)JavaScript基础知识

Javascript基础知识 1.如何使用JavaScript (1).通过<script></script>中直接编写 (2).通过<script src='目标文档的URL'></script>链接外部的Js文件 ① <script  src="URL" type="text/javascript" charset="utf-8"></script> (3).作为某个元素

Javascript基础知识4

字符串大小写转换 toUpperCase()将所有的字符串转换成大写 toLowerCase()将所有的字符串转换成小写 substring(x,y)返回字符串的一部分,从x开始到y结束 charAt(x)获取第x个字符 indexOf("",x)查找字符串, 第一个内容是字符串,第二个是从第x开始 得到的值为这个字符串是从第几个字符开始的 同样lastindexOf()从最后开始查找 split("")分离字符串,内容为以什么分离, 得到的是一个数组 同理,将一个

Delphi基础知识汇总

☆Delphi基础数据类型 分类 范围 字节 备注 简单类型 序数 整数 Integer -2147483648 .. 2147483647 4 有符号32位 Cardinal 0 .. 4294967295 4 无符号32位 Shortint -128 .. 127 1 有符号8位 Smallint -32768 .. 32767 2 有符号16位 Longint -2147483648 .. 2147483647 4 有符号32位 Int64 -263 .. 263 8 有符号64位 Byt

JavaScript基础知识梳理----正则表达式

JavaScript基础知识梳理----正则表达式 1.创建 方式:---字面量:var 变量名=/表达式/模式修饰符 ---构造函数:var 变量名=new RegExp(“表达式”,“模式修饰符”) 说明: 表达式 单个字符和数字 . 匹配除换行符之外的任意字符 [a-z0-9] 匹配方括号中的任意字符 [^a-z0-9] 匹配不在方括号中的任意字符 \d 匹配数字 \D 匹配非数字 \w 匹配字母 \W 匹配非字母 空白字符 \0 匹配null字符 \b 匹配空格符 \f 匹配进纸符 \n