ES6 методи вътре картата на обект

Докато не започна, нека безсрамно питам за вашата подкрепа. Ако обичате да ми серия «ES6 отвътре." Вашият принос ще се използва за провеждане на сайтове за моята храна, фактът, че не съм запазил с графика, както и факта, че Pony Foo останал верен източник dzhavaskriptovyh vkusnyashek.

Благодаря за слушане, а сега да преминем към колекцията! Да си спомним за това, което правим, можете да погледнете статия за итератори - са тясно свързани с колекции в ES6 - и в статия за разширяването на оператора, както и останалите параметри.

Преди ES6 са асоциативни масиви

Този подход има няколко проблема, а именно:

  • проблеми със сигурността. когато това се дължи на вида на ключове потребителското __proto__. ToString или нещо по Object.prototype обект става непредсказуемо, което прави взаимодействието с такъв вид асоциативни масиви suschuyu тежък труд.
  • За да превъртите през списъка с Object.keys (регистър) .forEach или продажба "повтори" протокол регистър (регистър) изисква много код.
  • Ключове ограничени редици, което прави създаването на асоциативни масиви с ключове в DOM-елементи или други данни извън низ.

позоваване на ценностите на асоциативен масив изключително чрез методи на първия брой да се реши префикса и предпазливост. Още по-добре, да се използва прокси към ES6. но освен това за утре!

За наше щастие, Карта обекти ES6 много по-добре може да се справи с проблемите на ключове за сигурност именуване. В същото време, те автоматично да осигурява функционалността на колекциите, които също може да дойде по-удобно. Нека да видим как те работят и какво практическа полза от тях.

Карта обекти в ES6

Обект Карта - структурата на данните в продължение на двойки ключ / стойност в ES6. Благодарение на него ние се успешна структура на данните за асоциативни масиви. Преди това, нещо като карта в ES6 погледна.

Един от най-важните различия и че ключовете може да се използва за нищо. Вие не сте ограничени до примитивни ценности като герои, числа или низове, и дори можете да използвате функции, обекти и дати. Освен това, ключовете, няма да бъдат откарвани до редовете, с две обикновени предмети.

Можете да използвате и карта на обекти на всякакви предмети, които следват "итерирания" протокол и да се създаде такава колекция като [[ "ключ", "стойност"]. [ "Ключ", "стойност"]].

В този пример, всъщност се оказва, същите като на следващия. Забележете как използваме destruktirovanie в items.forEach параметри. без усилие да вземе ключа и стойността на двуизмерен елемент.

Разбира се, по-скоро глупаво да страдат, добавяйки елементи един по един, когато можете просто да "хранят" нашия обект Карта нищо повтори. Говорейки за iterable - Карта себе си се придържа към протокола, "повтори". Това е лесно да се получи събиране на двойки ключ-стойност, са много сходни с тези, които могат да "хранят" на дизайнера карта.

Разбира се, за тази цел, можете да използвате разширяването на оператора.

В допълнение, можете да използвате for..of цикъл и да комбинирате с destruktirovaniem. до максималната izbavatsya на допълнителни знаци. Между другото, за буквални шаблони не са забравили?

Дори въпреки факта, че там е софтуерен обект Карта API за да добавите елементи, ключове са уникални, какъвто е случаят с асоциативни масиви. лицензионен ключ том презапишете само стойността си.

обекти на картата в ES6 NaN се превръща в "изключителни случаи", която се третира като стойност, равна на себе си. въпреки че стойността на следния израз действително ще бъде вярно - NaN == NaN !.

Асоциативните масиви и DOM

В ES5, когато имахме DOM-елемент, който иска да се свърже с API обект и да е библиотека, ние трябваше да пиша много бавно код като показания по-долу. Следната функция в кода просто връща API на обекта с един куп начини за DOM-елементи, които позволяват да се постави и премахване на елементи от DOM-кеша, а също така се върне обекта за API на DOM-елементи - ако елементът е вече там.

Един от най-забавните аспекти на картата. Както вече бе споменато. възможно е да се уточни DOM-елементи като ключове. А фактът, че има възможност за събиране на манипулация Карта, голям всичко по-лесно.

Фактът, че тези техники сега се превърнаха в един ред, което означава, че не можем да ги накара да се разделят, защото кодът е и толкова лесно да се чете. Ние просто се и намаляване на код

30 stroknapolovinu. Да не говорим за факта, че в някакъв момент в бъдеще ще работи много по-бързо опция за търсене на желаната позиция в масива като игла в купа сено.

Защо имаме нужда от още карта?

Методи за събиране на картата

Карта обекти позволяват сравнително лесно да се изследва колекцията и да видим дали в ключа за Карта дефинирани. Както беше отбелязано по-рано, NaN е NaN. когато става дума за картата. Въпреки това, стойността на Symbol винаги различен, така че трябва да ги използват по значение.

Стига да се запази връзката към Symbol. всичко е в ред. Поддържайте връзки в близост, и Символ е по-близо?

И не забравяйте, че има един глас в ключовете. Внимание! Ние сме свикнали да донесе на обекта до редовете на ключове, които могат да бъдат уловени, ако не и да бъдете нащрек!

Също така можете изцяло почисти Карта обекта от записите, поддържане на връзка към него. Понякога е много полезен.

При използване на Карта обекта като iterable, всъщност повтаряме нейните .entries (). Следователно, по избор изрично обхождане .entries (). Това се прави за вас във всеки случай. Вие си спомняте Symbol.iterator. не е тя?

Заедно с .entries () в картата има две други итератор. Тя .keys () и .values ​​(). Най-вероятно вече сте се досетили, каква последователност от стойности, те дават, но тук е код, за всеки случай.

Също така, на картата обект е .size имот (само за четене), чието поведение е подобно на likeArray.prototype.length - благодарение на него по всяко време, можете да получите текущия брой на влизанията в картата.

Заслужава да се отбележи за друг аспект на картата. техните записи винаги се движат по отношение на добавянето на поръчката. За разлика от Object.keys цикли. което ги заобикаля в случаен ред.

for..in изявление повтаря повече от свойствата на обектите, изброени в произволен ред.

Също така, на картата обект има .forEach метод. който се държи по същия начин. като масиви обекти в ES5. Отново, ключът тук не се дава на редовете.

Събуди се рано утре, за да се наслаждавате на вкусно обекти WeakMap. Задайте и WeakSet. )

Послепис Може също така да се интересуват от:

По-малко от шест месеца след датата на последния промяната в W3C работен процес, тъй като ръководството на консорциума са получили предложение да се прилага този нов процес в крайна сметка по случая. И отписване е без значение HTML спецификация на музея, така че те не са объркани разработчиците ", който се представя за" значение.

Друг CSS модул, което ни казаха тихо падежът на статута, с които W3C съветва да започне рутинното използване на нови продукти. съдържа имот ви позволява да ограничите промяната на чертежа на дърво, прекрояване на CSS-кутии и да промените размера им в рамките на елемента. Ето защо е толкова важно ...
ОЩЕ

От Париж (на снимката), който наскоро премина CSS заседание на работната група, пристигнала забавни новини: Имоти решетка ред дефицит и решетка-колона-празнина, както и намаляването на решетка-празнина ...