iterace pomocí objektů JavaScript – 5 technik a výkonnostních testů.
…ve smyčce
pro…loop příkaz lze použít k iteraci přes všechny non-Symbol, vyčíslitelné vlastnosti objektu.
objekt.klíče
metoda Object.keys()
vrací pole objektových klíčů. Tím se vytvoří pole, které obsahuje vlastnosti objektu. Poté můžete procházet polem a získat potřebné klíče a hodnoty.
objekt.hodnoty
metoda Object.values()
vrací pole hodnot objektů. Tím se vytvoří pole, které obsahuje vlastnosti objektu. Poté můžete procházet polem a získat potřebné hodnoty.
objekt.getOwnPropertyNames
Object.getOwnPropertyNames()
metoda vrací pole všech vlastností (včetně non-vyčíslitelné vlastnosti s výjimkou těch, které používají Symbol) nalézt přímo v daném objektu. Tím se vytvoří pole, které obsahuje vlastnosti objektu. Poté můžete procházet polem a získat potřebné klíče a hodnoty.
objekt.položky
Object.entries()
metoda vrací pole daného objektu je vlastní enumerable majetku párů.
Srovnání Výkonnosti
Teď pojďme vyzkoušet všechny tyto techniky a porovnat je na základě jejich rychlosti a výkonu k určení, což je rychlejší.
většina prohlížečů jako Chrome a Firefox implementuje časování s vysokým rozlišením v performance.now()
. Metodaperformance.now()
vrací DOMHighResTimeStamp
, měřeno v milisekundách.
Použití
let start = performance.now();// code to be timed...let duration = performance.now() - start;
Pojďme začít testovat…
Výsledky
Podle našich testů, zde jsou výsledky ve vzestupném pořadí;
╔═══════════╦════════════════════════════╦═════════════════════════╗
║ Rank ║ Technique ║ Time(ms) ║
╠═══════════╬════════════════════════════╬═════════════════════════╣
║ 1 ║ for...in loop ║ 0.8450000023003668 ms ║
║ 2 ║ Object.keys ║ 1.32499999017 ms ║
║ 3 ║ Object.entries ║ 1.63499999326 ms ║
║ 4 ║ Object.values ║ 2.05499998992 ms ║
║ 5 ║ Object.getOwnPropertyNames ║ 2.12500002817 ms ║
╚═══════════╩════════════════════════════╩═════════════════════════╝
Tak, podle těchto výsledků, nejrychlejší způsob, jak iterovat přes JavaScript Objekty je pro…ve smyčce. Nyní to neznamená, že ostatní metody jsou neplatné nebo zbytečné, vše záleží na případech použití.
problém s for...in
smyčka je, že to iteruje vlastnosti v řetězci Prototypu. Iteruje přes Vlastnosti objektu. Javascript pole jsou jen konkrétní druh objektu, s některé užitečné vlastnosti, které pomáhají léčit je jako pole, ale stále mají vnitřní vlastnosti objektu a nemyslíš iterovat přes tyto. for...in
také iteruje přes všechny vyčíslené vlastnosti a ne jen prvky pole. To může také vést k neočekávaným výsledkům.
Když procházíte objektem se smyčkou for...in
, musíte zkontrolovat, zda vlastnost patří k objektu. Můžete to udělat pomocí hasOwnProperty
.
lepší a účinnější způsob, jak procházet objekty v ES6 je nejprve převést objekt do pole pomocí Object.keys()
Object.values()
Object.getOwnPropertyNames
nebo Object.entries()
. Poté procházíte polem, abyste získali klíče a hodnoty.
Leave a Reply