JS学习心得1（数组操作）

最新推荐文章于 2022-05-13 20:36:56 发布

Coni_yew

最新推荐文章于 2022-05-13 20:36:56 发布

阅读量307

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/Coni_yew/article/details/109837426

版权

函数部分

1.arguments

在调用函数时，浏览器每次都会传递进两个隐含的参数：

1.函数的上下文对象this

2.封装实参的对象arguments

-arguments是一个类数组对象，他也可以通过索引来操作数据，也可以获取长度

-在调用函数时，我们所传递的实参都会在arguments中保存

-arguments.length可以用来获取实参的长度

-我们即使补丁已形参，也可以通过arguments来使用实参，其中arguments[0]表示第一个实参。

-arguments里面还有一个函数对象callee，这个对象指的就是当前正在指向的函数的对象。

如果在写入一个函数时，不确定函数有几个参数，则可以通过arguments来实现函数。

这主要是因为每个函数的内部都设置有一个arguments数组，在调用该函数的时候，arguments会开辟一些列内存，根据输入参数的顺序将将参数依次存入该数组。

例如

function sum(){
    var sum=0;
    for(var i=0;i<arguments.length;i++){
        sum+=arguments[i];}
     alert(sum)}
sum(3,4,5,6);

输出结果是18。

2、递归函数

写递归函数的方法：

1、首先找出临界值，即无需计算就可以获得的值；

2、找出这一次结果和上一次结果的关系

3、假设当前结果已经可以使用，调用自身计算上一次的运行结果，再写出这次的运行结果。

递归特点：

1、必须有参数

2、必须有return

【注】只要是循环可以实现的，，递归都可以实现，但是由于递归会在短时间内存剧增，所以一般不推荐使用。

function print(n){
        if(n==0){
            return;
        }
        document.write("hello world!<br />");
        return print(n-1);
    }
    print(10);

输出结果为：

3、数组

数组中的元素可以是任意类型的数据，包括对象，数组，以及基本类型数据

创建数组的三种方式

1、var arr=new Array(1,2,3,3);

2、var arr= Array(1,2,3,3);

3、var arr=[1,2,3,3];

数组遍历

1、for循环

2、for [元素下标] in 数组格式

例：

