JS内のラージデータの配列よりオブジェクトを使用する
14342 ワード
ほとんどの場合、配列型でデータを使用しており、配列をフィルターするために多くの関数を使用しています.
あなたが
パフォーマンスを見ましょう
パフォーマンスに関しては、配列からデータを取得するには時間がかかるので、配列内のすべての項目をチェックする必要があります.
ここでは、低スペックラップトップを使用してパフォーマンステストです.
私の短い記事を読んでくれてありがとう、コーヒーを買いたいなら、イメージをクリックしてください.
あなたが
small amount of data
のために配列を使用するならば、そのわずかな量のデータからその罰金.しかし、多くのデータを使用する場合は、object
として保存するかもしれない.パフォーマンスを見ましょう
パフォーマンスに関しては、配列からデータを取得するには時間がかかるので、配列内のすべての項目をチェックする必要があります.
let array = [
{
id: 1,
name: "John",
age: 23
},
{
id: 2,
name: "Samuel",
age: 21
},
{
id: 3,
name: "marvin",
age: 26
},
{
id: 4,
name: "james",
age: 28
}
];
let getUser = array.filter((person) => person.id === 3)[0]
console.log(getUser)
// output: { id: 3, name: 'marvin', age: 26 }
オブジェクトの中で、プロパティ名をIDとして変更することができます(オブジェクトの名前を付けてプロパティを作成することができます)、これはデータを取得するときにさらに高速になります.// in this example the properties name I did, is a string "id_"+id
let objects = {
id_1: {
id: 1,
name: "John",
age: 23
},
id_2: {
id: 2,
name: "Samuel",
age: 21
},
id_3: {
id: 3,
name: "marvin",
age: 26
},
id_4: {
id: 4,
name: "james",
age: 28
}
};
console.log(objects.id_4); // or objects['id_4']
//{ id: 4, name: 'james', age: 28 }
オブジェクトを見るとき、プロパティ名を使用してデータを簡単に取得することができます.ここでは、低スペックラップトップを使用してパフォーマンステストです.
var a1 = [{id: 29938, name: 'name1'}, {id: 32994, name: 'name1'}];
var a2 = []; // this is the array
a2[29938] = {id: 29938, name: 'name1'};
a2[32994] = {id: 32994, name: 'name1'};
var o = {}; // this is the object
o['29938'] = {id: 29938, name: 'name1'};
o['32994'] = {id: 32994, name: 'name1'};
// lets generate 2000 data on each.
for (var f = 0; f < 2000; f++) { //lets add items to our array a2 and object variable called o,
var newNo = Math.floor(Math.random()*60000+10000);
if (!o[newNo.toString()]) o[newNo.toString()] = {id: newNo, name: 'test'};
if (!a2[newNo]) a2[newNo] = {id: newNo, name: 'test' };
a1.push({id: newNo, name: 'test'});
}
最初のテストは配列です.var id = 29938;
var result;
for (var i = 0; i < a1.length; i++) {
if(a1[i].id === id) {
result = a1[i];
break;
}
}
console.log(result);
// this took 1049 ms
2番目のテストは連想配列です.var id = 29938;
var result = a2[id];
console.log(result)
// this took 43ms!!!
3番目のテストはオブジェクトです.var id = '29938';
var result = o[id];
console.log(result)
// this took 51ms!!!
ご覧のように、我々は2000 +データを生成し、連想配列とオブジェクトの型はここで明確な勝者です.私の短い記事を読んでくれてありがとう、コーヒーを買いたいなら、イメージをクリックしてください.
Reference
この問題について(JS内のラージデータの配列よりオブジェクトを使用する), 我々は、より多くの情報をここで見つけました https://dev.to/brojenuel/js-tip-series-use-objects-than-arrays-for-large-data-187テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol