接上一篇一天一个前端知识点(HTML、CSS篇)
三、JS基础
1.讲讲JS的数据类型？
最新的 ECMAScript 标准定义了 8种数据类型:
1、 7 种原始类型:
- Boolean
- Null
- Undefined
- Number
(一共18437736874454810627个值，包括NaN、+Infinity、-Infinity) - BigInt
(比Number数据类型支持的范围更大的整数值， )参考JS最新基本数据类型:BigInt - String
- Symbol
(表示独一无二的值)
2、Object
（Date、Function、Array等）
2.讲讲Map和Set？
Map
- 类似对象(Object)，也是键值对的集合。键的范围不限于字符串，各种类型的值都可以。
- 对同一键多次赋值，后面的值将覆盖前面的值。
- Map的键是跟内存地址绑定的，内存地址不同，就视为不同的键。
const m = new Map();
const o = {p: 'Hello World'};
// 将对象o当作m的一个键，然后又使用get方法读取这个键
// set方法返回的是当前的Map对象，因此可以采用链式写法。
// get方法读取key对应的键值，如果找不到key，返回undefined。
m.set(o, 'content')
m.get(o) // "content"
// size属性返回 Map 结构的成员总数。
m.size //1
// has方法返回一个布尔值，表示某个键是否在当前 Map 对象之中。
m.has(o) // true
// delete方法删除某个键，返回true。如果删除失败，返回false。
m.delete(o) // true
m.has(o) // false
// 这是两个不同的数组实例，内存地址是不一样的，因此get方法无法读取该键
m.set(['a'], 555);
m.get(['a']) // undefined
//clear方法清除所有成员，没有返回值。
m.clear()
-
Map.prototype.keys()：返回键名的遍历器。 -
Map.prototype.values()：返回键值的遍历器。 -
Map.prototype.entries()：返回所有成员的遍历器。 -
Map.prototype.forEach()：遍历 Map 的所有成员
map.forEach(function(value, key, map) {
console.log("Key: %s, Value: %s", key, value);
});
- 与其他数据结构互相转换：
1.Map 转为 数组:
const map = new Map([
[1, 'one'],
[2, 'two'],
[3, 'three'],
]);
[...map.keys()]
// [1, 2, 3]
[...map.values()]
// ['one', 'two', 'three']
[...map.entries()]
// [[1,'one'], [2, 'two'], [3, 'three']]
[...map]
// [[1,'one'], [2, 'two'], [3, 'three']]
2.数组 转为 Map：
// 将数组传入Map构造函数
const map = new Map([
[true, 7],
[{foo: 3}, ['abc']]
])
// Map {
// true => 7,
// Object {foo: 3} => ['abc']
// }
- Map 转为 对象:
// 如果所有 Map 的键都是字符串，它可以无损地转为对象。
// 如果有非字符串的键名，那么这个键名会被转成字符串，再作为对象的键名。
function strMapToObj(strMap) {
let obj = Object.create(null);
for (let [k,v] of strMap) {
obj[k] = v;
}
return obj;
}
const myMap = new Map()
.set('yes', true)
.set('no', false);
strMapToObj(myMap)
// { yes: true, no: false }
- 对象 转为 Map:
let obj = {"a":1, "b":2};
let map = new Map(Object.entries(obj));
- Map 转为 JSON:
(1) Map 转为 JSON 要区分两种情况。一种情况是，Map 的键名都是字符串，这时可以选择转为对象 JSON。
function strMapToJson(strMap) {
return JSON.stringify(strMapToObj(strMap));
}
let myMap = new Map().set('yes', true).set('no', false);
strMapToJson(myMap)
// '{"yes":true,"no":false}'
(2) 另一种情况是，Map 的键名有非字符串，这时可以选择转为数组 JSON。
function mapToArrayJson(map) {
return JSON.stringify([...map]);
}
let myMap = new Map().set(true, 7).set({foo: 3}, ['abc']);
mapToArrayJson(myMap)
// '[[true,7],[{"foo":3},["abc"]]]'
Set
- 类似数组，但是成员的值都是唯一的，没有重复的值。
- 向Set加入值的时候不会类型转换，类似于
===，区别是NaN，Set认为NaN等于自身。
let s = new Set();
s.add(1).add(2).add(2);
// 注意2被加入了两次
// size返回Set实例的成员总数
s.size // 2
// has返回一个布尔值，表示该值是否为Set的成员
s.has(1) // true
s.has(2) // true
s.has(3) // false
// delete删除某个值，返回一个布尔值，表示删除是否成功。
s.delete(2);
s.has(2) // false
// clear清除所有成员，没有返回值
s.clear()
- 去除数组重复成员
// Array.from方法可以将 Set 结构转为数组
function dedupe(array) {
return Array.from(new Set(array));
}
dedupe([1, 1, 2, 3]) // [1, 2, 3]
// ---------------------------------------
let arr = [3, 5, 2, 2, 5, 5];
let unique = [...new Set(arr)];
// [3, 5, 2]
参考阮一峰 ES6入门 - Set 和 Map 数据结构
3.JS原型链