Detailed explanation of JavaScript objects and array _ javascript skills

Source: Internet
Author: User
This article mainly introduces JavaScript objects and arrays. You can refer to many advanced programming languages that are object-oriented, such as C ++, C #, Java, and other advanced programming languages, what are the basic requirements of an object-oriented language? 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, you cannot access the physical representation of an object. You can only access the reference of an object. 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 a weak Object-Oriented web scripting language.
I. Object Type
The Object type includes attributes (or fields) and methods (or functions ). Therefore, when creating an Object type, it must be explained. 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:" zhangsan ", age: 23}; box (obj );

Output: James
23
Ii. 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 output array length is 4 document. 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:

3. Methods in 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 document. write (box. toString () +"
"); // Output 1, 2, 3, 4 document. write (box. valueOf () +"
"); // Output 1, 2, 3, 4 document. 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. write (box +" to the end of the array"
"); Document. write (box. push (7,8) +"
"); // Add an element at the end of the array, and return the length of the array after adding the element document. write (box +"
"); Box. pop (); // remove the element document. write (box +"
"); Document. write (box. pop () +"
"); // Remove the element at the end of the array and return 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. write (box +" to the end of the array"
"); Document. write (box. push (7,8) +"
"); // Add an element at the end of the array, and return the length of the array after adding the element document. write (box +"
"); Box. shift (); // remove an element document. 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. write (box +"
"); Document. write (box. unshift (-1) +"
"); // Add an element to the front end of the array and return the length of document. write (box +"
"); Box. pop (); // remove the element document. write (box +" at the end of the array"
"); Document. write (box. pop () +"
"); // Remove the element at the end of the array and return the length document. write (box) of the array after the element is removed );

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 54321 document. write (box. reverse (); // output 12345 in reverse order.

Sort (): Sorting from small to large

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

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 is not changed.

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 document. 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 3, 4, 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 null and the document. write (box) element is not truncated. // insert an element, or 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 1, 2, 3, 4, 6 after replacement

The above is a detailed introduction to JavaScript objects and arrays. I hope it will help you learn more.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.