📜 ⬆️ ⬇️

jsFind. Fetching data from an array of objects

Task: Language javascript. There is a large array of objects. You need to select from the array some objects, depending on the values ​​of the properties of these objects.

Attention! All of the following is possible a wild button accordion and most likely a dumb bike. The code given to experienced programmers cuts off fingers, and inexperienced tears to shreds.

As an introduction: the main code was written more than two years ago. At first it was used as a temporary one and later I wanted to replace it with processing on the backend. Time passed, the code acquired, mutated and began to "infect" other projects with itself. And to my surprise, he got accustomed everywhere, replacing the client-server bundle in cases where there was not much data, for example, product catalogs in which the number of items is not more than 1000pcs.

For the demonstration I have prepared such a simple massiformer (I’m going to talk to car enthusiasts):
')
var cars=[ { brand: 'audi', //  model: 'a4', // volume_engine: '1.8', //  hp: '120', //-   awd: '', //  [/] automat: '', // [/] }, { brand: 'audi', //  model: 'a4 allroad', // volume_engine: '2', //  hp: '211', //-   awd: '', //  [/] automat: '', // [/] }, { brand: 'audi', //  model: 'a6', // volume_engine: '2', //  hp: '180', //-   awd: '', //  [/] automat: '', // [/] }, { brand: 'bmw', //  model: '3 Series', // volume_engine: '1.6', //  hp: '135', //-   awd: '', //  [/] automat: '', // [/] }, { brand: 'bmw', //  model: '5 Series', // volume_engine: '3', //  hp: '258', //-   awd: '', //  [/] automat: '', // [/] }, { brand: 'volkswagen', //  model: 'passat', // volume_engine: '1.8', //  hp: '152', //-   awd: '', //  [/] automat: '', // [/] }, ] 


Let's start right away with examples. Do not pay attention to "more ..." - remains from console.log (). To begin, select from the array all cars of the brand audi ( try ):

 cars.find({ brand:"audi"}) //: [ { brand="audi", model="a4", volume_engine="1.8", ...}, { brand="audi", model="a4 allroad", volume_engine="2", ...}, { brand="audi", model="a6", volume_engine="2", ...} ] 


Choose all models a4 brand audi ( try ):

 cars.find({ brand: "audi", model: "%a4%" }) //: [ { brand="audi", model="a4", volume_engine="1.8", ...}, { brand="audi", model="a4 allroad", volume_engine="2", ...} ] 


Choose all models of a4 brand audi with all-wheel drive ( try ):

 cars.find({ brand: "audi", model: "%a4%", awd:"" }) //: [ { brand="audi", model="a4 allroad", volume_engine="2", ...} ] 


- the same, but the sample goes in turn ( try ):

 cars.find({ brand: "audi" }).find({ model: "%a4%" }).find({ awd: "" }) //: [ { brand="audi", model="a4 allroad", volume_engine="2", ...} ] 


And now we will find all cars with an engine power of more than 200 horses ( try ):

 cars.find({ hp: ">=200" }) //: [ { brand="audi", model="a4 allroad", volume_engine="2", ...}, { brand="bmw", model="5 Series", volume_engine="3", ...} ] 


Choose two and three-liter cars ( try ):

 cars.find({ volume_engine: ["2","3"] }) //: [ { brand="audi", model="a4 allroad", volume_engine="2", ...}, { brand="audi", model="a6", volume_engine="2", ...}, { brand="bmw", model="5 Series", volume_engine="3", ...} ] 


Choose two and three-liter car company audi ( try ):

 cars.find({ brand:"audi", volume_engine:["2","3"] }) //: [ { brand="audi", model="a4 allroad", volume_engine="2", ...}, { brand="audi", model="a6", volume_engine="2", ...} ] 


Choose all the cars whose engine size is strictly less than 2 liters and more or equal to 3 ( try ):

 cars.find({volume_engine:["<2",">=3"] }) //: [ { brand="audi", model="a4", volume_engine="1.8", ...}, { brand="bmw", model="3 Series", volume_engine="1.6", ...}, { brand="bmw", model="5 Series", volume_engine="3", ...}, { brand="volkswagen", model="passat", volume_engine="1.8", ...} ] 


I think the essence is clear. The find method from the source array selects objects that satisfy the conditions that are passed to the method as parameters. The output is a regular array of objects, and again you can select data from it: cars.find ({...}). Find ({...}). Find ({...}). Find ((... });

Github
jsfiddle

ps # 0 I know about the find method in MongoDB, that’s how it all started. I will try in the future to make very, very similar to him.
ps # 1 in the next version I will add the ability to extend the find method using my own filtering methods.
ps # 2 in the next article will talk about the jquery plugin based on find.js, which takes an array of objects and forms from it a filter with a list of products and pagination, and the bootstrap markup.
ps # 3 screening conditions - have not yet figured out how to elegantly solve this.

Source: https://habr.com/ru/post/163535/


All Articles