search
HomeWeb Front-endJS TutorialOrganize Javascript array study notes_javascript skills

1. What is an array
An array is a collection of values, each value has an index number, starting from 0, and each index has a corresponding value, adding more values ​​as needed.

 <script type="text/javascript">
  var myarr=new Array(); //定义数组
  myarr[0]=80; 
  myarr[1]=60;
  myarr[2]=99;
  document.write("第一个人的成绩是:"+myarr[0]);
  document.write("第二个人的成绩是:"+myarr[1]);
  document.write("第三个人的成绩是:"+myarr[2]);
 </script>

2. Form a group and give it a name (how to create an array)
Before using an array, you must first create it, and assign the array itself to a variable.
Create array syntax:

var myarray=new Array();//语句是创建一个新数组存储在myarray变量中
var myarray保存数组的变量
new Array();创建一个新的空数组

When we create an array, we can also specify the length of the array, and the length can be specified arbitrarily.

Copy code The code is as follows:
var myarray= new Array(8); //Create an array and store 8 pieces of data .

Note:
1). The new array created is an empty array with no value. If output, it will display undefined.
2). Although the length is specified when creating an array, arrays are actually variable-length, which means that even if the length is specified to be 8, elements can still be stored beyond the specified length.

3. Array assignment
Step one: form a bus
Step 2: Take your seat according to your ticket number
Seat No. 1 on the bus is Zhang San
Seat No. 2 on the bus is Li Si
Array expression:
Step 1: Create an array var myarr=new Array();
Step 2: Assign a value to the array
myarr[1]="Zhang San";
myarr[2]="李思";
Create an array to store the math scores of 5 people:

var myarray=new Array(); //创建一个新的空数组
myarray[0]=66; //存储第1个人的成绩
myarray[1]=80; //存储第2个人的成绩
myarray[2]=90; //存储第3个人的成绩
myarray[3]=77; //存储第4个人的成绩
myarray[4]=59; //存储第5个人的成绩

Note: Each value in the array has an index number, starting from 0.
The first method:

Copy code The code is as follows:
var myarray = new Array(66,80,90,77,59);/ / Create an array and assign values ​​at the same time

Second method:
Copy code The code is as follows:
var myarray = new Array[66,80,90,77,59];/ /Directly input an array (called "literal array")

4. Add a new element to the array
New elements can be added to the array at any time by simply using the next unused index.
myarray[5]=88; //Use a new index to add a new element to the array

5. Use array elements
To get the value of an array element, just reference the array variable and provide an index, like:
The first person’s score expression method: myarray[0]
The third person’s score expression method: myarray[2]

<script language="javascript">
 var myarr=new Array();
  myarr[0]="小红";
  myarr[1]="小明";
  myarr[2]="小亮";
  myarr[3]="小川";
  document.write("第二人的姓名是:"+ myarr[1] );
</script>

6. Understand the number of members (array attribute length)
The Length attribute represents the length of the array, that is, the number of elements in the array.

Copy code The code is as follows:
myarray.length; //Get the length of the array myarray

Note: Because the index of an array always starts from 0, the upper and lower limits of an array are: 0 and length-1 respectively. For example, if the length of the array is 5, the upper and lower limits of the array are 0 and 4 respectively.
 var arr=[55,32,5,90,60,98,76,54];//包含8个数值的数组arr 
 document.write(arr.length); //显示数组长度8
 document.write(arr[7]); //显示第8个元素的值54

At the same time, the length property of JavaScript arrays is variable, which requires special attention.

arr.length=10; //增大数组的长度
document.write(arr.length); //数组长度已经变为10

As the number of elements increases, the length of the array will also change, as follows:

var arr=[98,76,54,56,76]; // 包含5个数值的数组
document.write(arr.length); //显示数组的长度5
arr[15]=34; //增加元素,使用索引为15,赋值为34
alert(arr.length); //显示数组的长度16

7. Two-dimensional array
We think of a one-dimensional array as a set of boxes, each box can only hold one content.
Representation of one-dimensional array: myarray[ ]
We think of a two-dimensional array as a set of boxes, but each box can also contain multiple boxes.
Representation of two-dimensional array: myarray[ ][ ]
Note: The index values ​​of the two dimensions of the two-dimensional array also start from 0, and the last index value of the two dimensions is length-1.
1). Method 1 of defining two-dimensional array

var myarr=new Array(); //先声明一维 
for(var i=0;i<2;i++){ //一维长度为2
  myarr[i]=new Array(); //再声明二维 
  for(var j=0;j<3;j++){ //二维长度为3
   myarr[i][j]=i+j; // 赋值,每个数组元素的值为i+j
  }
 }

2). Two-dimensional array definition method 2

Copy code The code is as follows:
var Myarr = [[0 , 1 , 2 ],[1 , 2 , 3 , ]]

