原生JS中数组常见的方法

JavaScript013

原生JS中数组常见的方法,第1张

1.

shift()：删除数组中第一个元素，并将长度减1，下面举例：

var arr = ['王思聪', '孙一宁', '刘强东', '奶茶', '签字哥', '都美竹']

 var res = arr.shift()

console.log(res)  //打印出来返回值是被删除的数组元素

2.

 pop():删除数组中最后一个元素，并将长度减1,下面举例：

var arr = ['王思聪', '孙一宁', '刘强东', '奶茶', '签字哥', '都美竹']

 var res = arr.pop()

console.log(res) //打印出来返回值是删除的数组元素

3.

unshift():往数组前面添加一个或多个数组元素，长度要改变，下面举例：

var res = arr.unshift('张姨', 18)

  console.log(res)

   console.log(arr) // 返回值是增加后数组的长度

4.

push():往数组结尾添加一个或多个数组元素，长度要改变

var res = arr.push('随便', '哈哈')

console.log(arr)

console.log(res)

5.

为了更好的代入，下面我们来看一个综合的列子：

var arr = [0, 1, 'a', 0, 66, 0, 0]

要求将数组中的0项去掉，将不为0的值存入一个新的数组，生成新的数组

声明一个新的数组

var newArr = []

遍历

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

            //把0的数组元素删除掉

            if(arr[i]==0){

                continue

            }

            //把这些数据添加到新的数组

            newArr.push(arr[i])

        }

        console.log(newArr)  //最后输出查看结果

6.

concat() : 方法用于连接两个或多个数组, 不改变原数组。返回一个新的数组

var arrName1 = ['签字哥', '李某迪', '波哥', '王思聪']

var arrName2 = ['马云', '马化腾', '王健林', '卢本伟']

var newData = arrName1.concat(arrName2)

console.log(newData)

7.

reverse()  逆向排序, 原数组也被逆向排序了（倒置）

var numArr = [10, 9, 8, 7, 6, 5, 11]

var res = numArr.reverse()

console.log(res)

console.log(numArr)

8.

toString()  将数组转成字符串，推荐使用

var numArr = [10, 9, 8, 7, 6, 5, 11]

toString()属于一个对象的方法

var res = numArr.toString()

console.log(res)

String它是强制数据类型转换的方法，它不属于数组这个对象

9.

join(“拼接符”)将数组转成字符串，中间以拼接符连接

var numArr = [10, 9, 8, 7, 6, 5, 11]

var res = numArr.join('&')

console.log(res)

10.

  slice(start,end):  不修改原数组, 将原数组中的指定区域数据提取出来。start开始 end结束。

            如果参数是负值表示从倒数开始。不含结束位置

                                   0         1        2(不包含结束位置)

 var arrName = ['签字哥', '李某迪', '波哥', '王思聪']

var res = arrName.slice(0, 2)

 console.log(res)

11.

splice

            删除：用于删除元素，两个参数，第一个参数（要删除第一项的位置），第二个参数（要删除的项数）

            插入：向数组指定位置插入任意项元素。三个参数，第一个参数（开始位置），第二个参数（0），第三个参数（插入的项）

            注意点：第二个参数（0）为0不会删除任何项

            替换：向数组指定位置插入任意项元素，同时删除任意数量的项，三个参数。第一个参数（起始位置），第二个参数（删除的项数），第三个参数（插入任意数量的项）

 var arrName = ['签字哥', '李某迪', '波哥', '王思聪']

       //删除

        //var res = arrName.splice(0, 3)

        //返回值是被删除的数组元素

        //console.log(res)

        //插入

        // arrName.splice(0, 0, '嘿嘿', '哈哈')

        // console.log(arrName)

       //替换

        arrName.splice(0, 2, '都美竹', 'hello')

        console.log(arrName)

方法一：

使用DOM.setAttribute("class","类名")

方法二：

DOM.classList.add("类名")

方法一给DOM元素添加类名会覆盖原有的类名

方法二 可以给DOM元素添加一个类名后 还可以在继续给DOM元素添加新的类名 并且不会覆盖已有的类名

概念：把要添加的节点添加到指定父级里面的最后面，所以也叫追加。

使用方式：fatherdom.appendChild( insertdom )。

兼容性：所有浏览器都支持此方法。

概念：把要插入的节点添加到指定父级里面的指定节点之前。

使用方式：fatherdom.insertBefore( insertdom，chosendom )。

兼容性：所有浏览器都支持此方法，但是值得注意的是，如果第二个参数节点不存在，在IE和Safari下会把要添加的节点使用appendChild()方法追加到指定父级中，而其他主流浏览器（Firefox、Chrome、Opera等）下会报错，所以在插入节点的时候，需要先判断第二个参数节点是否存在

效果

注意：很多人都认为设置disabled="true"是为启用，设置为“false”时为禁用，这是错的。