js数据类型

发表于 2021-08-18 更新于 2022-01-15 分类于前端 Disqus：本文字数： 3.5k 阅读时长 ≈ 6 分钟

Map和Set

map

Key-键值对形式，类似哈希表

new Map() —— 创建 map。
map.set(key, value) —— 根据键存储值。
map.get(key) —— 根据键来返回值，如果 map 中不存在对应的 key，则返回 undefined。
map.has(key) —— 如果 key 存在则返回 true，否则返回 false。
map.delete(key) —— 删除指定键的值。
map.clear() —— 清空 map。
map.size —— 返回当前元素个数。

如果要在 map 里使用循环，可以使用以下三个方法：

map.keys() —— 遍历并返回所有的键（returns an iterable for keys），
map.values() —— 遍历并返回所有的值（returns an iterable for values），
map.entries() —— 遍历并返回所有的实体（returns an iterable for entries）[key, value]，for..of 在默认情况下使用的就是这个。

1 2	let map = new Map(Object.entries(obj));//从obj对象创建map let obj = Object.fromEntries(map.entries()); // 创建一个普通对象（plain object）(*)

Set

每个键只出现一次

它的主要方法如下：

new Set(iterable) —— 创建一个 set，如果提供了一个 iterable 对象（通常是数组），将会从数组里面复制值到 set 中。
set.add(value) —— 添加一个值，返回 set 本身
set.delete(value) —— 删除值，如果 value 在这个方法调用的时候存在则返回 true ，否则返回 false。
set.has(value) —— 如果 value 在 set 中，返回 true，否则返回 false。
set.clear() —— 清空 set。
set.size —— 返回元素个数。

Map 中用于迭代的方法在 Set 中也同样支持：

set.keys() —— 遍历并返回所有的值（returns an iterable object for values），
set.values() —— 与 set.keys() 作用相同，这是为了兼容 Map，
set.entries() —— 遍历并返回所有的实体（returns an iterable object for entries）[value, value]，它的存在也是为了兼容 Map。

另

obj = Array.from(iteratable)可以从一个可迭代对象返回一个数组

WeakMap and WeakSet（弱映射和弱集合）

WeakMap

不能用原始值作为键
假如用对象作为键，但是对象被设为null时map里的键会自动删除

使用案例：计数某人来的次数，当这个人退出时清空他的数据/清除缓存

WeakSet

不能添加原始值
不支持size和keys方法，不可迭代

Object.keys，values，entries

Object.keys(obj)—— 返回一个包含该对象所有的键的数组。
Object.values(obj) —— 返回一个包含该对象所有的值的数组。
Object.entries(obj) —— 返回一个包含该对象所有 [key, value] 键值对的数组。

区别：（为了灵活性）

let user = {
  name: "John",
  age: 30
};

Object.keys(user) = ["name", "age"]
Object.values(user) = ["John", 30]
Object.entries(user) = [ ["name","John"], ["age",30] ]

转换对象

对象没有map方法，使用需要先转换成数组再转回来

let prices = {
  banana: 1,
  orange: 2,
  meat: 4,
};

let doublePrices = Object.fromEntries(
  // 转换为数组，之后使用 map 方法，然后通过 fromEntries 再转回到对象
  Object.entries(prices).map(([key, value]) => [key, value * 2])
);

alert(doublePrices.meat); // 8

解构赋值

语法

let {prop : varName = default, ...rest} = object

这表示属性 prop 会被赋值给变量 varName，如果没有这个属性的话，就会使用默认值 default。

没有对应映射的对象属性会被复制到 rest 对象。

// 我们有一个存放了名字和姓氏的数组
let arr = ["Ilya", "Kantor"]

// 解构赋值
// sets firstName = arr[0]
// and surname = arr[1]
let [firstName, surname] = arr;

alert(firstName); // Ilya
alert(surname);  // Kantor

剩余的 ‘…’

let [name1, name2, ...rest] = ["Julius", "Caesar", "Consul", "of the Roman Republic"];

alert(name1); // Julius
alert(name2); // Caesar

// 请注意，`rest` 的类型是数组
alert(rest[0]); // Consul
alert(rest[1]); // of the Roman Republic
alert(rest.length); // 2

默认值

let [firstName, surname] = [];

alert(firstName); // undefined
alert(surname); // undefined

// 默认值
let [name = "Guest", surname = "Anonymous"] = ["Julius"];

alert(name);    // Julius（来自数组的值）
alert(surname); // Anonymous（默认值被使用了）

Date

new Date(year, month, date, hour, minute, second, millisecond)

getFullYear()

获取年份（4 位数）
getMonth()

获取月份，从 0 到 11。
getDate()

获取当月的具体日期，从 1 到 31，这个方法名称可能看起来有些令人疑惑。
getHours()，getMinutes()，getSeconds()，getMilliseconds()

获取相应的时间组件。
getDay()

获取一周中的第几天，从 0（星期日）到 6（星期六）。第一天始终是星期日，在某些国家可能不是这样的习惯，但是这不能被改变。

测量函数运行时间

1
2
3

let start = Date.now();//获得起始
for (let i = 0; i < 100000; i++) f(date1, date2);//运行多次函数f
return Date.now() - start;//返回差值

function bench(f) {
  let date1 = new Date(0);
  let date2 = new Date();

  let start = Date.now();
  for (let i = 0; i < 100000; i++) f(date1, date2);
  return Date.now() - start;
}

let time1 = 0;
let time2 = 0;

// 交替运行 bench(upperSlice) 和 bench(upperLoop) 各 10 次
for (let i = 0; i < 10; i++) {
  time1 += bench(diffSubtract);
  time2 += bench(diffGetTime);
}

alert( 'Total time for diffSubtract: ' + time1 );
alert( 'Total time for diffGetTime: ' + time2 );

JSON方法

JSON.stringify() 将对象转换为 JSON。
JSON.parse() 将 JSON 转换回对象。