arr=[1,2,3,4,4]
    for (var i in arr){
        document.write(arr[i]+"<br />");

输出结果为：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
<script type="text/javascript">
    function Person (name,age){
        this.name=name;
        this.age=age;
    }
    var per1= new Person("蜘蛛精",25);
    var per2= new Person("孙悟空",8);
    var per3= new Person("猪八戒",25);
    Person.prototype.toString= function fun(){
        return "["+this.name+" "+this.age+"]";
    }
    var arr=[per1,per2,per3];
    
    function findAdult(){
        var arr2=[];
        for (var i=0;i<arr.length;i++){
            if(arr[i].age>18){
                arr2.push(arr[i]);
            }
        }
        return arr2;
    }
    var arr2=findAdult();
    for (var i=0;i<arr2.length;i++){
        document.write(arr2[i]+" ");
    }

</script>
</head>
<body>
    
</body>
</html>

1、栈方法（先进后出）

插入元素：arr.push()从数组的尾部插入元素，参数个数随意（为插入元素的值），返回值为插入元素之后数组的个数

删除元素：arr.pop()从数组的尾部删除最后元素，没有参数，返回值为删除元素的值。

2、队列方法（先进后出）

插入元素：1、arr.push()从数组的尾部插入元素，参数个数随意（为插入元素的值），返回值为插入元素之后数组的个数

2、arr.unshift()从数组的头部插入元素

例：

var arr=new Array(1,2,3,4,4)
    var res= arr.unshift("你好")
    for (var i in arr){
        document.write(arr[i]+"<br />");
    }

输出结果为：

删除元素：arr.shift()从数组的头部删除最后元素，没有参数，返回值为删除元素的值。

3数组操作函数

1、数组合并：concat（）函数，将两个数据合并成一个新数组，原来的两个数组不发生改变。

2、获取数组制定区域元素：slice（start，end）函数，返回值为第start个到第（end-1）个的元素。并且不改变原数组

3、splice（操作开始的下标，操作的元素个数，插入（替换）元素）；可以完成删除，插入，替换操作，该函数会改变原数组。

3.1splice（）完成删除操作是返回的是被操作的元素

例：

var arr=new Array(1,2,3,4,4)
    var res= arr.splice(1,2)
    document.write("res:  "+res+"<br />");
    for (var i in arr){
        document.write(arr[i]+"<br />");
    }

3.2splice完成插入操作，返回值为空，因为在这个过程中并没有截取到元素；

例

var arr=new Array(1,2,3,4,4)
    var res= arr.splice(1,0,"hello")
    document.write("res:  "+res+"<br />");
    for (var i in arr){
        document.write(arr[i]+"<br />");
    }

3.3splice完成替换操作，返回值为截取到的元素

var arr=new Array(1,2,3,4,4)
    var res= arr.splice(1,1,"hello")
    document.write("res:  "+res+"<br />");
    for (var i in arr){
        document.write(arr[i]+"<br />");
    }

3.4使用splice给数组去重（注意删除元素之后，该元素后面的元素会迁移至被删除元素的位置）

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
<script type="text/javascript">
    var a=[1,2,2,3,4,1,3,4];
    for (var i=0;i<a.length-1;i++){
        for (var j=i+1;j<a.length;j++){
            if(a[i]==a[j]){
                a.splice(j,1);
                //因为删除元素之后，该元素后面的元素会自动往前，所以为了避免两个重复元素在一起是无法删除的现象，需要对该位置的元素在进行一次检查。
                j--;
            }
        }
    }
    console.log(a.length);
  
    for (var i=0;i<a.length;i++){
        document.write(a[i]+" ");
    }
   
</script>
</head>
<body>
    
</body>
</html>

迭代方法，这些方法都需要一个函数作为参数，并在回调函数中上传三个参数，分为是当前正在遍历的元素，索引以及数组本身

1.every（），对数组中的每一项运行给定函数，如果该函数对每一项都返回true，则返回true

2.some（），对数组中的每一项运行给定函数，如果该函数中的某一项返回true，则返回true；

3.filter（），对数组中的每一项运行给定函数，返回的是满足给定函数的数组；

4.map（），对数组中的每一项运行给定函数，返回的每次函数调用的结果组成的数组；

forEach方法，对数组中的每一项运行给定函数，无返回值

该方法需要一个函数作为参数

-像这种由我们创建但是不由我们调用的函数，称为回调函数；

-数组中有几个元素，函数就会执行几次；每次执行时，浏览器会将遍历到的元素以实参的形式传递进来，我们可以通过定义形参，来读取这些内容。

-浏览器会在回调函数中传递三个参数，分为是当前正在遍历的元素，索引以及数组本身

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
<script type="text/javascript">
    var arr=["唐僧","孙悟空","猪八戒","沙和尚"];
    arr.forEach(function(value, index, array) {
        document.write("value="+value+", index="+index+", array="+array+"</br>");
        
    });

</script>
</head>
<body>
    
</body>
</html>

输出结果为：

可以看到回调函数执行了4次，这是因为数组里面有4个元素。

系统自带的两个数组排序算法

1、reverse（）函数

该函数的作用是逆序输出数组

2、sort（）函数

该函数的作用是按照升序输出数组，但是由于该函数默认将数组元素看做是字符串，所以是从左往右比较每一个字符串的SCII值。

比如

var arr=new Array(10,1,5,15)
    arr.sort();
    for (var i in arr){
        document.write(arr[i]+"<br />");
    }

输出结果为：

所以使用sort进行排序时，我们可以给sort函数添加一个函数参数实现。

<!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">
    <title>Document</title>
</head>
<body>
    <script>
        var arr=[1,4,5,13,12,56,3];
        arr.sort(com);
        function com(value1,value2){
            return value2-value1;
        }
// 使用sort进行排序时，如果不需要交换两个数的位置则返回大于0的数，交换数字则返回小于0的数。
        
        alert(arr);
    </script>
</body>
</html>

冒泡排序

var arr=[6,5,4,3,2];
    for (var i=0;i<arr.length;i++){
        for(var j=0;j<arr.length-i-1;j++){
            if(arr[j]>arr[j+1]){
                var temp= arr[j];
                arr[j]=arr[j+1];
                arr[j+1]=temp;
            }
        }
    }
    alert(arr);

输出结果：

选择排序

var a=[5,3,2,4,6];
    for(var i=0;i<a.length-1;i++){
        for(var j=i+1;j<a.length;j++){
            if(a[i]>a[j]){
                var temp=a[i];
                a[i]=a[j];
                a[j]=temp
            }
        }
    }
    alert(a);

输出结果

作用域

对于基本数据类型，某个函数的局部变量或形参，在该函数被调用完成之后就会被销毁，也就是函数调用结束之后并不会对全局的变量产生影响，这主要是因为每个函数会给每个变量分配一个固定的内存空间。

例

var a=5;
    function show(a){
        a=10;
        document.write("调用show函数a="+a+"<br\>");
    
    }
    document.write("调用show函数之前a="+a+"<br\>");
    show(a);
    document.write("调用show函数之后a="+a+"<br\>");

而数组变量则不会被销毁，并且会对传入的参数产生影响。这是因为数组是符复合数据类型/引用数据类型，并不直接存储在函数内部，而是存储在堆段。在堆段，需要多少内存就可以随时分配多少内存。而所有的引用数据类型存储的都是该数据在堆段中的地址。所以传给函数的也是地址，而函数找到堆段中的数据后，对数据进行了修改，所以以后再引用这个地址找到的数据就是修改之后的数据了。

例

var a=[3,4];
    function show(a){
        a.push(10,20)
        document.write("调用show函数a="+a+"<br\>");
    
    }
    document.write("调用show函数之前a="+a+"<br\>");
    show(a);
    document.write("调用show函数之后a="+a+"<br\>");
    </script>

Coni_yew

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS学习心得1（数组操作）

函数部分1.arguments如果在写入一个函数时，不确定函数有几个参数，则可以通过arguments来实现函数。这主要是因为每个函数的内部都设置有一个arguments数组，在调用该函数的时候，arguments会开辟一些列内存，根据输入参数的顺序将将参数依次存入该数组。例如function sum(){ var sum=0; for(var i=0;i<arguments.length;i++){ sum+=arguments[i];}...
复制链接

扫一扫