精华内容
下载资源
问答
  • js数组函数对象

    2021-03-05 00:32:11
    JS : JavaScript 1.1 是什么 所谓数组,就是将多个元素(通常是同一类型)按一定顺序排列放到一个集合中,那么这个集合我们就称之为数组数组是一个有序的列表,可以在数组中存放任意的数据,并且数组的长度可以...

    Day37 数组、函数、对象

    1. 数组
      JS : JavaScript
      1.1 是什么
      所谓数组,就是将多个元素(通常是同一类型)按一定顺序排列放到一个集合中,那么这个集合我们就称之为数组。
      数组是一个有序的列表,可以在数组中存放任意的数据,并且数组的长度可以动态的调整。
      1.2 数组声明
      在这里插入图片描述

    1.3 获取数据
    数组的取值
    [0]是数组中的第一个元素。[1] 是第二个。数组索引从 0 开始
    在这里插入图片描述

    1.4 数组遍历
    在这里插入图片描述

    1.5 添加和更改

    在这里插入图片描述
    在这里插入图片描述

    在这里插入图片描述

    1.6 删除

    在这里插入图片描述

    在这里插入图片描述

    1. 函数
      2.1 是什么
      把一段相对独立的具有特定功能的代码块封装起来,形成一个独立实体,就是函数。
      起个名字(函数名),在后续开发中可以反复调用。
      函数的作用就是封装一段代码,将来可以重复使用。
      2.2 语法
      在这里插入图片描述

    函数定义好后,函数体并不会执行,只要当函数被调用的时候才会执行。函数一般都用来干一件事情,需用使用动词+名词,表示做一件事情tellStory sayHello等。

    在这里插入图片描述
    在这里插入图片描述

    2.3 参数
    在这里插入图片描述

    1. 形式参数:在声明一个函数的时候,为了函数的功能更加灵活,有些值是固定不了的,对于这些固定不了的值。我们可以给函数设置参数。这个参数没有具体的值,仅仅起到一个占位置的作用,我们通常称之为形式参数,也叫形参。
    2. 实际参数:如果函数在声明时,设置了形参,那么在函数调用的时候就需要传入对应的参数,我们把传入的参数叫做实际参数,也叫实参。

    在这里插入图片描述

    在这里插入图片描述

    2.4 返回值
    当函数执行完的时候,并不是所有时候都要把结果打印。我们期望函数给我一些反馈(比如计算的结果返回进行后续的运算),这个时候可以让函数返回一些东西,也就是返回值。函数通过return返回一个返回值。

    在这里插入图片描述

    1、如果函数没有显示的使用 return语句 ,那么函数有默认的返回值:undefined
    2、如果函数使用 return语句,那么跟再return后面的值,就成了函数的返回值
    3、如果函数使用 return语句,但是return后面没有任何值,那么函数的返回值也是:undefined
    4、函数使用return语句后,这个函数会在执行完 return 语句之后停止并立即退出,也就是说return后面的所有其他代码都不会再执行。
    推荐的做法是要么让函数始终都返回一个值,要么永远都不要返回值。

    2.5 内置对象
    JavaScript中,arguments对象是比较特别的一个对象,实际上是当前函数的一个内置属性。也就是说所有函数都内置了一个arguments对象,arguments对象中存储了传递的所有的实参。arguments是一个伪数组,因此也可以进行遍历。
    arguments数组中前几个元素是函数的参数
    callee属性:函数的本身
    callee.name:函数的名字
    length属性:实参的个数
    callee.length:形参的个数

    在这里插入图片描述
    在这里插入图片描述

    2.6 匿名函数
    没有名字 不能重复使用
    在这里插入图片描述

    a中的局部变量在a函数中相当于全局变量

    a()()第一个写方法 第二个调用

    在这里插入图片描述

    在这里插入图片描述

    //局部变量num只能在function这个方法中使用,如果想让a方法能够调用,就把a方法放到这个匿名方法里,
    然后return返回这个a方法,如此就能从外界调用a方法并且a方法也能够调用x这个变量

    在这里插入图片描述

    最后的括号就是执行调用

    	第一个括号是方法声明 第二个括号是调用
        有名字 用名字()调用 没名字 用对象 用引用()调用
        (function (形参列表) {
    
        })(实参列表);
    
        (function xx() {
    
        })
        xx();
    

    2.6.1 闭包
    JavaScript 变量属于本地或全局作用域。
    全局变量能够通过闭包实现局部(私有)。

    什么是闭包?
    官方”的解释是:闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分。
    相信很少有人能直接看懂这句话,因为他描述的太学术。其实这句话通俗的来说就是:JavaScript中所有的function都是一个闭包。
    不过一般来说,嵌套的function所产生的闭包更为强大,也是大部分时候我们所谓的“闭包”。看下面这段代码:
    在这里插入图片描述

    这段代码有两个特点:
    1、函数b嵌套在函数a内部;
    2、函数a返回函数b。

    这样在执行完var c=a()后,变量c实际上是指向了函数b,再执行c()后就会弹出一个窗口显示i的值(第一次为1)。
    这段代码其实就创建了一个闭包,为什么?因为函数a外的变量c引用了函数a内的函数b,就是说:
      当函数a的内部函数b被函数a外的一个变量引用的时候,就创建了一个闭包。
    好处:
    变量可以长期驻扎在内存中
    避免全局变量的污染,有私有成员

    2.7 回调函数
    Js中函数也是数据类型Function,是引用类型,所以函数的参数列表中也是可以传递函数的
    在这里插入图片描述

    1. 预解析
      3.1 概述

    JavaScript引擎在对JavaScript代码进行解释执行之前,会对JavaScript代码进行预解析,在预解析阶段,会将以关键字var和function开头的语句块提前进行处理。
    关键问题是怎么处理呢?
    当变量和函数的声明处在作用域比较靠后的位置的时候,变量和函数的声明会被提升到作用域的开头。
    3.2 方法提升
    在这里插入图片描述

    3.3 变量提升
    在这里插入图片描述

    所以变量的提升只是声明的提升

    在这里插入图片描述

    3.4 变量和函数同名
    如果变量和函数同名,则变量不会进行预解析

    在这里插入图片描述
    在这里插入图片描述

    函数预解析提升到前面
    当出现变量声明和函数同名的时候,只会对函数声明进行提升,变量会被忽略。

    再来看一种
    var num = 1;
    function num () {
    alert( num );
    }
    num();
    代码执行结果为:
    Uncaught TypeError: num is not a function
    按照常规的书写顺序,同名的函数与变量,变量会覆盖函数
    直接上预解析后的代码:
    function num(){
    alert(num);
    }
    var num = 1;
    num(); //报错 因为此时num就是1了

    3.5 预解析是分作用域的
    预解析并不是把所有的变量和函数都提升到window(全局)中去,而是提升到对应的作用域的最前面

    在这里插入图片描述

    1. 作用域

    4.1 全局作用域
    直接编写在 script 标签之中的JS代码,都是全局作用域;
      或者是一个单独的 JS 文件中的。
      全局作用域在页面打开时创建,页面关闭时销毁;
      在全局作用域中有一个全局对象 window(代表的是一个浏览器的窗口,由浏览器创建),可以直接使用。
    所有创建的变量都会作为 window 对象的属性保存。
    在这里插入图片描述

    所有创建的函数也都会保存到window中

    在这里插入图片描述

    在这里插入图片描述
    在这里插入图片描述

    在这里插入图片描述

    4.2 局部作用域
    在函数内部就是局部作用域,这个代码的名字只在函数的内部起作用
      调用函数时创建函数作用域,函数执行完毕之后,函数作用域销毁;
    每调用一次函数就会创建一个新的函数作用域,它们之间是相互独立的。
    将这样的所有的作用域列出来,可以有一个结构: 函数内指向函数外的链式结构。就称作作用域链。

    参数列表中的变量也是局部变量

    在这里插入图片描述

    在这里插入图片描述

    调用的时候,先在当前作用域中找对应的变量/函数,如果当前作用域中有,就是使用当前作用域中的
    如果当前作用域中没有,则去上级作用域中找,一直找到window如果还没有,就报错

    4.3 隐式全局
    声明变量使用var, 如果不使用var声明的变量就是全局变量( 禁用 )
    因为在任何代码结构中都可以使用该语法. 那么再代码维护的时候会有问题. 所以除非特殊原因不要这么用.

    ![在这里插入图片描述](https://img-blog.csdnimg.cn/20210305003546985.png)
    

    在这里插入图片描述
    在这里插入图片描述

    展开全文
  • 今天开发遇到一个问题,js 循环外定义一个对象 然后数组内循环push, 数组对象被覆盖,(没想到我自己也会犯这种粗心错误,太丢人了,话不多说直接上干货) 原因分析: 每次取出来的值都放在了b中,因为是...

    项目场景:

    js写一个循环赋值,结果写了一个bug,我还找了半天,自己被自己蠢哭了。

     


    问题描述:

    今天开发遇到一个问题,js 循环外定义一个对象 然后数组内循环push, 数组内对象被覆盖,(没想到我自己也会犯这种粗心错误,太丢人了,话不多说直接上干货)

     

    原因分析:

    每次取出来的值都放在了b中,因为是在外面定义的对象,所以b的地址是一样的,arr中保存的是b的地址,当最后一次给b赋值的时候,由于是同一个b(对象),所以最后一次给b.value赋值的后会把之前的值覆盖掉。

    有兴趣的朋友可以去了解一下js的栈和堆,这样就明白了,下一期我简单写一下栈和堆,有兴趣的可以看看

    废话不多说,直接大白话上干货解决问题。


    解决方案:

    只需要将循环外的对象拿到循环里面,进行赋值然后再push就可以解决这个问题了。

     res.data.forEach(element => {
              let b = {
                key: element.key,
                value: element.value,
                type: false
              }
              that.data.dataList.push(b);
            });

     

    展开全文
  • jsjs数组对象与json之间的转换 在数据传输过程中,json是以文本,即字符串的形式传递的,而JS操作的是JSON对象,所以,JSON对象和JSON字符串之间的相互转换是关键。例如:JSON字符串:var str1 = '{ ...

    数据传输过程中,json是以文本,即字符串的形式传递的,而JS操作的是JSON对象,所以,JSON对象和JSON字符串之间的相互转换是关键。例如:
    JSON字符串:
    var str1 = '{ "name": "cxh", "sex": "man" }';
    JSON对象:
    var str2 = { "name": "cxh", "sex": "man" };


    一、JSON字符串转换为JSON对象

    要使用上面的str1,必须使用下面的方法先转化为JSON对象:

    //由JSON字符串转换为JSON对象

    var obj = eval_r('(' + str + ')');

    或者

    var obj = str.parseJSON(); //由JSON字符串转换为JSON对象

    或者

    var obj = JSON.parse(str); //由JSON字符串转换为JSON对象

    然后,就可以这样读取:

    Alert(obj.name);

    Alert(obj.sex);

    特别注意:如果obj本来就是一个JSON对象,那么使用eval()函数转换后(哪怕是多次转换)还是JSON对象,但是使用parseJSON()函数处理后会有问题(抛出语法异常)。



    二、可以使用toJSONString()或者全局方法JSON.stringify()将JSON对象转化为JSON字符串。

    例如:

    var last=obj.toJSONString(); //将JSON对象转化为JSON字符

    或者

    var last=JSON.stringify(obj); //将JSON对象转化为JSON字符

    alert(last);

    上 面的几个方法中,除了eval_r()函数是js自带的之外,其他的几个方法都来自json.js包。新版本的 JSON 修改了 API,将 JSON.stringify() 和 JSON.parse() 两个方法都注入到了 Javascript 的内建对象里面,前者变成了 Object.toJSONString(),而后者变成了 String.parseJSON()。如果提示找不到toJSONString()和parseJSON()方法,则说明您的json包版本太低。

    实例代码:

      var milasUrlArr=new Array();//新建一个数组
            var subMilasUrlArr=new Array();//新建一个子数组
           $(".innerTable1 tbody tr").each(function(){//遍历表格行
               $(this).find("input").each(function(){
             subMilasUrlArr.push($(this).val());//获取每行中的每个表格input数据,并存入子数组
              })
              milasUrlArr.push(subMilasUrlArr);//将子数组数据存进父数组
           });
           var milasUrl={};
           for(var item in milasUrlArr){
          milasUrl[item]= milasUrlArr[item];   //这样循环就可以将milasUrlArr数组中的属性包括方法copy到milasUrl对象中了
           }

          alert(JSON.stringify(milasUrl));

    posted on 2016-12-20 18:52  coder经济 阅读( ...) 评论( ...) 编辑 收藏

    转载于:https://www.cnblogs.com/coder-economy/p/6203864.html

    展开全文
  • 数组就是一组数据的有序集合,每个数据叫做一个元素,而每个元素在数组中有一个位置,以数字表示,称为索引。 对于每一门编程语言来说数组都是重要的数据结构之一,不同语言对数组的实现及处理也不尽相同。

    数组就是一组数据的有序集合,它用一组连续的内存空间,来存储一组数据,数组中的一个数据叫做元素,每个元素在数组中的位置称为索引或下标,数组的起始元素索引默认是0。

    对于每一门编程语言来说数组都是重要的数据结构之一,数据结构是计算机存储、组织数据的方式,是相互之间存在一种或多种特定关系的数据元素的集合。
    数组作为数据结构,需要了解其增加、修改、删除、遍历、排序等方法。

    如何创建数组

    • 隐式创建(采用数组字面量方式创建)
      var arr=[值1,值2…]
    • 直接实例化
      var arr1=new Array(值1,值2…)
      var arr2=new Array(length)
      PS:通过new Array()构造一个数组时,传入一个参数表示构造一个这样长度的空数组,多个参数表示构造一个含这些元素的数组。
    //采用数组字面量方式创建
      var arr1=[1,'a'];
      var arr2=[];
      arr2[0]=1;  //通过下标添加元素
      arr2[1]='a';  //通过下标添加元素
      //调用构造函数Array()创建数组
      var arr3=new Array(1,'a');
      var arr4=new Array(2);   //只有一个参数时,代表数组的长度
      console.log(arr1,arr2,arr3,arr4);  //[1, "a"] [1, "a"] [1, "a"] [empty × 2]
    

    JS中数组的特点

    • 在JS中数组可以同时存储不同类型的值
    • 定义时可以无需指定数组长度
    • 数组中的元素之间可以有空隙(稀疏数组),并不强制要求数组元素是紧密相连的
    • JS中数组是个对象,数组的索引可以使用字符串作为下标,使用文本下标的元素不会被记入数组的length属性

    数组的成员和length属性

    每个数组都有一个length属性,其值是数组成员的最大的索引加一,对于紧密数组length属性能够代表数组的成员数。而稀疏数组中length属性不能真实的代表数组的成员数。

      var arr1=[1,'a'];   //2个成员
      var arr2=[];
      arr2[3]=1;          //1个成员
      var arr3=[];
      arr3['title']='标题';   //1个成员,使用字符串作为下标定义数组元素,不能通过索引访问
      console.log(arr1.length,arr2.length,arr3.length)    //2  4  0
    

    多维数组

    二维数组:数组内每一个元素都是一个一维数组
    三维数组:数组内每一个元素都是一个二维数组
    以此类推…

     var arr1=[1,2,3];
     //二维数组
     var arr2=[['a','b','c'],arr1];
     //三维数组
     var arr3 = [
       [
         [1, 2, 3], ['a', 'b', 'c']
       ],
       arr2,
     ];
     console.log(arr1,arr2,arr3);   [1, 2, 3]  [Array(3), Array(3)] [Array(2), Array(2)]
    

    数组的读写

    通过下标(索引)可以读取和修改数组中的元素

    var arr=[1,'a'];
    console.log(arr[0]); //获取了索引为0的元素值
    arr[1]=2;   //修改了索引为1的元素
    console.log(arr);
    

    数组的方法

    在控制台中打印数组的构造函数,结果见下图,可以看到数组的原型上有很多的方法,也就是我们所说的实例方法,对于数组来说主要研究它的实例方法。
    在这里插入图片描述
    这些方法大致可以分为3类
    1、会改变原数组的方法
    2、不会改变原数组的方法
    3、数组的遍历方法

    一)会改变原数组的方法

    1、新增元素 ① push() 和 ② unshift(),返回修改后数组的长度

    var arr=[2];
    arr.push(3);   //向数组末尾添加新的元素,返回值新数组的长度
    arr.unshift(1);  //向数组开头位置添加元素,返回值是新数组的长度
    console.log(arr);   //[1, 2, 3]
    

    2、删除元素 ③pop()和 ④ shift(),没有参数,返回删除的元素

    var arr=[1,2,3];
    arr.pop();   //返回[3] 删除数组最后一项,没有参数,返回值删除项
    console.log(arr);  //[1,2]
    arr.shift();  //返回[1]  删除数组第一项,没有参数,返回值删除项
    console.log(arr);  //[2]
    

    3、⑤splice()实现数组的插入、删除和替换
    arrayObject.splice(index,howmany,item1,…,itemX)

    参数描述
    index必需。整数,规定添加/删除项目的位置
    howmany可选。要删除的元素数量。如果不设置,删除到最后,如果设置为 0,则不会删除项目。
    item1, …, itemX可选。向数组添加的新项目。

    返回值:如果从 arrayObject 中删除了元素,则返回的是含有被删除的元素的数组。

    var arr=[1,2,3,4];
    //删除元素
    arr.splice(1,3);  //[2,3,4] 从索引1开始、删除3个元素,返回被删除的[2,3,4]
    console.log(arr);  //[1]
    //新增元素
    arr.splice(1,0,'a'); //[] 从索引1开始、删除0个元素、把'a'添加到删除的位置
    console.log(arr);   // [1, "a"]
    //替换元素
    arr.splice(1,1,'b');  //[a] 从索引1开始、删除1个元素'a'、把'b'添加到删除的位置
    console.log(arr);   //[1, "b"]
    //清空元素
    arr.splice(0);      //[1, "b"] 从索引0开始,删除所有元素,相当于原数组清空,返回一个和原来一样的新数组
    console.log(arr);   //[]
    

    4、颠倒数组元素 ⑥reverse(),没有参数,返回颠倒后的数组

    var arr=[1,2,3,4];
    arr.reverse();
    console.log(arr);  //[4, 3, 2, 1]
    

    5、对数组元素排序 ⑦ sort() ,参数可选,返回值是排序后的数组。
    默认排序顺序是根据字符串UniCode码。

    var arr1 = [10,1,5,30,3,100];
    var arr2=['w','你','一','a'];
    arr1.sort();  // 默认把数组元素都转化成字符串,进行排序
    console.log(arr1);          //[1, 10, 100, 3, 30, 5]
    arr2.sort();  //["a", "w", "一", "你"],"一"是第一个汉字,UniCode码小于"你"的UniCode码
    console.log(arr2);
    

    sort排序允许接受一个函数作为参数(比较函数),该函数要比较两个值,接受2个形参a,b,并且通过冒泡的方式比较。通过函数的返回值规定排序顺序。
    当返回值为0时,参数的位置不动,当返回值不为0时,火狐浏览器返回值为负数时,a和b代表的元素在数组中的位置不动,为正数值,互换位置;谷歌浏览器则相反,但上面的例子中排序的结果是一样的,这是因为在这两种浏览器中a和b代表的元素是不同的。

     //正序排列
     var arr1 = [10,1,5,30,3,100];
     arr1.sort(function (a,b) {
       return a-b;   
     });
     console.log(arr1);   //[1, 3, 5, 10, 30, 100]
     //降序
     arr1.sort(function (a,b) {
       return b-a;
     });
     console.log(arr1);   //[100, 30, 10, 5, 3, 1]
     //自定义比较函数,本例是按照年龄的升序排列
     var arr2 = [{id:1,age:11},{id:3,age:10},{id:6,age:9}];
     arr2.sort(function(a,b){
       return a.age - b.age;
     })
     console.log(arr2);   //[{id:6,age:9},{id:3,age:10},{id:1,age:11}]
    
    var arr= [2,1,3];
    console.log(arr);
    var i=0;
    arr.sort(function(a,b){
       i++;
       var temp = a-b;
       console.log('第'+i+'次比较'+a+'和'+b,a+'-'+b+'=' +temp);
       return temp;
     });
     console.log('排序结果:'+arr);
    

    在这里插入图片描述

    二)不会改变原数组的方法

    1、concat() 合并两个或多个数组,返回新数组
    参数:可以是任意多个具体的值或数组对象。

    [1,2,3].concat(4,'5',['a','b'])     //[1, 2, 3, 4, "5", "a", "b"]
    [1,2,3].concat([4],['5'],['a','b'])   //[1, 2, 3, 4, "5", "a", "b"]
    

    2、join() 将数组所有元素连接成一个字符串,返回连接后的字符串。
    参数可选。指定要使用的分隔符。如果省略该参数,则使用逗号作为分隔符。

    [1,2,3].join();	//"1,2,3"
    [1,'a'].join('-');  //"1-a"
    

    3、 toString() 将数组所有元素连接成一个字符串,返回用逗号连接的字符串。
    无参数,返回值与没有参数的 join() 方法返回的字符串相同。

    [1,2,3].join();	//"1,2,3"
    [1,2,3].toString();	//"1,2,3"
    

    4、slice(start,end) 在数组中截取从start到end的元素到新数组中,返回新数组
    参数:①开始位置 ②截止位置,可选(不包含该元素),如果参数是负值,代表倒数第n个元素
    PS:数组的slice方法和字符串的slice方法,用法基本相同

    var arr= [1,2,3,4,5];
    console.log(arr.slice(1,3)); //[2,3]  从第2个元素,截止到第4个元素
    console.log(arr.slice(-3,3));  //[3] 从数组倒数第3个元素,截止到第4个元素
    console.log(arr.slice(1)); //[2,3,4,5] 从数组第2个元素到数组结束的所有元素
    

    5、indexOf() 在数组中从前往后查找一个元素,并返回索引,找不到则返回-1
    参数:①要查找的元素 ②开始查找的起始位置,默认从位置0开始查找
    PS:数组的indexOf方法和字符串的indexOf方法,用法基本相同

    var arr= [1,2,3,1,2];
    console.log(arr.indexOf(2));      //1,从前到后找到的第一个2的索引是1
    console.log(arr.indexOf(2,4));    //4,从第5个元素开始查收元素2,找到的元素的索引是4
    console.log(arr.indexOf(4))       //-1,没有到元素4
    

    6、lastIndexOf() 在数组中从后向前查找一个元素,并返回索引,找不到则返回-1
    参数:①要查找的元素 ②开始查找的起始位置,默认从位置0开始查找
    PS:数组的lastIndexOf方法和字符串的lastIndexOf方法,用法基本相同

    var arr= [1,2,3,1,2];
    console.log(arr.lastIndexOf(2))   //4,从后到前找到的第一个2的索引是4
    

    三)数组的遍历方法

    既可以不数组的实例方法遍历数组,也可以用for循环语句遍历数组

    for循环
    • 普通for循环,利用数组下标和length作为循环条件遍历数组。
    let str1='普通for循环';
    var arr=['a','b','c'];
    //普通for循环,利用数组元素的索引和length作为循环条件遍历数组,i是索引,类型是number
    for(var i = 0;i<arr.length;i++) {
      str1+='\n索引:'+i+' 值:'+arr[i];
    }
    console.log(str1);
    

    打印出的结果是:

    普通for循环
    索引:0 值:a
    索引:1 值:b
    索引:2 值:1

    • for of 循环
    let str3='for of循环';
    var arr=['a','b','c'];
    //for…of ES6新增,item实际是元素的值
    for(let item of arr){
      str3+= '值:'+item;
    }
    console.log(str3);
    

    打印出的结果是:

    for of循环
    值:a
    值:b
    值:1

    ES5中的方法
    1、 迭代方法

    ES5中新增了数组的迭代方法,有5个,每个方法都会接受两个参数:(1)要在每一项上运行的函数(2)运行该函数的作用域——this的值(可选)。传入方法中的函数会接受三个参数:(1)当前数组元素的值(2)当前数组元素的索引(可选)(3)数组本身(可选)。

    • forEach(),用来遍历数组中的每一项,并运行给定的函数,但没有返回值,对原数组没有影响
    • map(),用来遍历数组中的每一项,返回在函数中处理过的数组,对原数组没有影响
    • filter(),用来遍历数组中的每一项,返回过滤后的结果数组,对原数组没有影响
    • every(),用来遍历数组中的每一项,对数组中的每一个元素进行比对,结果全部为true,返回true,否则返回false
    • some(),对数组中的元素进行比对,只要有结果为true,返回true,全部为false,返回false

    array.forEach(function(currentValue, index, array), thisValue)
    array.map(function(currentValue, index, array), thisValue)
    array.filter(function(currentValue, index, array), thisValue)
    array.every(function(currentValue, index, array), thisValue)
    array.some(function(currentValue, index, array), thisValue)
    作为参数的函数

    1、forEach()方法

    //forEach方法,遍历数组value是当前元素,index是当前元素索引,arr代表数组本身,一般省略
    //forEach方法不能使用break语句中断循环
    var str4='foreach循环';
    var arr=['a','b','c'];
    arr.forEach(function(value,index,arr){
      str4+='\n下标:'+index+' 类型:'+typeof value+' 值:'+value;
    });
    console.log(str4);
    
    PS:这里的数组遍历是最简单的情况,如果遇到==稀疏数组==和包含==文本下标的数组==for循环的结果可能不是预期的结果。
    由于篇幅所限,详细内容请参考《[js数组遍历-for、for in、for of、 foreach的区别](https://blog.csdn.net/dreamingbaobei3/article/details/101781830)》
    

    2、map()方法
    这个方法不会对原始的数组产生影响(当数组项是引用类型时可能会被改变),而是相当于把原数组克隆一份,把克隆的数组中的对应项改变了。
    map方法中,return的是什么,相当于把原数组的项加工成什么。

    var arr1=[1,2,3,4,5];
    var arr2=arr1.map(function (value,index,arr1) {
      return value*value
    });
    console.log(arr1);  //[1, 2, 3, 4, 5]
    console.log(arr2);  //[1, 4, 9, 16, 25]
    
    var arr1 = [
      { id: 1, age: 11 },
      { id: 8, age: 10 },
    ];
    var arr2=arr1.map(function(item,i){
       item=JSON.parse(JSON.stringify(item));  //如果没有这行代码arr1将同时被改变
       item.children=[];
       return item;
    })
    console.log(arr1) 
    console.log(arr2) 
    

    3、filter()方法
    遍历数组中的每一项,返回过滤后的结果(数组),对原数组没有影响

    var arr1=[1,2,3,4,5];
    var arr2=arr1.filter(function (value,index,arr1) {
      return value>3;
    });
    console.log(arr1);  //[1, 2, 3, 4, 5]
    console.log(arr2);  //[4, 5]
    

    4、 every()方法
    遍历数组中的每一项,对数组中的每一个元素进行比对,结果全部为true,返回true,否则返回false

    var arr1=[1,2,3,4,5];
    var result=arr1.every(function (value,index,arr1) {
      return value>3;
    });
    console.log(arr1);  //[1, 2, 3, 4, 5]
    console.log(result);  //false
    

    5、 some()方法

    var arr1=[1,2,3,4,5];
    var res=arr1.some(function (value,index,arr1) {
      return value>3;
    });
    console.log(arr1);  //[1, 2, 3, 4, 5]
    console.log(res);  //true
    
    2、归并方法

    数组还有两个归并的方法:reduce和reduceRight。归并方法接受一个函数作为累加器,数组中的每个值(从左到右或从右到左)开始缩减,最终为一个值。

    参数是两个,
    ①调用的函数
    该函数又接受4个参数:上一次迭代的值,当前值,项索引,数组本身。
    函数返回的值都会作为第一个参数自动传给下一项
    ②归并基础的初始值
    如果没有给定初始值,初始值默认为数组第一个值,第一次迭代从数组第2项开始;
    如果给定了初始值,第一次迭代从数组第1项开始

    • reduce(),从数组第一项开始遍历到最后
    array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
    
    • reduceRight(),从数组最后一项开始遍历到第一项
    var res1 = [1,2,3].reduce(function(prev, cur, index) {
      console.log('索引:'+index+',前一次的返回值:'+prev+',当前值:'+cur)
      return prev + cur;
    },100);
    console.log(res1) //106 迭代3次
    var res2 = [1,2,3].reduce(function(prev, cur, index) {
      console.log('索引:'+index+',前一次的返回值:'+prev+',当前值:'+cur)
      return prev + cur;
    });
    console.log(res2) //6 迭代2次
    var res3 = [1,2,3].reduceRight(function(prev, cur, index) {
      console.log('索引:'+index+',前一次的返回值:'+prev+',当前值:'+cur)
      return prev + cur;
    },100);
    console.log(res3) //106 迭代3次
    var res4 = [1,2,3].reduce(function(prev, cur, index) {
      console.log('索引:'+index+',前一次的返回值:'+prev+',当前值:'+cur)
      return prev + cur;
    });
    console.log(res4) //6 迭代2次
    
    ES6 提供的新方法

    1、find()方法
    用于返回数组中第一个满足要求的元素的值,如果没有满足要求的元素,则返回undefined,参数同样是一个函数。

    var arr1=[1,2,3,4,5];
    var res=arr1.find(function (value,index,arr1) {
      return value>3;
    });
    console.log(arr1);  //[1, 2, 3, 4, 5]
    console.log(res);  //4
    

    2、findIndex()方法
    用于返回数组中第一个满足要求的元素的索引,如果没有满足要求的元素,则返回-1,参数同样是一个函数。

    var arr1=[1,2,3,4,5];
    var res=arr1.findIndex(function (value,index,arr1) {
      return value>3;
    });
    console.log(arr1);  //[1, 2, 3, 4, 5]
    console.log(res);  //3
    

    3、可以配合for…of循环的entries(),keys()和values(),用于遍历数组
    entries(),keys()和values()都返回一个遍历器对象(Array Iterator),可以用for…of循环进行遍历。

    • keys()是对键名的遍历,这里的键名实际上就是数组项的索引,字符串下标的元素遍历不出来
    • values()是对键值的遍历
    • entries()是对键值对的遍历。
    var arr1=['a','b','c'];
    console.dir(arr1.entries());  //Array Iterator
    for(let index of arr1.keys()){
      console.log('index:'+index+',value:'+arr1[index]);
    }
    for(let value of arr1.values()){
      console.log('value:'+value);
    }
    for(let [index,value] of arr1.entries()){
      console.log('index:'+index+',value:'+value);
    }
    
    展开全文
  • js 数组对象的去重

    千次阅读 2017-01-11 15:20:43
    因为急需,在网上又不到合适的代码,所以在很短时间内写出来的,难免有bug,望见谅。 var arr1 = [{x:513.4261838440111,y:174}, {x:270.3404255319149,y:174}, {x:513.4261838440111,y:174}, {x:520....
  • <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <script> ...
  • js数组可以看成特殊的对象,获取指定项的行为跟获取对象中指定key对应项的行为是一致的。 一般都是hash map实现的,因而复杂度是常数级的。 转载于:https://www.cnblogs.com/zhongzihao/p/5971403.html...
  • js 数组对象字段判断重复

    千次阅读 2020-05-08 16:56:10
    name": "asd", "account_id": "asd" }, { "platform_id": 15, "type_id": 8, "account_name": "asd", "account_id": "asd" } ] js for (var i = 0; i ; i++) { for (var j = i + 1; j ; j++) { if (arr...
  • 数组去重,判断数组对象中的内容是否相同等等,在接下来的文章中使用js来简单实现下,感兴趣的朋友不要错过
  • // 于是 JS就定义了一个对象数据结构 允许使用 key: value作为一组键值对 // 对象可以有多个key:value对组成 var MrZhang = { name: "张小花", age: 33, sex: "男", height: 180, isMarried: false, money...
  • JavaScript数组对象详情

    2019-06-14 01:54:07
    Array数组概述 ...虽然数组都是有序排列,但javaScript中的数组每个元素可以保存任何类型。 javaScript数组的大小也是可以调整的。 创建数组的两种方式 new运算符创建数组 let array1 = new Ar...
  • 小陈学js js数组对象

    2020-10-22 16:36:22
    数组对象 (一)创建数组的三种方式 1、new Array() 2、字面量方式 3、es6方法 IE11不支持 (二)检测是否为数组的两种种方式 1、instanceof 是数组返回true,不是则返回false。 2、Array....
  • 主要介绍了JS实现查找数组对象的属性值是否存在,涉及javascript针对json数组的遍历、查找相关操作技巧,需要的朋友可以参考下
  • 之前以为js对象数组,今天用length取对象的长度老是undefined,用concat合并两个对象也不行,于是网上了一下, 获取对象的长度 function length(o) { var count = 0; for ( var i in o) { count++; } ...
  • function getParent(parent, value, addNum) { // 在这个数组中查找, 需要数组/对象/字符串等, 导出该数组的第几个父级(默认第一个) function getParent1(parent, value, addNum) { num = addNum ? addNum...
  • 连接两个或更多的数组,并返回结果。 join() 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。 pop() 删除并返回数组的最后一个元素 push() 向数组的末尾添加一个或...
  • JS 数组对象及方法

    2021-04-25 11:07:55
    数组对象 1.数组是值的有序集合。 每个值叫做一个元素,而每个元素在数组中有一个位置,以数字表示,称为索引。 2.数组是无类型的。 数组元素可以是任意类型,并且同一个数组中的...2.每个JavaScript数组都有一个len
  • 数组是一个Array对象 属于复杂数据类型 创建数组 字面量形式 var arr = ['内容1','内容2','内容3']; 构造函数形式 var arr = new Array('内容1','内容2','内容3'); 细节注意: 使用构造函数形式array的小括号...
  • JavaScript Array(数组对象 数组对象的作用是:使用单独的变量名来存储一系列的值。 在线实例 创建数组, 为其赋值: 实例 var mycars = new Array(); mycars[0] = “Saab”; mycars[1] = “Volvo”; ...
  • 数组 浅拷贝:不仅拷贝值也拷贝引用,比如concat,slice ,利用了他们返回新数组的特性 神拷贝:只拷贝值 方法: var arr = ['old', 1, true, ['old1', 'old2'], {old: 1}] var new_arr = JSON....对象:也一样...
  • 需求:编写一个js文件,在js文件中自定义一个数组工具对象, 该工具对象要有一个找到最大值的方法,与元素对应的索引值的方法。 */ 这个代码在ArrayTool.js文件中 //创建ArrayTool的对象 var tool = new ...
  • 数组对象
  • 本文实例讲述了JS判断两个数组对象是否相同的方法。分享给大家供大家参考,具体如下: JS 判断两个数组是否相同 要判断2个数组是否相同,首先要把数组进行排序,然后转换成字符串进行比较。 JSON.stringify([1,2,...
  • js删除数组对象多余的key

    千次阅读 2020-06-05 16:20:04
    有时我们传给后端数组参数时,有些多余的字段需要删除,并且数组对象字段都相同,比如: param: [{ "A": 15, "B": "2020-06-02 14:59:53", "C": "2020-06-02 14:59:53", "D": 12, "E": '123213' //需要...
  • 需求:将下面数组-对象中的index_name相同的对象抽离出来,放在不同的数组当中 let tempArr = [ { domain: 'a', index_name: '云淡风轻' }, { domain: 'b', index_name: '递归' }, { domain: 'c', index_name: ...
  • js数组对象相同项合并处理 平时工作中会经常遇到数据处理,其中数组合并处理也会经常遇到,下面就是数组相同项合并的一种方式: 1.首先由原始的数组arr数据, 2.然后创建一个map空对象和一个dest空数组,通过判断map...
  • JS数组对象常用方法

    千次阅读 2020-11-13 14:55:42
    JS数组对象常用方法

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 82,513
精华内容 33,005
关键字:

js数组找对象