Easy to learn about JavaScript 9: JavaScript objects and Arrays

Easy to learn about JavaScript 9: JavaScript objects and Arrays

Many advanced programming languages are object-oriented, such as C ++, C #, Java, and other advanced programming languages.

What about this requirement? Next, let's talk about some Object-Oriented Knowledge.

An object-oriented language provides developers with four basic capabilities:

(1) Encapsulation: ability to store relevant information (regardless of data or methods) in objects

(2) clustering: the ability to store one object in another object

(3) Inheritance: the ability to obtain attributes and methods of a class from another class (or multiple classes)

(4) polymorphism: the ability to write functions or methods that can run in multiple ways

Because ECMAScript supports these requirements, it can be seen as object-oriented. In ECMAScript, the physical representation of an object cannot be accessed.

References that can access objects. Each time an object is created, the objects stored in the variables are referenced by the object, rather than the object itself. Therefore, JavaScript is based on the surface

A weak web scripting language for objects.

1. Object Type

The Object type includes attributes (or fields) and methods (or functions ). Therefore, when creating the Object type, it must be described.

Point. Generally, there are two methods to create the number of Object types:

(1) use the new operator

 

Var box = new Object (); box. name = "James"; // create attributes and initialize the box. age = 23; box. run = running (); // creation method function running () {return "I'm Chinese! ";} Document. write (typeof box + ""); document. write (box. name + ""); document. write (box. age + ""); document. write (box. run );

 

Output: object

Zhang San

23

I am Chinese!

(2) literal representation

 

Var box = {name: "James", age: 23, run: function () {return "I'm Chinese! ";}}; Document. write (typeof box + ""); document. write (box. name + ""); document. write (box. age + ""); document. write (box. run ());

 

Output: Same as above

(3) Comprehensive use

When multiple parameters are passed, we need to input them in sequence. To solve this tedious process, we can encapsulate multiple parameters.

In an Object type, the Object type is used as a parameter. We can also judge non-existing or extra parameters, which facilitates the call function.

Number and transmission parameters.

 

Function box (obj) {if (obj. name! = Undefined) document. write (obj. name + ""); if (obj. age! = Undefined) document. write (obj. age + ""); if (obj. love! = Undefined) document. write (obj. love + "");} var obj = {name: "James", age: 23}; box (obj );

 

Output: James

23

Binary Array type

Arrays in ECMAScript are very different from other languages. Elements in arrays in JS can be any data type, and the size of arrays is also

Yes. JS is a weak language. There are two methods to create the number of Array types:

(1) use the new operator (new can be omitted)

Var box = new Array (1, 2, 4); document. write (typrof box + ""); // Array belongs to the Object type document. write (box); // output 1, 2, 3, 4

Index subscript starts from 0

Var box = new Array (1, 2, 4); document. write (box [0] + box [1] + box [2] + box [3]); // output 1, 2, 3, 4

Create an array containing ten elements

Var box = new Array (10); // The default value for creating an Array must be a number and must be a number box [3] = 4; // initialize the element box [5] = 6; document. write (box); // output, 4, 6 ,,,,

(2) Use the literal to create an array

Var box = [1, 2, 4]; document. write (typrof box + ""); // output Object document. write (box. length + ""); // The length of the output array is 4 documents. write (box); // output 1, 2, 3, 4

Create a complex array (can be of various types)

 

