3-21JavaScript

最新推荐文章于 2024-10-31 22:54:55 发布

慕醒_mx

最新推荐文章于 2024-10-31 22:54:55 发布

阅读量827

点赞数

分类专栏： javascript 文章标签： javascript

本文链接：https://blog.csdn.net/moran_123/article/details/123674457

版权

javascript 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

3-21JavaScript

数组

数组的基本语法

//创建一个数组(两种)
var arr = new Array();
var arr = [];

//向数组最后一个位置添加元素
arr[arr.length] = 1;

//数组也可以存函数
arr = [function(){alert(1)},function(){alert(2)}];
arr[0]();//调用数组函数

//数组中也可以放数组(二维数组)
arr = [[1,2,3], ["a", "b"]];
console.log(arr[1]);//"'a','b'"

数组函数

push( )

该方法可以向数组的末尾添加一个或多个元素，并返回数组的新的长度
可以将要添加的元素作为方法的参数传递，这样这些元素将会自动添加到数组的末尾

var result = arr.push("hh","ww");
console.log(arr);//"hh","ww"
console.log(result);//2(返回值为数组长度)

pop()

删除最后一个元素
删除的元素为返回值

var result = arr.pop();
console.log(arr);//"hh"
console.log(result);//"ww"(返回值为被删除的元素)

unshift（）

向数组开头添加一个或多个元素
并返回新的数组长度

shift（）

可以删除数组的第一个元素
被删除的元素作为返回值返回

forEach()

forEach( )方法需要一个函数作为参数
像这种函数，由我们创建但是不由我们调用的，我们称为回调函数
数组中有几个元素函数就会执行几次，每次执行时，浏览器会将遍历到的元素，以实参的形式传递进来，我们可以来定义形参，来读取这些内容
浏览器会在回调函数中传递三个参数:

第一个参数，就是当前正在遍历的元素
第二个参数，就是当前正在遍历的元素的索引
第三个参数，就是正在遍历的数组

// forEach()
arr.forEach(function (value,index,obj) {
console.log("valvue -->",value);//当前正在遍历的元素
console.log("index -->",index);//当前正在遍历的元素的索引
console.log("obj -->",obj);//当前正在遍历的数组
 })

控制台输出：

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-0nMNOQty-1647961912082)(C:\Users\陌然\AppData\Roaming\Typora\typora-user-images\image-20220322195045847.png)]$

slice ()

从数组中提取指定元素
不会改变原数组，而是将截取到的元素封装到一个新数组中返回
索引可以传递一一个负值，如果传递一个负值，则从后往前计算（-1 倒数第一个，-2 倒数第二）

var result = arr.slice(1,2);//slice(起始位置索引，结束位置索引)
console.log(result);//"hh"(截取到的元素,不包括结束位置的元素)

//第二个参数可以省略不写，此时会截取从开始索引往后的所有元素
var result = arr.slice(1);
console.log(result);//['hh', 'ww']

splice（）

可以用于删除数组中的指定元素
使用splice( )会影响到原数组，会将指定元素从原数组中删除，并将被删除的元素作为返回值返回

var result = arr.splice(1, 2);splice(起始位置索引，删除数量)
console.log(arr);//['yxyx'](剩余的元素)
console.log(result);//['hh', 'ww']（被删除的元素）

//第三个及以后的参数可以传递一些新的元素，这些元素将会自动插入到开始位置索引前边
arr.splice(1, 1,"la");
console.log(arr);//['yxyx', 'la', 'ww'](剩余的元素,新增的元素自动插入到开始位置索引，即'ww'前边)

concat( )

可以连接两个或多个数组，并将新的数组返回
不影响原数组

var arr2 = ['111','222','333']
var result = arr.concat(arr2);
console.log(arr);//['yxyx', 'hh', 'ww'](不变）
console.log(arr2);//['111','222','333']（不变）
console.log(result);// ['yxyx', 'hh', 'ww', '111', '222', '333']（连接起来了）
var arr3 = ['haha'];
var result =arr.concat(arr2,arr3,'lala');
console.log(result);//['yxyx', 'hh', 'ww', '111', '222', '333', 'haha', 'lala'](也可以链接元素)

join()

该方法可以将数组转换为一个字符串
该方法不会对原数组产生影响，而是将转换后的字符串作为结果返回
在join( )中可以指定个字符串作为参数，这个字符串将会成为数组中元素的连接符,如果不指定连接符，则默认使用","作为连接符

var result = arr.join('haihai');
console.log(result);//yxyxhaihaihhhaihaiww(传入参数为连接符)

reverse ( )

该方法用来反转数组 (前边的去后边，后边的去前边)
该方法会直接修改原数组

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

sort( )

