关于Es5 和 Es6的数组 的方法

文档参考js 高级程序设计一书

检测数组

    // 定一个数组
    var arr = [1,2,3,'a','b']
    // 数组的检测方法,判断某个值到底是不是数组,返回一个Boolean

    // 1. Array.isArray()
    console.log(Array.isArray(arr))  // true

    //  2.instanceof
    console.log(arr instanceof Array) //true片

数组转换方法

    var arr = [1,2,3,'a','b']
    // 1. toString() 方法会返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串

    console.log(arr.toString()) // 1,2,3,a,b

    //2. valueOf() 返回的还是数组

    console.log(arr.valueOf()) // [1, 2, 3, "a", "b"]

    //3. toLocaleString() 会返回与 toString() 相同的值
    console.log(arr.toLocaleString())  //1,2,3,a,b

    //4.  join() 方法,则可以使用不同的分隔符来构建这个字符串。

    console.log(arr.join(',')) //1,2,3,a,b

    console.log(arr.join('|')) // 1|2|3|a|b

    // 将 字符串 转化成数组
    let a = "hello"
    let b = a.split(',')
    console.log(b) // ["hello"]

Es5 数组方法总结—向数组添加元素

    // 定一个数组
    var arr = [1,2,3,'a','b']
    let a = 10

    // push() 向数组添加元素

    arr.push(a)
    console.log(arr) // [1, 2, 3, "a", "b", 10]

    // unshift 向数组头部添加元素 

    arr.unshift(a)
    console.log(arr) // [10, 1, 2, 3, "a", "b", 10]

    // 合并两个数组 concat() 合并后组成一个新数组

    var arr2 = [15,12,4]

    let c = arr.concat(arr2)
    console.log(c) // [10, 1, 2, 3, "a", "b", 10, 15, 12, 4]

删除数组元素

    // 定一个数组
    var arr = [1,2,3,'a','b']

    // pop() 删除并返回数组的最后一个元素

    let a = arr.pop() 

    console.log(a) // b

    // shift 删除并返回数组的第一个元素

    let b = arr.shift()

    console.log(b) // 1

数组的排序

        // 定一个数组
        var arr = [1, 2, 3, 'a', 'b']

        // 数组中已经存在两个可以直接用来重排序的方法: 
        // reverse() 和 sort() 
        // reverse() 方法会反转数组

        console.log(arr.reverse()) // ["b", "a", 3, 2, 1]

        // sort() 方法 进行排序 但比较的数据类型却是字符串
        var c = [0, 1, 5, 15]

        console.log(c.sort()) // [0, 1, 15, 5]

        // 上边之所以没有返回正常的大小排序,比较的是字符串

        // 你需要写一个比较函数
        //     比较函数接收两个参数,如果第一个参数应该位于第二个之前则返回一个负数,如果两个参数相等
        // 则返回 0,如果第一个参数应该位于第二个之后则返回一个正数。以下就是一个简单的比较函数
        function compare(value1, value2) {
            if (value1 < value2) {
                return -1;
            } else if (value1 > value2) {
                return 1;
            } else {
                return 0;
            }
        }
        console.log(c.sort(compare)) // [0, 1, 5, 15]

操作数组的方法

        // 定一个数组
        var arr = [1, 2, 3, 'a', 'b']

        // slice() 进行分割数组,返回一个新数组,但不影响原数组的值

        // 若只有一个参数 slice(index) 方法返回从该参数指定位置开始到当前数组末尾的所有项

        console.log(arr.slice(1)) // [2, 3, "a", "b"]

        // 当有两个参数时 slice(a,b)  方法返回起始和结束位置之间的项—但不包括结束位置的项

        console.log(arr.slice(1,4)) // [2, 3, "a"]
        // splice() 方法,最强大的数组方法了。
        //  删除:可以删除任意数量的项,只需指定 2 个参数:要删除的第一项的位置和要删除的项数
        // 比如从位置2(也就是索引为1) 进行删除,删除2两项 ,返回的是删除元素后的新数组
        console.log(arr.splice(1,2)) //[2,3]

查找数组元素的位置

        // 定一个数组
        var arr = [1, 2, 3, 'a', 'b']

        // 位置方法: indexOf() 和 lastIndexOf() 返回查询的元素的位置,如果查询到则 返回位置(索引),没有找到返回-1, 
        //indexOf() 方法从数组的开头(位置 0)开始向后查找, lastIndexOf() 方法则从数组的末尾开始向前查找。

        console.log(arr.indexOf(1)) //0
        console.log(arr.indexOf(2)) //1  
        console.log(arr.indexOf(0))  // -1 找不到这个元素 返回-1

        console.log(arr.lastIndexOf(3)) // 2
        console.log(arr.lastIndexOf(0)) // -1 找不到返回-1

数组遍历

        // 定一个数组 Es5的方法
        var arr = [1, 2, 3, 'a', 'b']

        // 数组的迭代方法(遍历数组)以下方法都有返回值
          // 每个方法都可以传入3个参数(数组项的值、该项在数组中的位置和数组对象本身)
        /*
         every() :对数组中的每一项运行给定函数,如果该函数对每一项都返回 true ,则返回 true 。
         filter() :对数组中的每一项运行给定函数,返回该函数会返回 true 的项组成的数组。
         forEach() :对数组中的每一项运行给定函数。这个方法没有返回值。
         map() :对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组。
         some() :对数组中的每一项运行给定函数,如果该函数对任一项返回 true ,则返回 true 。
        以上方法都不会修改数组中的包含的值
        */
        let a = arr.every(function(a,b,c){
            return a > 2
        })
        console.log(a) // false  因为不是所有的元素都满足 > 2 

        let b = arr.some(function(a,b,c){
            return a > 2
        }) 
        console.log(b)  // true  因为有某一个元素满足 > 2 的条件 

        let c = arr.filter(function(a,b,c){
            return a > 2
        }) 
        console.log(c) // [3]  这里过滤掉不满足大于2的条件的元素,只返回满足条件的元素

        //  forEach() 因为该方法没有返回值,所以打印遍历的数据
        arr.forEach(function(a,b,c){
            console.log(a) // [1, 2, 3, "a", "b"]
            console.log(b) //a 中的每一个元素
            console.log(c)  // 索引
        }) 

数组 for in 和 for of 遍历

        // 定一个数组
        var arr = [1, 2, 3, 'a', 'b']

        var obj = {name:"你好",age:12}
        // for in 遍历 对象
       for (const key in obj) {
          console.log(key) // name age 索引
          console.log(obj[key]) // 值
       }
       // 遍历数组
       for (const k in arr) {
           console.log(k) // 索引
       }

        //Es6中的for of 直接得到数组中的值和索引
        for (let (a,index) of arr) {
            console.log(a) // 
        }

猜你喜欢

转载自blog.csdn.net/qq_36407748/article/details/80216683
今日推荐