详解javascript数组连接、添加、删除、去重、排序等操作方法实例

详解javascript数组连接、添加、删除、去重、排序等操作方法实例-第1张-菜鸟建站

本文主要介绍了javascript数组常见操作方法,结合实例形式总结分析了javascript数组的连接、添加、删除、去重、排序等操作

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>www.newbii.cn常见数组的方法</title>
  <script>
    var arr=[1,3,4]
    var arr1=["a","b","c"]
    var arr2=["d","e","f"]
    var arrNum=[]
    //1、向数组的末尾添加一条或多条元素,并返回新的长度
    //arr.push("longzhoufeng")
    //console.log(arr)//1,3,4,"longzhoufeng"
    //2、向数组的最开始添加一条或多条元素,并返回新的长度
    //arr.unshift("minigui")//IE6,7不支持
    //console.log(arr)//"minigui", 1, 3, 4
    //3、连接二个数组或者多个数组
    //var newArr=arr.concat(arr1,arr2)
    //console.log(newArr)//[1, 3, 4, "a", "b", "c", "d", "e", "f"]
    //4、删除并返回数组的第一个元素
    //console.log(arr1.shift());//a
    //arr1.shift();
    //console.log(arr1);//b,c
    //5、删除并返回数组的最后一个元素
    //console.log(arr1.pop());//c
    //arr1.pop()
    //console.log(arr1)//["a", "b"]
    //6、删除,替换,添加
    //arr1.splice(0,2)//0代表位置,2代表要删除的个数
    //console.log(arr1)//["c"]
    //替换
    //arr1.splice(0,1,"longzhoufeng")//第三个参就是在0位置上替换成longzhoufeng
    //arr1.splice(0,1,"longzhoufeng")//第三个参就是在0位置上替换成longzhoufeng
    //console.log(arr1)//["longzhoufeng", "b", "c"]
    //添加
    //arr1.splice(1,0,"longzhoufeng")
    //console.log(arr1)//["a", "longzhoufeng", "b", "c"]
    //数组去重
    var arr3=[1,3,3,2,5,6,7,7]
    //1、先遍历数组的每一个元素
    for(var i=0;i<arr3.length;i++){
      //2、每遍历对比一个,就得往前加一位
      for(var j=i+1;j<arr3.length;j++){
        //3、对遍历的元素进行对比,如果相等,就删除后面的一个元素
        if(arr3[i]==arr3[j]){
          arr3.splice(j,1);
          //4、删除之后就减少一位,直到没有为止
          j--;
        }
      }
    }
    console.log(arr3)
    //7、数组排序
    var arr4=[4,3,5,5,76,2,0,8]
    //这种方法可能会有问题,因为sort()会把元素转换成字符串
    //arr4.sort();
    //console.log(arr4)//0, 2, 3, 4, 5, 5, 76, 8
    //sort()里面可以传一个函数,如果返回的是a-b就是从小到大,如果返回是b-a就从反方向排序
    arr4.sort(function(a,b) {
      return a-b;
    })
    console.log(arr4)//0, 2, 3, 4, 5, 5, 8, 76
    var arr5=["345px","23px","10px","1000px"]
    arr5.sort(function(a,b) {
      return parseInt(a)-parseInt(b);
    })
    console.log(arr5)//"10px", "23px", "345px", "1000px"
  </script>
</head>
<body>
</body>
</html>

以下是数组对象方法的是使用介绍:

cancat()

/**
 * concat:连接两个或者多个数组,并且返回该数组
 * 语法:array.concat(object,object,......);
 */
function array_concat() {
	var arr = [{index:'0'},{address:'1'}];
	var arr_1 = [{index:'3'},{index:'4'}];
	
	var newArr = arr.concat(arr_1);
	//[{"index":"0"},{"address":"1"},{"index":"3"},{"index":"4"}]
	console.log(JSON.stringify(newArr));
}

join()

/**
 * join():通过指定字符对数据进行分割,返回字符串。
 * jon(分隔符);
 */
function array_join() {
	var arr = ['1','2','3'];
	var str = arr.join('-');
	//1-2-3
	console.log(str);
}

pop()

/**
 * pop():删除数组的最后一个对象,返回该删除元素的值
 */