可以用来对数组中的元素进行排序
直接修改原数组,默认会按照Uni code编码进行排序
即使对于纯数字的数组，使用sort( )排序时，也会按照Uni code编码来排序，所以对数字进排序时，可能会得到错误的结果

var arr2  = ['b','c','a','d'];
arr2.sort();
console.log(arr2);//['a', 'b', 'c', 'd']

var arr2 = [1,2,8,5,4,7];
// 自定义回调函数
arr2.sort(function(a,b){
    return a-b;//升序
    return b-a;//降序
        });

ca11( )和app1y()

这两个方法都是函数对象的方法，需要通过函数对象来调用
当对函数调用call( )和apply( )都会调用函数执行
在调用call( )和app1y( )可以将一个对象指定为第一个参数,此时这个对象将会成为函数执行时的thi s
cal1( )方法可以将实参在对象之后依次传递
app1y( )方法需要将实参封装到- 一个数组中统-传递

arguments

在调用函数时，浏览器每次都会传递进两个隐含的参数:
- 1.函数的上下文对象this
- 2.封装实参的对象arguments,arguments是一个类数组对象，也可以通过索引来操作数据，也可以获取长度
- 在调用函数时，我们所传递的实参都会在arguments中保存
- arguments . length可以用来获取实参的长度
我们即使不定义形参，也可以通过arguments来使用实参，只不过比较麻烦
arguments[0]表示第一个实参…
arguments,arguments是一个类数组对象，也可以通过索引来操作数据，也可以获取长度
- 在调用函数时，我们所传递的实参都会在arguments中保存
- arguments . length可以用来获取实参的长度
我们即使不定义形参，也可以通过arguments来使用实参，只不过比较麻烦
arguments[0]表示第一个实参…
它里边有一个属性叫做callee,这个属性对应一个函数对象，就是当前正在指向的函数的对象

3-21 javascript练习：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" href="D:\wpp快好好学习\前端\前端基础\bread.png" type="image/x-icon">
    <title>3-21 javascript练习</title>
    <script>
        //创建一个数组(两种)
        // var arr = new Array();
        var arr = ["yxyx"];

        // //向数组最后一个位置添加元素
        // arr[arr.length] = 1;

        // //数组也可以存函数
        // arr = [function () { alert(1) }, function () { alert(2) }];
        // arr[0]();//调用数组函数

        // //数组中也可以放数组(二维数组)
        // arr = [[1,2,3], ["a", "b"]];
        // console.log(arr[1]);//"'a','b'"

        // push( )
        var result = arr.push("hh", "ww");
        // console.log(arr);
        // console.log(result);

        // pop()
        // var result = arr.pop();
        // console.log(arr);//"hh"
        // console.log(result);


        // // forEach()
        // arr.forEach(function (value,index,obj) {
        //     console.log("valvue -->",value);
        //     console.log("index -->",index);
        //     console.log("obj -->",obj);
        // })

        // slice()
        // var result = arr.slice(1, 2);
        // console.log(result);//"hh"
        // var result = arr.slice(1);
        // console.log(result);//['hh', 'ww']

        // splice()
        // var result = arr.splice(1, 2);
        // console.log(arr);//['yxyx'](剩余的元素)
        // console.log(result);//['hh', 'ww']（被删除的元素）
        // var result = arr.splice(1, 1);
        // console.log(arr);// ['yxyx', 'ww'](剩余的元素)
        // console.log(result);//['hh']（被删除的元素）

        // //第三个及以后的参数可以传递一些新的元素，这些元素将会自动插入到开始位置索引前边
        // arr.splice(1, 1,"la");
        // console.log(arr);//['yxyx', 'la', 'ww'](剩余的元素,新增的元素自动插入到开始位置索引，即'ww'前边)

        // concat( )
        // var arr2 = ['111','222','333']
        // // var result = arr.concat(arr2);
        // // console.log(arr);//['yxyx', 'hh', 'ww'](不变）
        // // console.log(arr2);//['111','222','333']（不变）
        // // console.log(result);// ['yxyx', 'hh', 'ww', '111', '222', '333']（连接起来了）
        // var arr3 = ['haha'];
        // var result = arr.concat(arr2,arr3,'lala');
        // console.log(result);//['yxyx', 'hh', 'ww', '111', '222', '333', 'haha', 'lala'](也可以链接元素)

        // // join
        // var result = arr.join('haihai');
        // console.log(result);//yxyxhaihaihhhaihaiww(传入参数为连接符)

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

        // sort()
        // var arr2  = ['b','c','a','d'];
        // arr2.sort();
        // console.log(arr2);//['a', 'b', 'c', 'd']
        var arr2 = [1,2,8,5,4,7];
        // 自定义回调函数
        arr2.sort(function(a,b){
           return a-b;//升序
           return b-a;//降序
        });
        console.log(arr2);
    </script>
</head>

<body>

</body>

</html>