Skip to main content

Use of js array filter() method

 Arrays are frequently used in development, and processing data in arrays is one of the more common and important operations. Therefore, processing data in arrays during development is an important skill. Every developer Everyone should master the operations of arrays, especially for junior developers who have just entered the industry, so be sure to master the relevant skills. This article mainly shares some operations to filter the data in the array, about the use of the filter() method.

The filter() method will not detect empty arrays and will not change the contents of the original array. The first parameter of this method is a callback function, and the second parameter is the object to be used as the callback to be executed. It is passed to the function and used as the value of "this". If thisValue is omitted, the value of "this" is "undefined", that is, if thisValue is omitted in strict mode, "this" is undefined; if thisValue is omitted in non-strict mode, "this" is window; if it is not omitted , "this" is the incoming object.

The following are some practical demonstration cases: The first is the basic use of the method.

       let arr=[1,2,3,4,5,6,7,8];
        let obj={
            id:'1001',
            name:"aaa",
        }
        let a= arr.filter(function(value,index,array){
            /* "use strict"
            console.log(this)//undefined */
            console.log(this);
            console.log(value,index,array);
            return value>2;
        },obj);
        console.log(a,Object.prototype.toString.call(a),a.length);
        console.log(arr);

Array deduplication

 let arr=[1,2,1,2,4,5];
        let a=arr.filter((value,index,array)=>{
            // return index===arr.indexOf(value);
            return index===array.indexOf(value);
        });
        console.log(a);// [1, 2, 4, 5]

Use with other methods

let arr=[1,2,3,4,5,6];
        let fun=function(num){
            if(num%2===0){
                return true;
            }
        }
        let a=arr.filter(fun);
        console.log(a);

Remove null items from an array

 let arr=[1,2,"null",null,"aaa",null];
        let a=arr.filter((value)=>{
            return value;
        })
        console.log(a)// [1, 2, "null", "aaa"]
        console.log(a)

Comments

Popular posts from this blog

What is the difference between width property 100% and auto in css?

 width:auto: The default width value of block-level elements. When set to this value, the browser will automatically select an appropriate width value to adapt to the width of the parent element. When the width is set to 100%, the width of the child element box The value is equal to the parent's content, and as the parent's content automatically changes, after adding the padding and margin of the child element, its width remains unchanged, which is the difference from setting it to auto. But we most often use width:auto, because it is more flexible, width:100% is used less, because when adding padding or margin, this method is easy to make it exceed the parent box and destroy the original layout.

A simple understanding of ES6 iterators

 What is an iterator?An iterator is an interface that provides a unified access mechanism for various data structures. Any data structure can complete the traversal operation as long as the iterator interface is deployed.ES6 created a new traversal command for...of loop, which natively has a data structure with the iterator interface (which can be traversed with for...of). Contains Array, Arguments, Set, Map, String, TypedArray, NodeList. Of course, you can also implement this interface manually, which is convenient for practical use.