search

Home >Web Front-end >JS Tutorial >JavaScript web programming------Array-related knowledge

JavaScript web programming------Array-related knowledge

黄舟
黄舟Original
2016-12-30 16:49:021598browse

1. The length of arrays in Js can grow automatically

2. The function of arrays in Js is equivalent to the combination of arrays and collections in Java

3. var arr =[3,2,-4,78,10];//Correct, note that Java uses curly brackets to assign initial values, while JS uses square brackets

var arr[]=[3 ,2,-4,78,10];//Wrong, cannot be declared as arr[]---- cannot be declared with square brackets

4. Traverse the array

5, Arrays in Js can store data of different data types

<script type="text/javascript">
        //数组定义的方式1: 定义时直接赋初值
        var arr =[12,34,2,-3,90,12];
        //alert(typeof(arr)); //object
        //alert("len:"+arr.length);
        //遍历数组
        for(var x=0;x<arr.length;x++){
        	document.write("arr["+x+"]="+ arr[x]+" ");
        }
        document.write("<br/>");
        
        arr[0]=-1000;
        arr[7]=666;//数组可以自动增长，且arr[6]没有赋值则是undefined
        for(var x=0;x<arr.length;x++){
        	document.write("arr["+x+"]="+ arr[x]+" ");
        }
        document.write("<br/>");
        
        var arr2=[];
        //alert(arr2.length);//0
        arr2[1]=10;
        for(var x=0;x<arr2.length;x++){
        	document.write("arr2["+x+"]="+ arr2[x]+" ");
        }
        document.write("<br/>");
        
        //※※错误的声明方式--数组
        //int[] arr3 ={1,2,3};
        //var[] arr3 = [1,2,3];//错的，[]代表的是数组类型，而js中，所有数据类型只有一个var声明，不存在“var[]”这种类型
        
        var arr4=[1,2,3,100];
        arr4[0]="abc";
        arr4[1]=true;
        for(var x=0;x<arr4.length;x++){
        	document.write("arr4["+x+"]="+ arr4[x]+" ");
        }
        document.write("<br/>");
        
        //※※综上,js数组的两个特点：
        //1,长度是可变的
        //2,元素的类型是任意的
     </script>

Note: Syntactically it is possible because it has the characteristics of a collection and various types of data can be assigned to it. Although this is the case, when we are doing projects, it is best to store the same type of data in an array.

6. Another way to define arrays in JS: use the Array object in JS

Note: When using the Array object to define an array, when the parameter is 1, it refers to the length of the array; If it is greater than 1, it is directly the initial value of the element in the array

var arr2 = new Array(5); //Define an array with a length of 5----When the parameter is 1, it is the length

var arr3 = new Array(5, 6, 7); //When the parameter is greater than 1, it is the initial value of the element

7, Methods in the Array object in Js

1 )concat method: Returns a new array, which is a combination of two or more arrays.

2) join method: Returns a string value that contains all the elements of the arrays connected together, with the elements separated by the specified delimiter.

3) reverse method: Returns an Array object with the order of elements reversed.

4) shift method: Remove the first element in the array and return the element. -----removeFirst()

5) slice method (Array): Returns a segment of an array. -----Similar to substring() in String

6) sort method: Returns an Array object whose elements have been sorted.

7) splice method: Replacement. Removes one or more elements from an array, inserts a new element in its place if necessary, and returns the removed elements.

8) unshift method: Insert the specified element into the beginning of the array. The return value is the length of the new array----addFirst()
Example:

<html>
  <head>
    <title>Array对象使用方法演示</title>
  </head>
  
  <body>
    <script type="text/javascript" src="out.js">
    </script>
   <script type="text/javascript">
     var arr=["aaa","bbb","ccc","ddd"];
     println(arr);
     var arr2=["111","222","333","okok"];
     var newArr = arr.concat(arr2);
     println(newArr);
     
     println(newArr.join("-"));
     
     println("<hr/>");
     
     //pop() :  移除数组中的最后一个元素并返回该元素。
     println( newArr.pop() );
     println(newArr);
     //push() : 将新元素添加到一个数组中，并返回数组的新长度值。
     arr.push("x1","x2");
     println(arr);
     //arr.push("y1",arr2,"z1");//注意1，arr2在arr当中是一个元素---即arr变成二维数组。注意2，push方法会改变原来的数组。arr长度为：9
     arr=arr.concat("y1",arr2,"z1");//注意1，该方法会把数组arr2当中的每个元素取出来，分别添加到arr当中---arr还是一维数组。注意2，concat方法不会改变原来的数组，连接结果以新数组的形式返回。旧arr的长度还是6，新arr的长度是12
     println(arr);
     println(arr.length);
     
     arr.sort();
     println(arr);
     
     arr.splice(1, 3, "u1","u2","u3","u4","u5");//从1位置开始，删掉3个元素，并且在删除的位置插入:"u1","u2","u3","u4","u5"
     println(arr);
     
     //※※※做栈和队列的提示
     //unshift---addFirst  concat--addLast()  shift---removeFirst()  pop---removeLast()
     //Array.prototype.addFirst=unshift;
   
   </script>
    
    <script type="text/javascript" src="arraytools.js">
    </script>
    <script type="text/javascript">
       var arr=["aaa","bbb","ccc","ddd"];
       var max = arr.getMax();
       println(max);
       println(arr);
       
    </script>
  </body>
</html>

Tools used

arraytools.js

//给原型对象添加一个getMax()方法
Array.prototype.getMax = function() {
	var temp=0;
	for(var x=1;x<this.length;x++){
		if(this[x]>this[temp]){
			temp = x;
		}
	}
	return this[temp];
};
Array.prototype.toString = function() {
	return "["+this.join("")+"]";
};

out.js 

function println(param){
	document.write(param+"<br/>");
}
function print(param){
	document.write(param);
}

The above is the content of JavaScript web programming------array-related knowledge. 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
Previous article：JavaScript web programming------functions (general functions, dynamic functions, anonymous functions)Next article：JavaScript web programming------functions (general functions, dynamic functions, anonymous functions)

Related articles

See more