Var box = [{name: "zhangsan", age: 23}, // Object type [,], // Array type "JS ", // String type 25 + 25, // Number type new Array (1, 2, 3) // Array type]; document. write (typeof box + ""); document. write (box [0]. name + ""); document. write (box [3]);

 

The output result of the page is:

Methods In three objects

(1) Conversion Method

All objects or arrays have toLocaleString (), toString (), and valueOf () methods. Here, toString () and valueOf () will be returned no matter who is overwritten

Returns the same value. The array concatenates each value into a string separated by commas.

 

Var box = [1, 2, 4]; document. write (box + ""); // output 1, 2, 3, 4 documents. write (box. toString () + ""); // output 1, 2, 3, 4 documents. write (box. valueOf () + ""); // output 1, 2, 3, 4 documents. write (box. toLocaleString (); // output 1, 2, 3, 4

 

By default, array strings are separated by commas. If you use the join () method, you can use different delimiters to construct this string.

 

    var box=[1,2,3,4];    document.write(box+"");    document.write(typeof box+"");    document.write(box.join("-")+"");    document.write(typeof box.join("-"));

 

The output result of the page is:

(2) stack method

The ECMAScript array provides a way to make the array behavior look similar to other data structures. That is to say, the array can be as limited as the stack.

Insert and delete data structures. Stack is a type of post-import, first-out data structure, that is, the newly added elements are first removed. Stack element insertion and

Removed, only at the top of the stack. ECMAScript provides the push () and pop () methods for arrays.

Image of array elements of stack operations:

The push () method can accept any number of parameters, add them one by one to the end of the array, and return the length of the modified array. The pop () method

Remove the last element from the end of the array, reduce the length value of the array, and return the removed element.

 

Var box = [1, 2, 4]; document. write (box + ""); box. push (5, 6); // Add the element document at the end of the array. write (box + ""); document. write (box. push () + ""); // Add an element at the end of the array and return the length document of the array after the element is added. write (box + ""); box. pop (); // remove the element document at the end of the array. write (box + ""); document. write (box. pop () + ""); // removes the elements at the end of the array and returns the removed element document. write (box );

 

Output:

(3) queue Method

The stack method is post-import first-out, and the queue method is first-in-first-out. The queue adds elements to the end of the array and removes the elements from the front end of the array. Push ()

Add an element to the end of the array, and then remove an element from the front end of the array using the shift () method.

Images of queue Operation Array elements

 

Var box = [1, 2, 4]; document. write (box + ""); box. push (5, 6); // Add the element document at the end of the array. write (box + ""); document. write (box. push () + ""); // Add an element at the end of the array and return the length document of the array after the element is added. write (box + ""); box. shift (); // remove an element document at the front of the array. write (box + ""); document. write (box. shift () + ""); // remove an element from the front of the array and return the removed element document. write (box );

 

Output:

ECMAScript also provides an unshift () method for the array, which is opposite to the function of the shift () method. The unshift () method is used to add the front-end of the array.

An element.

 

Var box = [1, 2, 4]; document. write (box + ""); box. unshift (0); // Add an element document at the front of the array. write (box + ""); document. write (box. unshift (-1) + ""); // Add an element to the front end of the array and return the length document of the array. write (box + ""); box. pop (); // remove the element document at the end of the array. write (box + ""); document. write (box. pop () + ""); // remove the element at the end of the array, and return the length document of the array after the element is removed. write (box );

 

Output:

(4) re-sorting method

The array already contains two methods for sorting: reverse () and sort ().

Reverse (): reverse sorting

 

Var box = [1, 2, 3, 4, 5]; box. reverse (); document. write (box + ""); // output the 54321 document. write (box. reverse (); // re-reverse the order, output 12345

 

Sort (): Sorting from small to large

 

Var box = [3, 2, 6, 4, 1, 5]; box. sort (); document. write (box + ""); // output 1, 2, 3, 4, 5, 6 document. write (box. sort (); // sort again from small to large

 

This problem may occur if we have performed many experiments,

 

Var box = [, 5]; box. sort (); document. write (box); // output, 5

 

We can see from the results that this violates the results we want. solution:

 

Function compare (value1, value2) {if (value1
 
  
Value2) {return 1;} else {return 0;} var box = [, 5]; box. sort (compare); document. write (box); // output 0, 1, 5, 10, 15
 

 

(5) Operation Method

JS provides many methods for operations on elements already included in the array. The concat () method can create a new array based on the current array. Slice () Party

You can obtain the specified region element based on the current array and create a new array. The splice () method is mainly used to insert elements into the middle of an array.

A

 

Var box = [1, 2, 3, 4, 5]; var box1 = box. concat (6); // create a new array and add the new element document. write (box1 + ""); // output 1, 2, 3, 4, 5, 6, document. write (box); // The original array does not change

 

B

 

Var box = [1, 2, 3, 4, 5]; var box1 = box. slice (2); // retrieve the elements after the index is 2 to form a new array document. write (box1 + ""); // output 3, 4, 5 documents. write (box); // The original array does not change

 

C

 

Var box = [1, 2, 3, 4, 5]; var box1 = box. slice (2, 3); // retrieve the elements with an index between 2 and 3 to form a new array document. write (box1 + ""); // output 3 document. write (box); // The original array does not change

 

Delete function in splice

 

Var box = [1, 2, 3, 4, 5]; var box1 = box. splice (); // capture the two elements starting from 0 to form a new array document. write (box1 + ""); // return the intercepted element, 1, 2, document. write (box); // The elements intercepted by the current array are deleted and output to 3, 4, and 5

 

Insert function in splice

 

Var box = [1, 2, 3, 4, 5]; var box1 = box. splice (, 6); // an element document is inserted at the position where the index is 4. write (box1 + ""); // The returned new array is empty and no document element is truncated. write (box); // insert an element 1, 2, 3, 4, 6, and 5 at the position where the index of the current array is 4.

 

Replacement in splice

 

Var box = [1, 2, 3, 4, 5]; var box1 = box. splice (, 6); // elements indexed to 4 are replaced, and the replaced elements form a new array of documents. write (box1 + ""); // return the new array 5 document. write (box); // The original array after replacement: 1, 2, 3, 4, 6