JavaScript数组ES5+ES6

数组概念

1,数组是object数据类型的一种,也是一种比较复杂的数据

2.一相当于一个大的空间存储多个小空间

3.数组跟{}定义的对象区别

A.对象{}object的数据是没有顺序的

B.数据中的数据是有顺序的

4.数组是用计算机内存中的一段连续的有顺序的空间,是使用一个变量来表示的

数组的定义

A. var arr = [数据,数据...];

如:

var arr = ['nihao', 'hello', 20]

 console.log(arr);

B.var arr = new Array(数据,数据...)

如:

 var arr = new Array('nihao', 'hello', 20)

    console.log(arr)

注意点:

1.如果使用[]的定义形式,放进一个数字,表示当前数组中只有一个小空间,其中放了这个数字,如果使用new Array(数字),表示当前数组中有(数字)个空的小空间

2.数组的第一个元素的下标永远是0;

3.数组的最后一个元素的下标永远是数组。length-1

4.求数组长度是:数组.length

数组操作

1.获取数组数据:数组.[下标];

  var arr = new Array('nihao', 'hello', 20)

    console.log(arr[0])//  -->    nihao

2.设置数据:数组[下标]=值(如果下标存在的情况下就是修改数据,下标不存在的话就是添加数据,如果给的下标大于当前的数组,就会创建很多个空的小空间)

 var arr = new Array('nihao', 'hello', 20)

    console.log(arr[8] = '我是第八个数据')

    console.log(arr)

3,删除数据:delete 数组[下标]   / /数组 length=值;

console.log(delete arr[3])

    console.log(arr.length = 5)

数组的遍历

循环语法遍历

 var arr = new Array('nihao', 'hello', 20)

    for (var i = 0; i < arr.length; i++) {

        console.log(arr[i])

    }

使用for in也是可以遍历的,但是建议使用i=0;的for循环进行遍历

数组方法

   1.unshift-给数组开头添加一个或多个的元素,返回数组的新长度

 var arr=['a','b','c','d']

var l=arr.unshift('l')

  console.log(l)      //5

2,push--数组结尾的添加一个或多个元素,返回数组的长度

var v = arr.push('m') //数组结尾的添加一个或多个元素,返回数组的长度

  console.log(arr) //返回的数组新长度

 3.数组.pop()删除数组的最后的一个元素,返回的是被删的元素

var dete = arr.pop()删除数组的最后的一个元素,返回的是被删的元素

        console.log(dete)放回的是被删的元素

4.  数组.splice(参1,参2,参3) - 对数组做增、删、改的操作

var arr = ['a','b','c']
// 改 - 参数1:开始下标;参数2:删除的个数;参数3:在删除的位置放上的新的元素 - 可以是多个
arr.splice(1,1,'d') // ['a','d','c']
// 增
arr.splice(1,0,'d') // ['a','d','b','c'] - 删除0个,就是不删除,然后放上新元素
// 删 - 第三个参数可以省略

arr.splice(1,0) // ['a','c']

5.数组.concat()--数组的拼接

var arr = ['a','b','c'];
var brr = ['d','e','f'];
// 将arr和brr合成一个更大的数组
var crr = arr.concat(brr) // ['a','b','c','d','e','f']
// 将一个或多个值和数组合并成一个大数组
var crr = arr.concat(1,2,3)// ['a','b','c',1,2,3]

6.数组.sort()--对数组的排序

var arr = [9,5,3,7,1,6,4,8,2];
arr.sort() // 默认升序
console.log(arr) // [1,2,3,4,5,6,7,8,9]
arr.sort(function(a,b){ // a代表前面的数,b代表后面的数
    return a-b; // 升序 - 如果前面的数-后面的数>0,则交换位置
    return b-a; // 降序 - 如果后面的数-前面的数>0,则交换位置
})

7.数组.reverse() - 数组的反转

var arr = ['a','b','c'];
arr.reverse()
console.log(arr) // ['c','b','a']

8.数组.join() - 将数组中的元素使用指定的连接符连接在一起

var arr = ['a','b','c'];
var str = arr.join('_') // 参数是连接符
console.log(str) // a_b_c

var str = arr.join() // 默认使用逗号连接
console.log(str) // a,b,c

var str = arr.join( ' ')
console.log(str) // abc

9.数组.slice() - 截取数组****************************重点

var arr = ['a','b','c','d','e','f'];
// 将数组中的 'b','c','d'截取出来,组成新的数组
var brr = arr.slice(1,4) // 参数1是开始截取的下标,参数2是截取的结束下标,结果中不包含结束下标对应的元素
console.log(brr) // ['b','c','d']
// 如果省略第2个参数,默认从开始下标截取到数组末尾
var crr = arr.slice(1)
console.log(crr) // ['b','c','d','e','f']

在es5中,数组新增的方法

1.indexOf()--找元素在数组中第一次出现的下标,找到就返回下标,找不到就返回-1

 var arr = ['小米', 'vivo', '华为', '苹果', '小米', 'vivo', '华为', '苹果']

        console.log(arr.indexOf('华为')) //2

2.forEach遍历数组