3). Assignment
Copy code The code is as follows:
myarr[0][1]=5; //Pass the value of 5 in into the array, overwriting the original value.

Explanation: myarr[0][1], 0 represents the row of the table, and 1 represents the column of the table.

The above is all about Javascript arrays. It is a further study of Javascript arrays. I hope you like it.

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
JavaScript in Action: Real-World Examples and ProjectsJavaScript in Action: Real-World Examples and ProjectsApr 19, 2025 am 12:13 AM

JavaScript's application in the real world includes front-end and back-end development. 1) Display front-end applications by building a TODO list application, involving DOM operations and event processing. 2) Build RESTfulAPI through Node.js and Express to demonstrate back-end applications.

JavaScript and the Web: Core Functionality and Use CasesJavaScript and the Web: Core Functionality and Use CasesApr 18, 2025 am 12:19 AM

The main uses of JavaScript in web development include client interaction, form verification and asynchronous communication. 1) Dynamic content update and user interaction through DOM operations; 2) Client verification is carried out before the user submits data to improve the user experience; 3) Refreshless communication with the server is achieved through AJAX technology.

Understanding the JavaScript Engine: Implementation DetailsUnderstanding the JavaScript Engine: Implementation DetailsApr 17, 2025 am 12:05 AM

Understanding how JavaScript engine works internally is important to developers because it helps write more efficient code and understand performance bottlenecks and optimization strategies. 1) The engine's workflow includes three stages: parsing, compiling and execution; 2) During the execution process, the engine will perform dynamic optimization, such as inline cache and hidden classes; 3) Best practices include avoiding global variables, optimizing loops, using const and lets, and avoiding excessive use of closures.

Python vs. JavaScript: The Learning Curve and Ease of UsePython vs. JavaScript: The Learning Curve and Ease of UseApr 16, 2025 am 12:12 AM

Python is more suitable for beginners, with a smooth learning curve and concise syntax; JavaScript is suitable for front-end development, with a steep learning curve and flexible syntax. 1. Python syntax is intuitive and suitable for data science and back-end development. 2. JavaScript is flexible and widely used in front-end and server-side programming.

Python vs. JavaScript: Community, Libraries, and ResourcesPython vs. JavaScript: Community, Libraries, and ResourcesApr 15, 2025 am 12:16 AM

Python and JavaScript have their own advantages and disadvantages in terms of community, libraries and resources. 1) The Python community is friendly and suitable for beginners, but the front-end development resources are not as rich as JavaScript. 2) Python is powerful in data science and machine learning libraries, while JavaScript is better in front-end development libraries and frameworks. 3) Both have rich learning resources, but Python is suitable for starting with official documents, while JavaScript is better with MDNWebDocs. The choice should be based on project needs and personal interests.

From C/C   to JavaScript: How It All WorksFrom C/C to JavaScript: How It All WorksApr 14, 2025 am 12:05 AM

The shift from C/C to JavaScript requires adapting to dynamic typing, garbage collection and asynchronous programming. 1) C/C is a statically typed language that requires manual memory management, while JavaScript is dynamically typed and garbage collection is automatically processed. 2) C/C needs to be compiled into machine code, while JavaScript is an interpreted language. 3) JavaScript introduces concepts such as closures, prototype chains and Promise, which enhances flexibility and asynchronous programming capabilities.

JavaScript Engines: Comparing ImplementationsJavaScript Engines: Comparing ImplementationsApr 13, 2025 am 12:05 AM

Different JavaScript engines have different effects when parsing and executing JavaScript code, because the implementation principles and optimization strategies of each engine differ. 1. Lexical analysis: convert source code into lexical unit. 2. Grammar analysis: Generate an abstract syntax tree. 3. Optimization and compilation: Generate machine code through the JIT compiler. 4. Execute: Run the machine code. V8 engine optimizes through instant compilation and hidden class, SpiderMonkey uses a type inference system, resulting in different performance performance on the same code.

Beyond the Browser: JavaScript in the Real WorldBeyond the Browser: JavaScript in the Real WorldApr 12, 2025 am 12:06 AM

JavaScript's applications in the real world include server-side programming, mobile application development and Internet of Things control: 1. Server-side programming is realized through Node.js, suitable for high concurrent request processing. 2. Mobile application development is carried out through ReactNative and supports cross-platform deployment. 3. Used for IoT device control through Johnny-Five library, suitable for hardware interaction.

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

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Tools

SublimeText3 English version

SublimeText3 English version

Recommended: Win version, supports code prompts!

Dreamweaver Mac version

Dreamweaver Mac version

Visual web development tools

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

EditPlus Chinese cracked version

EditPlus Chinese cracked version

Small size, syntax highlighting, does not support code prompt function