The Map
object is a relatively new standard built-in object that holds [key, value]
pairs in the order that they're inserted.
Map
對象是一個相對較新的標準內置對象,按插入順序保存[key, value]
對。
The keys and values in the Map
object can be any value (both objects and primitive values are valid).
Map
對象中的鍵和值可以是任何值(對象和基本值均有效)。
句法 (Syntax)
new Map([iterable])
參量 (Parameters)
iterable An Array or other iterable object whose elements are key-value pairs.
iterable一個數組或其他可迭代對象,其元素為鍵值對。
例 (Example)
const myMap = new Map();
myMap.set('foo', 1);
myMap.set('bar', 2);
myMap.set('baz', 3);myMap.get('foo'); // returns 1
myMap.get('baz'); // returns 3
myMap.get('hihi'); // return undefinedmyMap.size; // 3console.log(myMap); // Map { 'foo' => 1, 'bar' => 2, 'baz' => 3 }
It's easy to create a new Map
from existing 2D arrays of key-value pairs:
根據現有的鍵值對的2D數組創建新的Map
很容易:
const myArr = [['foo', 1], ['bar', 2], ['baz', 3]];
const arrMap = new Map(myArr);console.log(arrMap); // Map { 'foo' => 1, 'bar' => 2, 'baz' => 3 }
You can also convert an object into a Map
with the help of the Object.entries
:
您還可以借助Object.entries
將對象轉換為Map
:
const myObj = {foo: 1,bar: 2,baz: 3
}
const objMap = new Map(Object.entries(myObj));console.log(objMap); // Map { 'foo' => 1, 'bar' => 2, 'baz' => 3 }
Map.prototype.get (Map.prototype.get)
Returns the value of the specified key from a Map
object.
從Map
對象返回指定鍵的值。
句法 (Syntax)
myMap.get(key);
參量 (Parameters)
key Required.
密鑰必填。
例 (Example)
const myMap = new Map();
myMap.set('foo',1);
myMap.set('bar',2);
myMap.set('baz',3);myMap.get('foo'); // returns 1
myMap.get('baz'); // returns 3
myMap.get('hihi'); // return undefined
Map.prototype.set (Map.prototype.set)
Sets or updates an element with the specified key and value in a Map
object. The set()
method also returns the Map
object.
使用Map
對象中的指定鍵和值設置或更新元素。 set()
方法還返回Map
對象。
句法 (Syntax)
myMap.set(key, value);
參量 (Parameters)
key Required
key必
value Required
需要的值
例 (Example)
const myMap = new Map();// sets new elements
myMap.set('foo', 1);
myMap.set('bar', 2);
myMap.set('baz', 3);// Updates an existing element
myMap.set('foo', 100);myMap.get('foo'); // returns 100
Because set()
returns the Map
object it operated on, the method can be easily chained. For example, the code above can be simplified to:
由于set()
返回對其進行操作的Map
對象,因此可以輕松地鏈接該方法。 例如,上面的代碼可以簡化為:
const myMap = new Map();// sets new elements
myMap.set('foo', 1).set('bar', 2).set('baz', 3).set('foo', 100); // Updates an existing elementmyMap.get('foo'); // returns 100
Map.prototype.size (Map.prototype.size)
Returns the number of elements in a Map
object.
返回Map
對象中的元素數。
句法 (Syntax)
myMap.size();
例 (Example)
const myMap = new Map();
myMap.set('foo',1);
myMap.set('bar',2);
myMap.set('baz',3);myMap.size(); // 3
Map.prototype.keys (Map.prototype.keys)
Returns a new Iterator
object that contains the keys for each element in the Map
object in insertion order.
返回一個新的Iterator
對象,該對象按插入順序包含Map
對象中每個元素的鍵。
句法 (Syntax)
myMap.keys()
例 (Example)
const myMap = new Map();
myMap.set('foo',1);
myMap.set('bar',2);
myMap.set('baz',3);const iterator = myMap.keys();console.log(iterator.next().value); // 'foo'
console.log(iterator.next().value); // 'bar'
console.log(iterator.next().value); // 'baz'
Map.prototype.values (Map.prototype.values)
Returns an iterator object that contains the values for each element in the Map
object in the order they were inserted.
返回一個迭代器對象,該迭代器對象按插入順序包含Map
對象中每個元素的值。
句法 (Syntax)
myMap.values()
例 (Example)
const myMap = new Map();
myMap.set('foo',1);
myMap.set('bar',2);
myMap.set('baz',3);const iterator = myMap.values();
console.log(iterator.next().value); // 1
console.log(iterator.next().value); // 2
console.log(iterator.next().value); // 3
Map.prototype.delete (Map.prototype.delete)
Removes the specified element from a Map
object. Returns whether the key was found and successfully deleted.
從Map
對象移除指定的元素。 返回是否找到并成功刪除密鑰。
句法 (Syntax)
myMap.delete(key);
參量 (Parameters)
key Required.
密鑰必填。
例 (Example)
const myMap = new Map();
myMap.set('foo',1);
myMap.set('bar',2);
myMap.set('baz',3);myMap.size(); // 3
myMap.has('foo'); // true;myMap.delete('foo'); // Returns true. Successfully removed.myMap.size(); // 2
myMap.has('foo'); // Returns false. The "foo" element is no longer present.
Map.prototype.entries (Map.prototype.entries)
Returns a new Iterator
object that contains the [key, value]
pairs for each element in the Map
object in insertion order.
返回一個新的Iterator
對象,該對象包含按插入順序的Map
對象中每個元素的[key, value]
對。
句法 (Syntax)
myMap.entries()
例 (Example)
const myMap = new Map();
myMap.set('foo',1);
myMap.set('bar',2);
myMap.set('baz',3);const iterator = myMap.entries();console.log(iterator.next().value); // ['foo', 1]
console.log(iterator.next().value); // ['bar', 2]
console.log(iterator.next().value); // ['baz', 3]
Map.prototype.clear (Map.prototype.clear)
Removes all elements from a Map
object and returns undefined
.
從Map
對象移除所有元素,并返回undefined
。
句法 (Syntax)
myMap.clear();
例 (Example)
const myMap = new Map();
myMap.set('foo',1);
myMap.set('bar',2);
myMap.set('baz',3);myMap.size(); // 3
myMap.has('foo'); // true;myMap.clear(); myMap.size(); // 0
myMap.has('foo'); // false
Map.prototype.has (Map.prototype.has)
Given a Map
with elements inside, the has()
function allows you to determine whether or not an element exists inside the Map, based on a key that you pass.
給定一個Map
內部包含元素, has()
函數允許您根據傳遞的鍵來確定Map中是否存在元素。
The has()
function returns a Boolean
primitive (either true
or false
), which indicates that the Map contains the element or not.
has()
函數返回一個Boolean
原語 ( true
或false
),它指示Map是否包含該元素。
You pass a key
parameter to the has()
function, which will be used to look for an element with that key inside the Map.
您將key
參數傳遞給has()
函數,該函數將用于在Map中查找具有該鍵的元素。
Example:
例:
// A simple Map
const campers = new Map();// add some elements to the map
// each element's key is 'camp' and a number
campers.set('camp1', 'Bernardo');
campers.set('camp2', 'Andrea');
campers.set('camp3', 'Miguel');// Now I want to know if there's an element
// with 'camp4' key:
campers.has('camp4');
// output is `false`
The campers
Map does not currently have an element with a 'camp4'
key. Therefore, the has('camp4')
function call will return false
.
campers
地圖當前沒有帶有'camp4'
鍵的元素。 因此, has('camp4')
函數調用將返回false
。
// If we add an element with the 'camp4' key to the map
campers.set('camp4', 'Ana');// and try looking for that key again
campers.has('camp4');
// output is `true`
Since the map now does have an element with a 'camp4'
key, the has('camp4')
function call will return true
this time!
由于地圖現在確實具有帶有'camp4'
鍵的元素,因此has('camp4')
函數調用這次將返回true
!
In a more real-world scenario, you might not manually add the elements to the Map yourself, so the has()
function would become really useful in those cases.
在更真實的場景中,您可能不會自己手動將元素添加到Map中,因此has()
函數在這些情況下將非常有用。
Map.prototype.forEach (Map.prototype.forEach)
Executes the passed function on each key-value pair in the Map
object. Returns undefined
.
在Map
對象中的每個鍵值對上執行傳遞的函數。 返回undefined
。
句法 (Syntax)
myMap.forEach(callback, thisArg)
參量 (Parameters)
callback Function to execute for each element.
callback為每個元素執行的功能。
thisArg Value to use as this when executing callback.
thisArg在執行回調時用作此值。
例 (Example)
const myMap = new Map();
myMap.set('foo',1);
myMap.set('bar',2);
myMap.set('baz',3);function valueLogger(value) {console.log(`${value}`);
}myMap.forEach(valueLogger);
// 1
// 2
// 3
翻譯自: https://www.freecodecamp.org/news/javascript-standard-objects-maps/