// 语法:数组.forEach(function(value, index, array){

    // value是每次遍历出来的元素

    // index是每个元素对应的下标

    // array是当前正在遍历的数组

// })

// var arr = ['李小璐', '白百何', '马伊琍', '文章', '贾乃亮', '王宝强', '杨幂']

// 遍历这个数组

// arr.forEach(function(value, index, array) {

//     // console.log(value);

//     // console.log(index);

//     // console.log(array);

// })

// index和array是可选参数,在遍历的时候,这两个参数可加可不加

// arr.forEach(function(value) {

//     console.log(value);

// })

// 这个遍历方法,跟使用for循环遍历效果是一样的,方法内部就封装了for循环,所以这个方法是没有返回值 - undefined

// 如果要在遍历到某个值的时候,停止遍历,只能使用for循环

3.map

 // map: 遍历数组, 将每个元素都经过函数处理, 处理成新的元素, 将所有新的元素组成一个新的数组返回

    // 语法: 数组.map(function (跟forEach的参数是一样的) {

    //     return newValue

    // })

    // 返回所有新元素组成的新数组

例:

 var arr = [10, 20, 30]

    // 让每个元素都增加30%

    var brr = arr.map(function (v) { // 这里的value是形参,我们可以自定义名称

        var newValue = v + v * 0.3

        return newValue

    })

    console.log(brr);

 // filter: 过滤数组 - 遍历数组, 将数组中满足指定条件的元素, 组成新的数组并返回

    // 语法: 数组.fitler(function (跟forEach的参数是一样的) {

    //     return 条件

    // })

    // 返回值: 返回满足条件的所有元素组成的数组

例:

var arr = [85, 90, 68, 45, 93, 21, 58]

    // 将数组中不及格的所有成绩放在新的数组中

    var brr = arr.filter(function (v) {

        return v < 60

    })

    console.log(brr);// [45, 21, 58]

ES6新增方法(重点)

1.some方法

 some-判断数组中是否至少有一个元素是满足条件的,返回的是布尔值

语法

/*数组.some(function(v,i,a) {
return  条件
} )
语法:array.some(function(item,index,array)
    //item:当前元素的值;
    //index:当前元素的索引;
    // array:当前元素的数组对象;
*/
//判定一个数组是否符合某个条件,如果有一项符合返回true,如果一项都不符合,返回false;
 var arr = [100, 500, 9, 80, 76, 88]
    var k = 0
    var bool = arr.some(v => {
        k++
        return v < 60
    })
    console.log(bool);//true
    console.log(k);//6

2.数组.every方法

判断数组中是否所有元素都满足指定条件,返回布尔值

 // every - 判断数组中是否所有元素都满足指定条件,返回布尔值
    /*
    语法:  数组.every(function(v, i, a) {
        return 条件
    })
    判定一个数组是否符合某个条件,如果有一项不符合会立即返回flase不在执行,
如果全都符合,会全遍历一遍数组后返回true;
    */
    var arr = [100, 500, 90, 8, 69, 88]
    // 是否所有成绩都及格了
    var k = 0
    var bool = arr.every(v => {
        k++
        return v > 60
    })
    console.log(bool);//flase
    console.log(k);//4

3.数组.find方法

  // find - 在数组中找满足条件的第一个元素 - 返回找到的元素,找不到就返回undefined
    /*
    语法:
  
    数组.find(function(v, i, a) {
        return 条件
    })
    */
    var arr = [100, 500, 90, 8, 69, 88]
    var ele = arr.find(v => v < 60)
    console.log(ele);//8

4.数组.findindex方法

// findIndex - 在数组中找满足条件的第一个元素的下标 - 返回下标,找不到返回-1
    /*
    语法:
    数组.findIndex(function(v, i, a) {
        return 条件
    })
    */
    var arr = [100, 50, 90, 80, 76, 88]
    // 第一个不及格成绩的下标
    var index = arr.findIndex(v => v < 60)
    console.log(index);

两种排序

1.冒泡排序--相邻两个元素进行比较,将一个数组中的数字使用循环进行升序或降序的排列

 var arr = [1, 56, 2, 234, 5, 6, 82, 10]

for(var j=0;j<arr.length-1;j++){
// 相邻的元素比较,就是下标i的元素跟下标i+1的元素比较 - 所以循环要比正常的遍历少一次
    for(var i=0;i<arr.length;i++){
      // 如果前面的元素比后面的元素大
        if(arr[i]>arr[i+1]){
             //交换位置
        	var tmp = arr[i]
            arr[i] = arr[i+1]
            arr[i+1] = tmp
        }
    }
}
// 如果要降序排序,就将判断条件中的>改为<即可

2选泽排序--降序:先找最大值,排在最左边,再找第二大的值,往左边靠...,已经排好的,不再参与比较

// 重复代码用循环处理,3个数排2次,4个数排3次
for(var j=0;j<arr.length-1;j++){
    for(var i=j+1;i<arr.length;i++){
        if(arr[j]>arr[i]){
        	var tmp = arr[j]
            arr[j] = arr[i] 
            arr[i] = tmp
        }
    }
}
// 如果要进行降序排列,就将判断条件中的>换成<即可

猜你喜欢

转载自blog.csdn.net/weixin_45441470/article/details/123490307