数组_arr[arr.length]=obj;-CSDN博客

本文链接：https://blog.csdn.net/Aqours/article/details/91866075

数组(Array)

数组简介
- 数组也是一个对象，它和我们普通对象功能类似，也是用来存储一些值的
- 不同的是普通对象是使用字符串作为属性名，而数组是使用数字来作为索引操作元素，索引从0开始
使用构造函数创建数组对象
- var arr=new Array();
获取数组的长度 length
- 可以使用length属性来获取数组的长度(元素的个数) 语法：数组.length
- 对于连续的数组，使用length可以获取到数组的长度 (元素的个数)
- 对于非连续的数组，使用length会获取到数组的最大的索引+1，尽量不要创建非连续的数组
- 修改length
  - 如果修改的length大于原长度，则多出部分会空出来
  - 如果修改的length小于原长度，则多出的元素会被删除
- 使用length向数组的最后一个位置添加元素
  - 语法：数组[数组.length] =值如 arr[arr.length]=30;
使用字面量来创建数组
- var arr=[];
- 使用字面量创建数组时，可以在创建时就指定数组中的元素
  - var arr=[1,2,3,4,5];
使用构造函数创建数组时，也可以同时添加元素，将要添加的元素作为构造函数的参数传递
- 元素之间用逗号(,)隔开 var arr2=new Array(10,20,30);
数组中的元素可以是任意的数据类型
- var arr=["hello",1,true,null,undefined];
数组中的元素也可以是对象
- var obj={name:"雪风"};
  
  arr[arr.length]=obj; //向数组的最后一个元素添加一个对象元素
  
  arr=[{name:"雪风"},{name:"岛风"},{name:"天津风"}];
也可以是一个函数
- arr = [function(){alert(1)},function(){alert(2)}];
数组里还能放数组 – 二维数组
- arr =[[1,2,3],[4,5,6],[7,8,9]];
  
  console.log(arr[1]);

数组的四个方法

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

<script>
      var arr=["时津风","初风","浦风"];
  	var result=arr.push("雪风","天津风","岛风","谷风");
  	console.log(arr);
 </script>

pop()
- 该方法可以删除数组的最后一个元素，并将被删除的元素作为返回值返回

 <script>
        var arr=["时津风","初风","浦风"];
    	var result=arr.push("雪风","天津风","岛风","谷风");
        result=arr.pop();
    			console.log(result);  返回"谷风"
    </script>

unshift()
- 向数组开头添加一个或多个元素，并返回新的数组长度
  
  arr.unshift("舞风","矶风");
  
  向前边插入元素以后，其他的元素索引会依次调整
shift()
- 可以删除数组的第一个元素，并将被删除的元素作为返回值返回
  
  result=arr.shift();
  
  console.log(result); 返回"时津风"

数组的遍历

<script>
      `function Person(name,age){
          this.name=name;
          this.age=age;
     }
      Person.prototype.toString() =function(){
        return "Person[name="+this.name+",age="+this.age+"]"
      };
      var  per1=new  Person("雪风",12);
      var  per2=new  Person("岛风",12);
     var  per3=new  Person("雪风"，12)；
     var  per4=new  Person("谷风"，12)；
      var  per5=new  Person("初风",12);
      //将这些对象放入一个数组
      var perArr=[per1,per2,per3,per4,per5];
      //创建一个函数，可以把perArr中满12的Person提取出来。并封装到一个新的数组中
      function getTwelve(arr){
       //创建一个新的数组
          var newArr=[];
          //遍历arr,获取arr中Person对象
          for(var i=0;i<perArr.length;i++){
              if(perArr[i].age>=12){
                  newArr.push(perArr[i]);
              }
          }
          //将新的数组返回
          return newArr;
      }
  </script>

forEach方法
- 一般我们都是使用for循环去遍历数组，但是还有一个forEach()方法也可以用来遍历数组
- forEach()方法只支持IE8以上的浏览器,IE8及以下的浏览器均不支持该方法，如果需要兼容IE8就不要使用forEach()
  - forEach()方法需要一个函数作为参数
    
    数组中有几个元素函数就会执行几次，每次执行时，浏览器会将遍历到的元素
    
    以实参的形式传递进来，我们可以来定义形参，来读取这些内容
    
    浏览器会在回调函数中传递三个参数
    
    第一个参数，就是当前正在遍历的元素
    
    第二个参数，就是当前正在遍历的元素的索引
    
    第三个参数，就是正在遍历的数组

<script type="text/javascript">
        var arr=["雪风","岛风","天津风","谷风","初风"];
        arr.forEach(function(value,index,obj){//想这种函数，由我们创建但是不由我们调用的，我们称为回调函数
             console.log(value); 
          });
      </script>

call()和apply()

这两个方法都是函数对象的方法，需要通过函数对象来调用

当对函数调用call()和apply()都会调用函数执行

在调用call()和apply()可以将一个对象指定为第一个参数,此时这个对象将会称为函数执行时的this

<script>
      function fun(){
          alert(this);
      }
      fun.apply();
      fun.call();
      fun();//这三个函数效果是一样的  都是调用fun函数
      var obj={
          name:"雪风"，
          sayName:function(){
              alert(this.name);
          }
      };
      var obj2={
          name:"岛风"
      };
      fun.call(obj);
      obj.sayName.apply(obj2); //返回 “岛风"   
  </script>

call()方法可以将实参在对象之后依次传递

 <script>
      function fun(a,b){
          console.log("a="+a);
          console.log("b="+b);
      }
        var obj={
          name:"雪风"，
          sayName:function(){
              alert(this.name);
          }
      };
      var obj2={
          name:"岛风"
      };
      fun.call(obj,2,2); //a=2 b=2
  </script>

apply()方法需要将实参封装到一个数组里统一传递

<script>
      function fun(a,b){
          console.log("a="+a);
          console.log("b="+b);
      }
        var obj={
          name:"雪风"，
          sayName:function(){
              alert(this.name);
          }
      };
      var obj2={
          name:"岛风"
      };
      fun.apply(obj2,[2,3]);
  </script>

this情况总结

以函数形式调用时，this永远都是window
以方法的形式调用时，this是调用方法的对象
以构造函数的形式调用时，this是新创建的那个对象
使用call和apply调用时，this是指定的那个对象

arguments

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

 <script>
          console.log(arguments instanceof Array);//false
          console.log(Array.isArray(arguments));//false
          function fun(){
              console.log(arguments[1]);
              console.log(arguments.callee == fun);//true
          }
          fun("雪风","岛风");
      </script>