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...intaké 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