This article to share my JavaScript advanced programming Learning notes of the object and array reference types, related to JavaScript reference type knowledge, we look at it together.
1. Object type
Most reference type values are instances of type object, and object is one of the most used types in ECMAScript.
There are two ways to create an instance of object:
The new operator is followed by the object constructor:
var person=new Object ();
Person.name= "Webb";
person.age=25;
Object literal notation:
var person={
Name: "Webb",
age:25
};
2. Array type
In addition to object, the array type is probably the most commonly used type in ECMAScript.
Each item of the ECMAScript array can hold any type of data (for example, the first position can hold the string, the second position holds the value, the third position saves the object, and so on). And the size of the ECMAScript array can be dynamically adjusted, that is, it can grow automatically as the data is added to accommodate the new data.
There are two basic ways to create arrays.
Using the array constructor:
var colors=new Array ();
var colors=new Array; You can also set the Length property
var colors=new Array ("Red", "Blue", "green"); An array containing 3 strings,
var colors=array (3); The new operator can be omitted
Array literal notation
var colors=["Red", "Blue", "green"];
Alert (colors[0]); Show the first item
colors[2]= "BLACK"; Modify the third item
colors[3]= "Brown"; New Fourth item
Note: The length property of an array is characteristic-it is not read-only. So by setting this property, you can remove or add items from the end of the array. For example
var colors=["Red", "Blue", "green"];
colors.length=2;
Alert (colors[2]); Undefined
colors[colors.length]= "black"; Add Item at end
2.1 Array of detections
For a Web page, or a global scope, you can use the instanceof operator to determine whether an object is an array:
if (value instanceof Array) {
//array performs certain actions
}
The problem with the instanceof operator is that it assumes that there is only one global execution environment. If a Web page contains more than one frame, there is actually more than two different global execution environments, so there are more than two different versions of the array constructor. If you pass an array to another frame from one frame, the passed-in array has its own different constructors than the array created in the second frame.
To solve this problem, ECMAScript5 added the Array.isarray () method. The purpose of this method is to ultimately determine whether a value is an array, regardless of the global execution environment in which it was created.
if (Array.isarray (value)) {
//the array performs certain actions
}
Browsers that support this method are ie9+, Firefox 4+, Safari 5+, Opera 10.5+, and Chrome.
2.2 Conversion Methods
The call to the ToString () method of the array returns a comma-delimited string of strings of each value in the array. And the call to ValueOf () returns an array. In fact, in order to create this string, the ToString () method for each item of the array is invoked. For example
var colors=["Red", "Blue", "green"];
Alert (colors.tostring ()); Red,blue,green
alert (colors.valueof ()); Red,blue,green
alert (colors); Red,blue,green
In addition, the tolocalestring () method often returns the same values as the ToString () and valueof () methods, but not always. When the toLocaleString () method of an array is invoked, it also creates a comma-delimited string of array values. The only difference from the first two methods is that this time, in order to get the value of each item, the toLocaleString () method for each item is invoked, not the ToString () method.
var person1={
tolocalestring:function () {return
' webbxx ';
},
tostring:function () {return
" Webb ";
}
};
var person2={
tolocalestring:function () {return
"Susanxx";
},
tostring:function () {
return "Susan";
}
;
var people=[person1,person2];
alert (people); Webb,susan
alert (people.tostring ()); Webb,susan
alert (people.tolocalestring ()); Webbxx,susanxx
uses the Join () method to output an array, and specifies the delimiter, which defaults to commas:
var colors=["Red", "Blue", "green";
Alert (Colors.join (",")); Red,blue,green
alert (colors.join ("| |)"); red| | blue| | Green
2.3 Stack Method (LIFO)
Push (): Accepts any number of parameters, adds them to the end of the array one by one, and returns the length of the modified array;
Pop (): Removes the last item from the end of the array
var colors=new Array ();
var Count=colors.push ("Red", "green");
alert (count); 2
Count=colors.push ("Black");
alert (count); 3
var item=colors.pop ();
alert (item); "Black"
alert (colors.length); 2
2.4 Queue Method (FIFO)
Shift (): Moves the first item of the divisor group and returns the item, while the array length is reduced by 1;
Unshift (): As the name suggests, in contrast to the shift (), you can add any item to the front of the array and return the length of the array.
2.5 reordering Methods
Reverse (): Reverses the order of the array items;
Sort (): By default in ascending order, for sorting, the sort () method invokes the ToString () method for each item, and then compares the resulting string to determine how to sort. Even if each item is a numeric value, the comparison is also a string, as shown below.
var values=[0,1,5,10,15];
Values.sort ();
alert (values); 0,1,10,15,5
This sort of arrangement is not the best solution in many cases. So the sort () method can accept a comparison function as an argument to specify which value precedes which value.
function Compare (value1,value2) {
if (value1<value2) {
return-1; Value1 before value2
}else if (value1>value2) {return
1;
} else{return
0;
}
This comparison function can be applied to most types, as long as it is passed as a parameter to the sort () method, as follows,
var values=[0,1,5,10,15];
Values.sort (compare);
alert (values); 0,1,5,10,15
2.6 Method of Operation
Concat (): Creates a new array based on all the items in the current array. For example
var colors=["Red", "Blue", "green"];
var colors2=colors.concat ("Yellow", ["Black", "Brown"]);
alert (colors); Red,blue,green
alert (colors2); Red,blue,green,yellow,black,brown
Slice (): Creates a new array based on one or more items in the current array. For example
var colors=["Red", "green", "blue", "yellow", "purple"];
var colors2=colors.slice (1); Green,blue,yellow,purple
var colors3=colors.slice (1,3); Green,blue,yellow
Splice (): This method is probably the most powerful array method, the main purpose is to insert the item to the middle of the array, but the way to use this method is as follows 2 kinds.
Delete: You can delete any number of items by specifying only 2 parameters: the position of the first item to delete and the number of items to delete.
Insert: You can insert any number of items to a specified location by providing only 3 parameters: Start position, 0 (number of items to delete), and items to insert. If you want to insert more than one item, you can transfer four or five to any number of items; For example, splice (2,0, "Red", "green") inserts the string "Red" and "green" from the current array's position 2.
The splice () method always returns an array containing the items that were deleted from the original array (an empty array is returned if no items are deleted).
2.7-Position method
IndexOf () and LastIndexOf (): Both methods accept two parameters: the Xiang (optional) To find indicates the index at which to find the start position. The former starts with a backward lookup from the beginning, and the latter looks forward from the end
2.8 Iterative Methods
ECMASCRIPT5 defines 5 iteration methods, each of which accepts two parameters: the function to run on each item and (optionally) the scope object that runs the function-the value that affects this. The functions passed into these methods receive three parameters: the value of the array item, the position of the item in the array, and the group object itself.
Every (): Runs the given function for each item in the array, and returns True if the function returns true for each item.
Filter (): Each item in an array runs the given function, returning an array of items that the function returns True.
ForEach (): Runs the given function for each item in an array, and this method has no return value.
Map (): Each item in an array runs the given function, returning an array of the results of each function call.
Some (): Runs the given function for each item in the array, and returns True if the function returns true for either item.
None of the above methods will modify the values contained in the array. For example
var numbers=[1,2,3,4,5,4,3,2,1];
var everyresult=numbers.every (function (item,index,array) {return
item>2;
});
alert (everyresult); False
var someresult=numbers.every (function (item,index,array) {return
item>2;
});
alert (someresult); True
var filterresult=numbers.every (function (item,index,array) {return
item>2;
});
alert (filterresult); [3,4,5,4,3]
var mapresult=numbers.every (function (item,index,array) {return
item*2;
});
alert (mapresult); [2,4,6,8,10,8,6,4,2]
2.9 Merge Method
Reduce (): begins with the first item of the array, traversing to the last;
Reduceright (): Begins with the last item of the array and traverses forward to the first item.
Both methods accept two parameters: a function called on each item and (optionally) an initial value that is the base of the merge. The functions passed to these methods accept 4 parameters: The previous value, the current value, the index of the item, and the array object. Any value returned by this function will be passed as the first argument to the next. For example
var values=[1,2,3,4,5];
var sum=values.reduce (function (prev,cur,index,array) {return
prev+cur;
});
alert (sum); 15