Introduction
The data structure of “key value pair” is basically used before{}
There is a more suitable choice in the new specification.
LastJavaScript replacement 5: function nesting。
Es5 mode
Basic Usage
use{}
Store key value pairs. Only two types of keys are supported:String
andSymbol
。
const obj1 = {1:'1'};
const obj2 = {'name':'Tom'};
const mark = Symbol('age');
const obj3 = {[mark]:19};
console.log(obj1);
console.log(obj2);
console.log(obj3);
result
aboveobj1
Although the key name of is a number, it will be converted to a string.
operation
Add / modify
Add and modify usage.
or[]
How to do this:
const obj = {};
obj.name = 'Tom';
obj['name'] = 'Jim';
aboutSymbol
Key value of type, must use[]
It’s the best way.
read
Similar to adding.
or[]
How to do this:
const mark = Symbol('age');
const obj = {name:'Tom',};
obj[mark] = 19;
console.log(obj.name);
console.log(obj[mark]);
delete
Delete usedelete
Operator:
const mark = Symbol('age');
const obj = {name:'Tom',};
obj[mark] = 19;
delete obj.name;
delete obj[mark];
console.log(obj);
ergodic
The common traversal methods are as follows:for-in
,for-of
:
let obj = {name:'Tom',1:'1'};
const mark = Symbol('age');
obj[mark] = 19;
for (const ele of Object.keys(obj)) {
console.log(ele);
}
// 1
// name
The key of this data structure is unordered. In addition, if the key isSymbol
Type, cannot be traversed.
Es2015 + mode
In order to solve the problem of key types mentioned above, map data structure is provided in es2015 +. Map structure provides value value correspondence, which is more suitable for storing key value pairs.
Basic Usage
const m = new Map([
[1,'1'],
['name','Tom'],
[Symbol('age'),19],
[{other:'play'},'basketball'],
]);
console.log(m);
console.log(m.size);
result
Basic attributes of map data structuresize
Is the total number of members.
operation
Add / modify
set(key, value)
Method setting keykey
The corresponding value isvalue
, and returns the entire map structure, so it can be called chain. Ifkey
If it already exists, the key value will be updated.
const m = new Map();
m.set(1,'1').set('name','Tom');
const mark = Symbol('age');
m.set(mark,19);
const obj = {other:'play'};
m.set(obj,'basketball');
console.log(m);
read
get(key)
Method readkey
The corresponding value, if not foundkey
, backundefined
。
const m = new Map([
['name','Tom'],
]);
const mark = Symbol('age');
m.set(mark,19);
console.log(m.get('name'));
console.log(m.get(mark));
delete
delete(key)
Method delete keykey
If the deletion is successfultrue
Otherwise, returnfalse
。
const m = new Map([
['name','Tom'],
]);
const result = m.delete('name');
console.log(result) // true
console.log(m.delete('age')) // false
other
has(key)
: to determine whether there is a keykey
。clear()
: clear all members.
ergodic
The common traversal methods are as follows:forEach
,for-of
:
const m = new Map([
['name','Tom'],
[1,'1'],
[Symbol('age'),19],
[{other:'play'},'basketball'],
]);
for (const ele of m.keys()) {
console.log(ele);
}
// name
// 1
// Symbol(age)
// {other: "play"}
The key names are ordered,Symbol
Type can also be traversed to.
difference
dimension | Map | Object |
---|---|---|
Unexpected key | By default, there are no keys, only explicitly inserted keys. | The key name on the prototype chain may conflict with the set key name. |
Type of key | The key can be any value. | The key must be a string or symbol. |
Key order | Order | disorder |
Key statistics | Get it through the size attribute | To calculate manually |
iteration | Maps can be iterated directly. | In some way (e.g Object.keys (obj)) can be iterated only after processing. |
performance | It performs better in the scene of frequent addition and deletion of key value pairs. | In the scenario of frequent addition and deletion of key value pairs, no optimization is made. |