search
HomeWeb Front-endJS TutorialJavaScript Array Example Tutorial

JavaScript Array Example Tutorial

Dec 20, 2016 pm 03:22 PM
javascript

An array is a collection of many variables with the same name. The usage of an array is exactly the same as that of an ordinary variable. It can also be stored in any data type. The only difference is that it occupies a continuous space in the memory. You can number them sequentially and use them accordingly. The previous article [Usage of JavaScript Arrays] mainly introduces the use of js arrays on the Internet. This article introduces the powerful functions and usage methods of js arrays through examples.

Arrays are made up of many variables with the same name. Arrays The usage is exactly the same as that of ordinary variables. It can also be stored in any data type. The only difference is that it occupies a continuous space in the memory. You can number them in sequence and use them according to the number. . The benefit of an array is that it can declare and use multiple variables at once. The method of using JAVAScript arrays is different from that of VBScript. When using it, it should be enclosed in square brackets "[]", and different variables should be separated by commas ",".
var array name;
array name = [1,...,n];
Example: I want to define an array "fruit", which contains three fruits: "watermelon", "apple", and "banana" , we have to write like this:

var fruit;
fruit = ["watermelon", "apple", "banana"]; //Assign values ​​to the three fruits in the array

At this time, "fruit[0]" is " "Watermelon", "fruit[1]" is "apple", "fruit[2]" is "banana", and "fruit" is "watermelon, apple, banana". (JAVAScript will start counting from "0", this principle must be remembered.)
If you want to reassign values ​​to the variables in the array, such as changing "apple" to "strawberry", you should write like this:
fruit = [" Watermelon","Apple","Straw mold"]; //Reassign the variables in the array "fruit"
Because the variables "fruit[0]" and "fruit[2]" in the array remain unchanged, you can also Write like this:
fruit = [fruit[0], fruit[1], "grass mold"]; //Change the variable "fruit[2]" in the "fruit" array to "grass mold"
Note: Even if the variable " The values ​​of "fruit[0]" and "fruit[2]" will not be changed, but they must be written, otherwise the original values ​​will be lost and become "undefined".
In fact, you don’t need to write out all the variables of the array. If you write the array like this:
var fruit;
fruit = ["watermelon", ,"strawberry"]; //Assign values ​​to the three fruits in the array
This When "fruit[0]" is "watermelon", "fruit[1]" is "undefined", "fruit[2]" is "grass mold", and "fruit" is "watermelon,,grass mold".
If you write this array like this:
var fruit;
fruit = ["watermelon", "banana", ,]; //Assign values ​​to the four fruits in the array
At this time, there are four variables in the array "fruit[0 ]" is "watermelon", "fruit[1]" is "straw mold", "fruit[2]" is "undefined", "fruit[3]" is "undefined", "fruit" is "watermelon, straw mold" ,,".
The following is an example:

Note: JAVAScript array and VBScript Arrays are not only different in syntax, but also have many differences when used. Please pay attention to the distinction.

1. Create array object

We will introduce how to create array objects in JAVAScript. (Actually, this method is essentially the same as the previous method, except for the way the statements are written. The above method is simpler to use when the program is very short. In general, I still recommend that you use the following method. Create an array object.) There are two syntaxes for creating an array object:
1. When declaring an array, only declare several components in the array.
var array object name = new Array (number of components);
fruit = new Array(3); //Declare an array named fruit. There are three components in total. This is equivalent to declaring three variables at once
Then you must Prepare a few additional lines of program code and fill in the variable values ​​sequentially.
fruit[0] = "watermelon";
fruit[1] = "apple";
fruit[2] = "banana";
2. Directly give all array components when declaring, separated by commas, Surrounded by parentheses, the number of components is the length of the array.
var array object name = new Array (component one..., component N);
var fruit = new Array ("watermelon", "apple", "banana");
Note: In general languages, the components in the array must are values ​​of the same type, but different types of data can be put into arrays in JAVAScript.

2. Attributes of array objects

JAVAScript provides the following attributes for array objects:
Usage format:
Array object name.Attributes

Ordered attribute name usage instructions
1 constructor specifies the function to create a prototype prototype
2 index represents the index value of the array component
3 input represents the string in the regular expression.
4 length gets the length of the array (number of array components).
5 prototype is used to create custom object properties

3. Methods of array objects

JAVAScript provides the following methods for array objects:
Usage format:
Array object name.Method (parameter)

Ordered method name usage Description
1 concat(array1,array2,…,arrayN) combine multiple arrays into a new array
2 join(separator character) combine arrays into a string, separated by specific characters
3 pop( ) Delete the last component in the array and return the content of the component
4 push (component 1, component 2,..., component N) Add one or more components to the end of the array and return the content of the last component
5 reverse () Reverse the index order of all components in the array (Transpose)
The first component becomes the last one, and the last component is brought to the front
6 shift() Delete the first component in the array and return the Component content
7 slice (start index, end index) Transfer the array content into a new array
8 sort() Sort the array content
9 splice() Add or delete array components
10 toSource() Return the specific array The array constant can be used to create a new array
11 toString() represents the array and its components as a string
12 unshift(component 1, component 2,..., component N) adds one or more components to the array The front, and returns the last array length
13 valueOf() Gets the array value

