Detailed Explanation of JS Data Structure Array

definition

An array is a collection of data of the same type stored in a contiguous memory space .

contiguous memory space

The implementation of arrays in C, C++, Java and other languages ​​requires a fixed length of the array. In the definition of the array, we can also know that because the array is required to be stored continuously in space, the array must be of fixed length.

Because the memory does not know whether the array should continue to be stored or how much space to use. If the length is not fixed, the area behind the array in the memory will not be allocated.

same type of data

Because the length of the array is fixed, if it is not the same data type, it will store int at one time, and String at another time. Two data types with different lengths cannot be guaranteed to store several of them. This is against the fixed length rule, so they must be the same data type.

Special places for arrays in JS

However, as shown in the figure below, arrays in JS do not seem to follow the general definition of arrays. They can store different types of data, and can also change the length and add or delete elements at will.

reason

In fact, the source code of JS is encapsulated on the bottom layer. Here, the blogger will not analyze the source code in detail. For details, you can see this link: Explore the underlying implementation of "array" under the JS V8 engine

Here you only need to know that arrays in JS are different from arrays in the ordinary sense. Different types can be defined and the length can be changed at will. This is why there are so many API methods for arrays in JS. Next, I will introduce JS arrays in detail. API

Array common API (push prp shift unshift splice sort concat)

create array

        // 创建数组
            let arr = new Array(1,2,3)

            let arr2 = [3,4,5]

The next operations are performed on the arr created here

1, push (add an element at the end of the array)

            arr.push(4)   // 1,2,3,4

2, prp (pop an element at the end of the array)

            arr.prp()    // 返回值 4 原数组 1,2,3

3, shift (pop up an element in front of the array)

            arr.shift() // 返回值 1 原数组 2,3

4, unshift (add an element before the array)

            arr.unshift(1) // 1,2,3

5, splice (insert and delete at any position)

            arr.splice(0,2,5)  //从下标0开始删除两个元素并添加 5  //5,3

6, sort (sort array)

            let arr = [3,2,4,6,5];
            arr.sort((x,y) => x - y)  //正序排序 2,3,4,5,6
            arr.sort((x,y) => y - x)  //倒序排序 6,5,4,3,2
			
			//也可以对对象进行排序
			 let arr = [
                    {
    
    
                  name:'张三',
                  age:100
                },
                    {
    
    
                  name:'李四',
                  age:18
                },
                    {
    
    
                  name:'王五',
                  age:20
                }
            ]

            arr.sort((x,y)=>x.age-y.age) //对对象进行以age的正序排序

7, concat (merge array)

                let arr1 = [1,2,3]
                let arr2 = [4,5,6]

                arr1.concat(arr2) //1,2,3,4,5,6
                arr1.concat(arr2,7,8,9) //1,2,3,4,5,6,7,8,9

8, slice (segmentation starts from the number of subscripts)

        let arr = [11,12,13,11]

        console.log(arr.slice(1)); //12,13,11   只写一个就分割到最后
        console.log(arr.slice(0,3)); //11,12,13
        console.log(arr.slice(-2)); //13,11  如果是负数  就是从下标为倒几开始，分割几个

Array other API

Iteration methods (every, some, filter, map, forEach, reduce, entries)

1, every (return true if all arrays are satisfied, otherwise false)

                let arr = [11,12,13,14]
                console.log(arr.every(item => item > 10));  //true

2, some (return true if the array is satisfied, otherwise false)

                  console.log(arr.some(item => item > 13));   //true

3, filter (filter returns elements that meet the conditions)

                console.log(arr.filter(item => item > 12));  // 13,14

4, map (The map method is used for array transformations. It accepts another custom function as an argument and applies that function on each array item.)

                console.log(arr.map(item => item + 'ccy')); //数组中每个元素都执行方法体     
                11ccy，12ccy。。。

5, forEach (traversal)

         arr.forEach( item => {
    
      //11, 12 ,13, 14
            console.log(item);
        } )

        // 返回索引值的遍历
        arr.forEach( (item,index) => {
    
     //11 0 ， 12 1 ， 13 2 ， 14 3
            console.log(item,index);
        } )

6, reduce (accumulation, multiplication and other operations)

        console.log(arr.reduce( (item1,item2) => item1 + item2 ));  
        //50 过程 11 + 12 = 23 -> 23 + 13 = 36... item1是得出的那个数 item2为下一个数组的数

        console.log(arr.reduce( (item1,item2) => item1 * item2 ));  //24024

7, entries (iterator object)

        for(let i of arr.entries()){
    
       //[0, 11],[1, 12],[1, 12],[1, 12]
            console.log(i);
        }

        for(let i of arr.keys()){
    
       //0,1,2,3
            console.log(i);
        }
        
        for(let i of arr.values()){
    
       //11,12,13,14
            console.log(i);
        }

搜索（indexOf ,lastIndexOf , find , findIndex , findLast ,findLastIndex ,includes）

        // let arr = [11,12,13,14]

1, indexOf (the package does not contain a certain number from the beginning, and returns the first encountered index if it does not contain -1)

        console.log(arr.indexOf(15)); //-1
        console.log(arr.indexOf(11)); //0

2, lastIndexOf (from the end, the package does not contain a certain number, and returns the first encountered index if it does not contain -1)

        console.log(arr.indexOf(15)); //-1
        console.log(arr.indexOf(11)); //3

3, includes (package does not contain a certain number, contains return true, does not contain return false)

        console.log(arr.includes(15)); //false
        console.log(arr.includes(14)); //true

4, find (find and return the first number that matches the addition)

        console.log(arr.find(item => item > 11)); //12

5, findLast (find from the back to the front and return the first number that matches the addition)

        console.log(arr.findLast(item => item < 14)); //13

6, findIndex, findLastIndex (same as above but returns index)

        console.log(arr.findIndex(item => item > 11)); //1
        console.log(arr.findLastIndex(item => item < 14)); //2