【JS】几种常用的弹窗

JavaScript034

【JS】几种常用的弹窗,第1张

原生JS 有3种最常用的弹窗方式

最最最常用的是 alert()

alert 引发的弹窗，只有一个“确定”按钮。

alert( 内容 )

内容可以是变量，可以是字符串。

字符串需要用单引号或者双引号括起来。

需要注意的是，内容如果是 html 标签，是会直接输出字符串的。

如果需要换行，需要用到 html 的转义字符。

alert 无法直接展示 object。

confirm 对比 alert，会多出一个“取消”按钮。

而且 confirm 有一个回调值。

如果点击了“确定”，返回值为：true

如果点击了“取消”，返回值为：false

prompt 的比 confirm 多一个输入框。

同样，prompt 也是有返回值的。

如果按了确定，返回值是 输入的内容，字符串型。

如果按了取消，返回值是：null。

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)