js数组

最新推荐文章于 2022-11-18 11:22:48 发布

斗弟

最新推荐文章于 2022-11-18 11:22:48 发布

阅读量333

点赞数

文章标签：数组

本文链接：https://blog.csdn.net/L_Lintellect/article/details/97882528

版权

数组

arr.length //获取数组长度

构造函数声明数组

var arr = new Array(); //声明数组的同时都是可以初始化给数组赋值的

数组的访问：arr[i] 二维的时候 arr [i] [j]

数组常用的方法；数组名.方法() 的形式

方法	作用	返回值	原数组
push ()	尾部添加一个或多个数据，有参	数组长度	改变
pop()	删除最后一个，无参	被删除的元素	改变
unshift()	开头添加一个或多个，有参	返回数组新的长度	改变
shift()	删除第一个，无参	被删除元素	改变
splice(start,deleteNum,…items)	start:开始位置 deletNum:删除数量 item：插入项。插入、删除、替换的通用方法	被删除掉的元素	改变
slice( start[,end] )	剪切数组。包头不包尾，尾巴不写默认到末尾。	返回剪切的数组	不改变
reverse()	倒序操作	倒序的数组	改变
join（separator）	数组变字符串，通过separator链接，默认逗号，separator分隔符。	链接后的字符串	不变
sort（）	数组排序	新数组	改变
concat()	合并两个以上个数组 arr1.concat(arr2,arr2,arr3)	一个新数组	不变

    var a = [1, 4, 3, 2, 5, 6];
    var b = a.sort(function (n1, n2) {
        return n2 - n1;
    });
    console.log(b)   // [6, 5, 4, 3, 2, 1]
    console.log(a)   // [6, 5, 4, 3, 2, 1]
//排序结果由return  结果控制。n1 - n2 升序  n2 - n1 降序 
//排序规则以ASCLL值为准

判断键盘的键值。

.onkey事件

ev.keyCode 获取键值

以下ES5新方法，IE678不兼容

静态方法

Array.isArray() 是否为数组，返回true/false ;

typeof不能判别复合类型，只用于检测基本数据类型，

索引方法

indexOf(keyWord) ，在数组中找到就返回索引值，找不到就返回-1.

遍历方法

//遍历数组 : while/do while/for/for in/forEach()都可以遍历数组

forEach(fn); 与for差别不大，但是比for方便

arr.forEach(function(item, index, arr){
	//item,值
	//index，索引
	//arr，数组，基本用不上的参数
});

可不写全参数，需要哪个写那个。

map(fn) 返回一个数量相等的数组，内容是什么取决在fn中的返回值

//需求：给数组的每一项增加20%
var res1 =  arr4.map(function(item){
	return (item * 1.2).toFixed(2);
});
console.log('res1=' + res1);

//需求：给数组每一项加5
var res2 = arr4.map(function(item){
	return item +5;
});
console.log(('res2=' + res2)

 //用来渲染（low点的渲染）
var res4 = arr3.map(function(item){
	return '<li>' + item +'</li>';
}).join('');
//map返回的是数组，所以需要join('')变成字符串。

//高级点的渲染，用到字符串模板  ``  (tab键盘上一个键，英文输入)
//初始化条件：结构已经写好，数据data也有。
var html = data.map(function(item){
    return `<li data-guid="${item.id}">
                <img src="${item.imgurl}">
                <h4>${item.name}</h4>
                <p class="color">颜色：${item.color}</p>
                <p class="price">原价：
                <del>${item.price}</del>
                </p>
                <p class="price">现价：
                <span>${item.sale}</span>
                </p>
			</li>`;
}).join('');//join的作用就是把数组无缝拼接成字符串，后面就可以直接渲染到页面了
  
//字符串模板可以保持格式的缩进，不需要用+拼接，把需要渲染的地方用  ${} 渲染

filter(fn) 过滤筛选函数

var ages = [32, 33, 16, 40];

function checkAdult(age) {
    return age >= 18;
}

function myFunction() {
    document.getElementById("demo").innerHTML = ages.filter(checkAdult);
}
//32,33,40

some(fn) 相对检测函数，只要fn有一项返回true，结构都返回true
every(fn) 绝对检测函数必须每一项都满足fn中的条件才是true

**数组去重,**可用于同分排名等之前去重

function norepeat(arr){
	var newarr = [];
	arr.forEach(function(item){
		if(newarr.indexOf(item) == -1){
			//没有
			newarr.push(item);
		}
	});
	return newarr;
}

数组排序

冒泡排序：

for (var j = 0; j < arr.length; j++) {
    for (var i = 0; i < arr.length - 1 - j; i++) {
        if (arr[i] > arr[i + 1]) {
            //如果  前面的数  > 后面的数 == 交换位置
            var temp = arr[i];
            arr[i] = arr[i + 1];
            arr[i + 1] = temp;
        }
        num++;  //监控次数
    }
}

外层循环控制趟数，内循环控制比较次数，交换值的思想，有三种优化的方法，arr.length - 1 - j 就是一种，另外一种是在if里面加个旗标监控此次遍历是否有值交换，没有交换证明已经排序好，无需要再冒泡，应停止循环，得出结果。最后一种为效果最好，双向遍历，可冒泡出此躺的最大、最小值。

插入排序：

for (var i = 0; i < arr.length - 1; i++) {//arr[i] = arr[0] 
    minIndex = i;//起始值
    for (var j = i + 1; j < arr.length; j++) {//arr[j] = arr[1]
        if (arr[minIndex] > arr[j]) {
            //如果  前面的值 > 后面的值 == 把后面的值的下标给记录下来
            minIndex = j;
        }
    }
    temp = arr[i];//i = 0
    arr[i] = arr[minIndex];
    arr[minIndex] = temp;
}