function array_pop() {
	var arr = [{index:'0'},{address:'1'}];
	var pop_data = arr.pop();
	
	//{"address":"1"}
	console.log(JSON.stringify(pop_data));
	//[{"index":"0"}]
	console.log(JSON.stringify(arr));
}

push()

/**
 * push:向数组末尾添加一个或者多个对象。
 * array.push(newObject1,newObject2,.....);
 */
function array_push() {
	//实例化一个数组对象
	var arr = new Array();
	var obj_1 = { index:'1', index:'2'};
	var obj_2 = { index:'3', index:'3'};
	
	arr.push(obj_1,obj_2);
	//[{"index":"2"},{"index":"3"}]
	console.log(JSON.stringify(arr));
}

shift()

/**
 * shift():该方法用户删除数组的第一个对象,并返回删除的元素
 */
function array_shift() {
	var arr = [{index:'0'},{address:'1'}];
	var shift_data = arr.shift();
	//{"index":"0"}
	console.log(JSON.stringify(shift_data));
	//[{"address":"1"}]
	console.log(JSON.stringify(arr));
}

slice()

/**
 * slice():从已知数组中返回指定选中的数据,该操作不会修改原数组的数据
 * slice(start,end);
 */
function array_slice() {
	var arr = ['1','2','3','4','5'];
	var new_array = arr.slice(1,arr.length);
	//["2","3","4","5"]
	console.log(JSON.stringify(new_array));
	//["1","2","3","4","5"]
	console.log(JSON.stringify(arr));
}

sort()

/**
 * sort():方法用户对数组的排序
 * sort(sortby)		sortby可选,必须是函数。如调用方法没有使用参数,则按字母顺序进行排序。
 */
function array_sory() {
	var arr = [{index:'500'},{index:'40'},{index:'100'},{index:'50'}];
	var new_array = arr.sort(function(a,b) {
		var n1 = Number(a.index);
		var n2 = Number(b.index);
		return n1 - n2;
	});
	//[{"index":"40"},{"index":"50"},{"index":"100"},{"index":"500"}]
	console.log(JSON.stringify(new_array));
}

splice()

/**
 * 向数组中删除/添加对象,并返回被删除的元素。
 * splice(index,count,item1,item2,......);	
 * index:规定删除/添加项目的起始位置,使用负数从数组的结尾处规定位置。
 * count:规定要删除项目的数量
 * item1,item2...:向项目中添加添加新的对象
 */
function array_splice() {
	var arr = ['1','2','3'];
	var new_array = arr.splice(0,2,'4','5');
	//["1","2"]
	console.log(JSON.stringify(new_array));
	//["4","5","3"]
	console.log(JSON.stringify(arr));
}

unshift()

/**
 * 向数组开头添加一个或者多个元素,并返回新的长度。
 */
function array_unshift() {
	var arr = [{index:'0'},{address:'1'}];
	var obj_1 = {index:'2'};
	var obj_2 = {index:'3'};
	var length = arr.unshift(obj_1,obj_2);
	//4
	console.log(length);
	//[{"index":"2"},{"index":"3"},{"index":"0"},{"address":"1"}]
	console.log(JSON.stringify(arr));
}

以上所述是小编给大家介绍的JavaScript对数组操作详解集合,希望对大家有所帮助,非常感谢大家对菜鸟建站的支持!

猜你喜欢

详解javascript数组连接、添加、删除、去重、排序等操作方法实例

详解javascript数组连接、添加、删除、去重、排序等操作方法实例

本文主要介绍了javascript数组常见操作方法,结合实例形式总结分析了javascript数组的连接、添加、删除、去重、排序等操作<!DOCTYPE html> <html> <head>   <meta charset="UTF-8">...

【已解决】javascript设置window.location.href跳转无效问题

【已解决】javascript设置window.location.href跳转无效问题

今天开启了用户注册功能,使用了唐朝的【用户中心(百搭)】zblog插件。开启后,发现一个小问题,注册修改密码等等提交数据成功后均无法跳转页面。找问题原因:表单form  会先执行form提交。提交之后 就已经不在当前页面了。所以 window.location.href无效。解决方法一......

发表评论