Note: Some of these methods, such as push, shift, unshift... are not supported by some versions of IE browsers, so you should pay special attention when using them.

Example:

3. Two-dimensional array

JAVAScript’s array object is actually only one-dimensional structure, but we can use the further design and utilization of one-dimensional arrays to put the array into the array, so that the components in the array are also arrays, forming a two-dimensional array in JAVAScript. However, errors are prone to occur in the use of two-dimensional arrays, so we will only introduce its concept here and do not recommend its use. The above is the content of the JavaScript array example tutorial. For more related content, please pay attention to the PHP Chinese website (www .php.cn)!


Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Python vs. JavaScript: Which Language Should You Learn?Python vs. JavaScript: Which Language Should You Learn?May 03, 2025 am 12:10 AM

Choosing Python or JavaScript should be based on career development, learning curve and ecosystem: 1) Career development: Python is suitable for data science and back-end development, while JavaScript is suitable for front-end and full-stack development. 2) Learning curve: Python syntax is concise and suitable for beginners; JavaScript syntax is flexible. 3) Ecosystem: Python has rich scientific computing libraries, and JavaScript has a powerful front-end framework.

JavaScript Frameworks: Powering Modern Web DevelopmentJavaScript Frameworks: Powering Modern Web DevelopmentMay 02, 2025 am 12:04 AM

The power of the JavaScript framework lies in simplifying development, improving user experience and application performance. When choosing a framework, consider: 1. Project size and complexity, 2. Team experience, 3. Ecosystem and community support.

The Relationship Between JavaScript, C  , and BrowsersThe Relationship Between JavaScript, C , and BrowsersMay 01, 2025 am 12:06 AM

Introduction I know you may find it strange, what exactly does JavaScript, C and browser have to do? They seem to be unrelated, but in fact, they play a very important role in modern web development. Today we will discuss the close connection between these three. Through this article, you will learn how JavaScript runs in the browser, the role of C in the browser engine, and how they work together to drive rendering and interaction of web pages. We all know the relationship between JavaScript and browser. JavaScript is the core language of front-end development. It runs directly in the browser, making web pages vivid and interesting. Have you ever wondered why JavaScr

Node.js Streams with TypeScriptNode.js Streams with TypeScriptApr 30, 2025 am 08:22 AM

Node.js excels at efficient I/O, largely thanks to streams. Streams process data incrementally, avoiding memory overload—ideal for large files, network tasks, and real-time applications. Combining streams with TypeScript's type safety creates a powe

Python vs. JavaScript: Performance and Efficiency ConsiderationsPython vs. JavaScript: Performance and Efficiency ConsiderationsApr 30, 2025 am 12:08 AM

The differences in performance and efficiency between Python and JavaScript are mainly reflected in: 1) As an interpreted language, Python runs slowly but has high development efficiency and is suitable for rapid prototype development; 2) JavaScript is limited to single thread in the browser, but multi-threading and asynchronous I/O can be used to improve performance in Node.js, and both have advantages in actual projects.

The Origins of JavaScript: Exploring Its Implementation LanguageThe Origins of JavaScript: Exploring Its Implementation LanguageApr 29, 2025 am 12:51 AM

JavaScript originated in 1995 and was created by Brandon Ike, and realized the language into C. 1.C language provides high performance and system-level programming capabilities for JavaScript. 2. JavaScript's memory management and performance optimization rely on C language. 3. The cross-platform feature of C language helps JavaScript run efficiently on different operating systems.

Behind the Scenes: What Language Powers JavaScript?Behind the Scenes: What Language Powers JavaScript?Apr 28, 2025 am 12:01 AM

JavaScript runs in browsers and Node.js environments and relies on the JavaScript engine to parse and execute code. 1) Generate abstract syntax tree (AST) in the parsing stage; 2) convert AST into bytecode or machine code in the compilation stage; 3) execute the compiled code in the execution stage.

The Future of Python and JavaScript: Trends and PredictionsThe Future of Python and JavaScript: Trends and PredictionsApr 27, 2025 am 12:21 AM

The future trends of Python and JavaScript include: 1. Python will consolidate its position in the fields of scientific computing and AI, 2. JavaScript will promote the development of web technology, 3. Cross-platform development will become a hot topic, and 4. Performance optimization will be the focus. Both will continue to expand application scenarios in their respective fields and make more breakthroughs in performance.

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Atom editor mac version download

Atom editor mac version download

The most popular open source editor

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

This project is in the process of being migrated to osdn.net/projects/mingw, you can continue to follow us there. MinGW: A native Windows port of the GNU Compiler Collection (GCC), freely distributable import libraries and header files for building native Windows applications; includes extensions to the MSVC runtime to support C99 functionality. All MinGW software can run on 64-bit Windows platforms.

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.