Jquery basic tutorial array using details

  • 2020-03-30 02:21:29
  • OfStack

1. $. Each (array, [callback]) traverses [commonly]

Explanation: unlike the $().each() method that instantiates jQuery objects, this method can be used to instantiate any object. The callback function takes two arguments: the first is the member of the object or the index of the array, and the second is the corresponding variable or content.

Each traversal, no stranger, is a variant of the for loop in normal event handling, but more powerful than the for loop. In the array, it can easily access the array index and the corresponding value. Ex. :


var _mozi=[' mohism ',' mozi ',' MoZhai ',' Love everyone not attack ',' It is with attaching ']; //The array used in this article is the same as & NBSP;
$.each(_mozi,function(key,val){  
    //The callback function takes two arguments, the first being the element index and the second being the current value & PI.
    alert('_mozi In the array  , The index  : '+key+'  The corresponding value is : '+val);  
});

As opposed to the native for.. In,each is stronger. The for... In can also iterate over groups and return the corresponding index, but the value needs to be obtained through arrName[key].

2. $. Grep (array, callback, [invert])

Explanation: use the filter function filter array elements. This function is to pass at least two parameters (the third parameter to true or false, to take the filter function return values, personal feel useless) : to filter array and filtering function. The filter function must return true to keep elements or false to remove elements. In addition, the filter function can also be set to a string note.


$.grep(_mozi,function(val,key){  
    //The filter function takes two arguments, the first being the current element and the second being the element index & PI.
    if(val==' mozi '){  
        alert(' An array of values for   mozi   The subscript is : '+key);  
    }  
});  

var _moziGt1=$.grep(_mozi,function(val,key){  
    return key>1;  
});  
alert('_mozi The index value in the array is greater than 1 Elements for : '+_moziGt1);  

var _moziLt1=$.grep(_mozi,function(val,key){  
    return key>1;  
},true);  
//Here a third reliable parameter is passed, and the return value in the filter function is inversely & PI;
alert('_mozi The index value in the array is less than or equal to 1 Elements for : '+_moziLt1);

3. $. Map (array,[callback])

Explanation: the transform function as an argument is called for each array element and passes an element representing the converted as an argument to the transform function. The transform function can return the converted value, null(delete items in the array), or an array containing the values, and expand to the original array.

This is a powerful method, but it is not commonly used. It can update the value of an array element based on a specific condition, or extend a new replica element based on its original value.


var _mapArrA=$.map(_mozi,function(val){  
    return val+'[ New added ]';  
});  
var _mapArrB=$.map(_mozi,function(val){  
    return val==' mozi ' ? '[ Just add mozi ]'+val : val;  
});  
var _mapArrC=$.map(_mozi,function(val){  
    //Extends a new element & NBSP; for the array element;
    return [val,(val+'[ extension ]')];  
});  
alert(' After each element '[ New added ]' The array after the character is : '+ _mapArrA);  
alert(' Only to elements   mozi   The array after adding the characters is : '+ _mapArrB);  
alert(' Is each element in the original array , Extends an add character '[ New added ]' The elements of the , The returned array is  '+_mapArrC);

$. InArray (val,array) determines whether the value exists in the array.

Explanation: determine the position of the first parameter in the array and count from 0 (-1 is returned if not found).

Remember the indexOf() method? IndexOf () returns the string for the first time in the position, and $. InArray () returns the position of the incoming parameters in the array, the same, if found, returns a value greater than or equal to zero, if not found then return 1. Now, know how to use it. With it, to determine whether a value is present in the array, becomes easy.


var _exist=$.inArray(' mozi ',_mozi);  
var _inexistence=$.inArray(' Who martingale ',_mozi)  
if(_exist>=0){  
    alert(' mozi   Exists in array _mozi In the , Its index value in the array is : '+_exist);  
}  
if(_inexistence<0){  
    alert(' Who martingale   It doesn't exist in an array _mozi In the !, The return value is : '+_inexistence+'!');  
}

5.$. Merge (first,second) into two arrays [general]

 

Explanation: the returned result modifies the contents of the first array -- the elements of the first array are followed by the elements of the second array. This method replaces the native concat() method with jQuery's, but is not as powerful as concat(), which can merge multiple arrays at once.


//Native concat() is probably a little more succinct than that & concat;
_moziNew=$.merge(_mozi,[' guiguzi ',' Shang Yang ',' Sun bin ',' PangJuan ',' Shu qin ',' Yi cheung '])  
alert(' The length of the new array after merging is : '+_moziNew.length+'.  The value of : '+_moziNew);

6.$.unique(array) filters duplicate elements in an array

 

Deletes duplicate elements from an array. Only deletes arrays of DOM elements, not strings or arrays of Numbers.

The first time I saw this, I thought it was a very convenient way to filter repetition, how perfect. But on closer inspection, you can only work with DOM elements, so it's 20% off. So, I've defined it as an infrequently used element, at least since I've been using jQuery.


var _h2Arr=$.makeArray(h2obj);  
//Repeat the array _h2Arr once & NBSP;
_h2Arr=$.merge(_h2Arr,_h2Arr);  
var _curLen=_h2Arr.length;  
_h2Arr=$.unique(_h2Arr);  
var _newLen=_h2Arr.length;  
alert(' An array of _h2Arr The original length is zero : '+_curLen+' , The filtered for : '+_newLen  
      +' . A total of filtering  '+(_curLen-_newLen)+' Individual repeating elements ')

7. $. MakeArray (obj) converts class array objects to arrays [not often]

Explanation: converts a class array object to an array object, which has a length property and whose member index is 0 through length-1.
This is a redundant method that the omnipotent $already includes. The jQuery web site is very vague, but it's all about converting an array of class objects (such as a collection of element objects retrieved with getElementsByTagName) into an array object.


var _makeArr=$.makeArray(h2obj);  
alert('h2 The data type of the collection of element objects is converted to : '+_makeArr.constructor.name);//The output Array

$(dom).toarray () restores all dom elements to an array [not often]

Explanation: restore all the DOM elements in the jQuery collection into an array. A less common method that individuals might find as redundant as $. MakeArray.


var _toArr=$('h2').toArray();  
alert('h2 The recovered data type of the collection of elements is : '+_toArr.constructor.name);


Related articles: