JavaScript内置对象之Array的使用小结

2024-09-30 11:07:24

数组的创建方式：

1.字面量：

放置一个数值时，就是一个数据。

var arr = [6];

2.构造函数：

放置一个数据时，表示长度或数据的个数，空表示undefined。

var arr = new Array(6);

建议：Array作为构造函数，行为很不一致。因此，不建议使用它生成新数组，直接使用数组字面量是更好的做法。

数组的操作：

1.push();

用于在数组的末端添加一个或多个元素，并返回添加新元素后的数组长度。

注意，该方法会改变原数组

var arr = [1,2,3];
  console.log(arr.push("hello")); //4
  console.log(arr);        //[1,2,3,"hello"]---原数组改变
  console.log(arr.push("a","b")); //6
  console.log(arr);        //[1,2,3,"hello","a","b"]---原数组改变

2.pop();

用于删除数组的最后一个元素，并返回该元素。对空数组使用pop方法，不会报错，而是返回undefined。

注意，该方法会改变原数组

var arr = [1,2,3];
  console.log(arr.pop());   //3
  console.log(arr);      //[1,2] →原数组改变

3.concat();

合并数组。

注意，该方法不会改变原数组

var arr1 = [1,2,3]
  var arr2 = arr1.concat();
  console.log(arr1);      //[1,2,3]→→原数组
  console.log(arr1 === arr2); //false
  console.log(arr2);      //[1,2,3]→→原数组的副本
  console.log(arr1.concat("hello","world"));
  //[1,2,3,"hello","world"]
  console.log(arr1.concat(["a","b"],[[3,4],{"name":"admin"}]));
  //[1,2,3,"a","b",[3,4],{"name":"admin"}]
  console.log(arr1);      //[1,2,3]→→原数组未改变

4.shift();

用于删除数组的第一个元素，并返回该元素。

注意，该方法会改变原数组

var arr = [1,2,3]
  console.log(arr.shift());    //1
  console.log(arr);        //[2,3]→→原数组改变

5.unshift();

用于在数组的第一个位置添加元素，并返回添加新元素后的数组长度。

注意，该方法会改变原数组

var arr = [1,2,3];
  console.log(arr.unshift("hello")); //4
  console.log(arr);          //["hello",1,2,3]→→原数组改变
  console.log(arr.unshift("a","b")); //6
  console.log(arr);          //["a","b","hello",1,2,3]→→原数组改变

6.slice();

用于复制目标数组的一部分，返回一个新数组。

注意，该方法不会改变原数组。

如果slice方法的参数是负数，则表示倒数计算的位置；如果第一个参数大于等于数组长度，或者第二个参数小于第一个参数，则返回空数组。

var arr = ["a","b","c","d","e"];
  console.log(arr.slice(1,3));    //["b","c"]
  console.log(arr.slice(1));     //["b","c","d","e"]
  console.log(arr.slice(-4,-1));   //["b","c","d"]
  console.log(arr.slice(-2));     //["d","e"]
  console.log(arr.slice(1,-2));    //["b","c"]
  console.log(arr);          //["Tom","Jack","Lucy","Lily","May"]→→原数组未改变

7.splice();

用于删除原数组的一部分成员，并可以在删除的位置添加新的数组成员，返回值是被删除的元素。

注意，该方法会改变原数组。
起始位置如果是负数，则表示从倒数位置开始删除。

①不传参时：无操作;

var arr = ["a","b","c","d","e"];
  console.log(arr.splice()); //[]
  console.log(arr);      //["a","b","c","d","e"]→→无操作

②只传入start：表示从索引为start的数据开始删除，直到数组结束;

var arr = ["a","b","c","d","e"];
  console.log(arr.splice(2));   //["c", "d", "e"]
  console.log(arr);        //["a", "b"]→→原数组改变

③传入start和num：表示从索引为start的数据开始删除，删除num个;

var arr = ["a","b","c","d","e"];
  console.log(arr.splice(2,2));  //["c", "d"]
  console.log(arr);        //["a", "b", "e"]→→原数组改变

④传入更多：表示从索引为start的数据开始删除，删除num个，并将第三个参数及后面所有参数，插入到start的位置;

var arr = ["a","b","c","d","e"];
  console.log(arr.splice(2,2,"f","g")); //["c", "d"]
  console.log(arr);           //["a", "c", "f", "g", "e"]---原数组改变

8.reverse();

用于颠倒排列数组元素，返回改变后的数组（还是原数组）。

注意，该方法将改变原数组

var arr = [a,b,c];
  console.log(arr.reverse());   //[c,b,a]
  console.log(arr);        //[c,b,a]→→原数组改变

9.sort();

对数组成员进行排序，默认是按照字典顺序排序。排序后，原数组将被改变；

注意：sort方法不是按照大小排序，而是按照字典顺序。也就是说，数值会被先转成字符串，再按照字典顺序进行比较，例如：121排在13的前面；如果想让sort方法按照自定义方式排序，可以传入一个函数作为参数。

[10111,1101,111].sort(function(a,b){
return a - b;   // 升序
// return b - a; // 降序
})  // [111,1101,10111]

10.join();

以指定参数作为分隔符，将所有数组成员连接为一个字符串返回。如果不提供参数，默认用逗号分隔；

注意，该方法不会改变原数组；
如果数组成员是undefined或null或空位，会被转成空字符串。

 var arr = [a,b,c];
  console.log(arr.join());     // a,b,c
  console.log(arr.join("*"));   // a*b*c
  console.log(arr);        //[1,2,3]→→原数组未改变

11.for- in();

遍历语句，类似于循环，但for-in可以遍历没有索引的集合，也被成为枚举。

for(var i in arr) i是下标;
for(var i in obj) i是属性名.

补充：
push和pop结合使用，就构成了“后进先出”的栈结构（stack）;
push和shift结合使用，就构成了“先进先出”的队列结构（queue）。

实例

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title></title>
  <script>
    /*
     *
     * Array.isArray(对象)---->判断这个对象是不是数组
     * instanceof关键字
     * .concat(数组,数组,数组,...) 组合一个新的数组
     * .every(函数)--返回值是布尔类型,函数作为参数使用,函数中有三个参数,第一个参数是元素的值，第二个参数是索引值,第三个参数是原来的数组(没用)
     * 如果这个数组中的每个元素的值都符合条件,最后才返回的是true
     *
     * .filter(函数);返回的是数组中每一个元素都复合条件的元素,组成了一个新的数组
     *
     * .push(值);--->把值追加到数组中,加到最后了---返回值也是追加数据之后的数组长度
     * .pop();--->删除数组中最后一个元素,返回值就是删除的这个值
     * .shift();--->删除数组中第一个元素,返回值就是删除的这个值
     * .unshift();--->向数组的第一个元素前面插入一个新的元素,----返回值是插入后的程度
     * .forEach(函数)方法---遍历数组用---相当于for循环
     * .indexOf(元素值);返回的是索引,没有则是-1
     * .join("字符串");----返回的是一个字符串
     * .map(函数);--->数组中的每个元素都要执行这个函数,把执行后的结果重新的全部的放在一个新的数组中
     * .reverse();----->反转数组
     * .sort();---排序的,可能不稳定,如果不稳定,请写MDN中的那个固定的代码
     * .arr.slice(开始的索引,结束的索引);把截取的数组的值放在一个新的数组中,但是不包含结束的索引对应的元素值
     * .splice(开始的位置,要删除的个数,替换的元素的值);一般是用于删除数组中的元素,或者是替换元素,或者是插入元素
     *
     *
     * */
    //构造函数
    //  var arr1=new Array();
    //  //字面量的方式
    //  var arr2=[];

    //对象是不是数组类型:两种
    //1  instanceof
    //  var obj=[];
    //  console.log(obj instanceof Array);//false
    //
    //  //2 使用数组的
    //  console.log(Array.isArray(obj));//

    //  var arr=["a","b","c"];
    //  var newArr=Array.from(arr);
    //  console.log(newArr);

    //  var arr1=[10,20,30];
    //  var arr2=[40,50,60];
    //  console.log(arr1.concat(arr2));

    //  var arr=[1000,2000,3000];
    //  //a----: 元素的值
    //  //b----: 索引的值
    //  //c----:谁调用了这个方法,那么c就是谁---->arr
    //  var flag= arr.every(function (a,b) {
    //   //console.log(a+"==="+b+"===="+c);
    //   return a>2000;//数组中的每个元素的值都要大于2000的情况,最后才返回true
    //  });

    //  var arr=["小明明lkko","小曹操674","小白白bd","笑眯眯a"];
    //  var flag=arr.every(function (ele,index) {
    //   //数组中的每个元素的长度是不是大于4
    //   return ele.length>4;
    //  });

    //console.log(flag);

    //  var arr=[10,20,30,40,50,60,70,80];
    //  var newArr=arr.filter(function (ele) {//ele---每个元素
    //   return ele>40;
    //  });
    //  console.log(newArr);

    //  var arr=[10,0,20,0,40,0,60,100];
    //  var newArr=arr.filter(function (ele) {
    //   return ele!=0;
    //  });
    //  console.log(newArr);

    //  var arr=[10,20,30,40,50];
    //  var result=arr.unshift(100);
    //  console.log(result);
    //  console.log(arr);
    //
    //  var arr = [10, 20, 30, 40];
    //  arr.forEach(function (ele,index) {
    //   console.log(ele+'======'+index);
    //  });

    //  var arr=[10,20,30,40];
    //  var index=arr.indexOf(300);
    //  console.log(index);

    //  var arr=["小白","小黑","小红","小芳","小绿","小苏"];
    //  var str=arr.join("|");
    //  console.log(str);

    //  var numbers = [1, 4, 9];
    //  var roots = numbers.map(Math.sqrt);
    //  console.log(roots);

    //  var arr=[10,20,30,40,50];
    //  arr.reverse();//反转
    //  console.log(arr);

    //  var arr=[1,40,20,10,100];
    //  //a---arr[j]
    //  //b---arr[j+1]
    //  arr.sort(function (a,b) {
    //   if(a>b){
    //    return 1;
    //   }else if(a==b){
    //    return 0;
    //   }else{
    //    return -1;
    //   }
    //  });
    //  console.log(arr);

    //
    //  var arr=[10,20,30,40,50,60,70,80,90,100];
    //  var newArr= arr.slice(3,7);
    //  console.log(newArr);

    var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];

    // myFish.splice(2, 0, 'drum'); // 在索引为2的位置插入'drum'

    // myFish 变为 ["angel", "clown", "drum", "mandarin", "sturgeon"]

    myFish.splice(2, 1); // 从索引为2的位置删除一项（也就是'drum'这一项）

    console.log(myFish);
    // myFish 变为 ["angel", "clown", "mandarin", "sturgeon"]

  </script>
</head>
<body>

</body>
</html>

到此这篇关于JavaScript内置对象之Array的使用小结的文章就介绍到这了,更多相关JavaScript内置对象Array内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

JScript内置对象Array中元素的删除方法

我们知道JScript给我们提供了一个内置的数组对象Array.Array对象除了提供了constructor.length和prototype外,还默认提供了13个方法:concat.join.pop.push.reverse.shift.slice.sort.splice.toLocaleString.toString .unshift和valueOf,可是没有提供delete方法. 要是熟悉JavaScript的话,会马上说,系统提供了一个delete操作,可以用来删除数组中的元素.对,J
JavaScript内置对象之Array的使用小结

数组的创建方式: 1.字面量: 放置一个数值时,就是一个数据. var arr = [6]; 2.构造函数: 放置一个数据时,表示长度或数据的个数,空表示undefined. var arr = new Array(6); 建议:Array作为构造函数,行为很不一致.因此,不建议使用它生成新数组,直接使用数组字面量是更好的做法. 数组的操作: 1.push(); 用于在数组的末端添加一个或多个元素,并返回添加新元素后的数组长度. 注意,该方法会改变原数组 var arr = [1,2,3]; c
javascript 内置对象及常见API详细介绍

一. 类与对象在 JavaScript世界里,关于面向对象第一个要澄清的概念就是类.对象都是由类来定义的,通过类来创建对象就是我们所熟悉的实例化.然而,在 JavaScript中别没有真正的类,对象的定义就是对象自身.而 ECMA-262 干脆把这种妥协的方式称作为对象的调和剂.为了方便理解,我通常把这个发挥类的作用的调和剂称为类. Javascript内置对象学习全局属性 Infinity 表示正无穷大的数值 NaN 非数字值 undefined 未定义的值 decodeURI() 对en
javascript内置对象操作详解

1.indexOf() 方法 -----这个方法比较常用返回某个指定的字符串值在字符串中首次出现的位置使用格式:stringObject.indexOf(substring, startpos) 举个例子:寻找第二个o所在的位子 var mystr="Hello World!" document.write(mystr.indexOf("o",mystr.indexOf("o")+1));--------结果是:7 mystr.indexOf
JavaScript内置对象math,global功能与用法实例分析

本文实例讲述了JavaScript内置对象math,global功能与用法.分享给大家供大家参考,具体如下: 学习要点: 1.Global对象 2.Math对象 ECMA-262对内置对象的定义是:"由ECMAScript实现提供的.不依赖宿主环境的对象,这些对象在ECMAScript程序执行之前就已经存在了."意思就是说,开发人员不必显示地实例化内置对象:因为它们已经实例化了.ECMA-262只定义了两个内置对象:Global和Math. 一．Global对象 Global(全局)对
JavaScript内置对象介绍

目录一.内置对象二.Math对象 1.Math对象的使用 2.生成指定范围的随机数三.日期对象 1.Date()方法的使用 2.日期对象的使用 3.获取时间戳四.数组对象 1.数组对象的创建 2.检测是否为数组 3.添加删除数组元素的方法 4.数组排序 5. 数组索引方法 6.数组转换为字符串五.字符串对象 1.根据字符返回位置 2. 根据位置返回字符 3. 字符串操作方法 4.split()方法一.内置对象内置对象就是指 JS 语言自带的一些对象,这些对象供开发者使用,并提供了一
javascript内置对象Date案例总结分析

目录 Date的基本使用格式化时间 1.格式化日期-年,月,日 2.格式化时,分,秒获取Date总的毫秒数(时间戳) 案例-网页倒计时核心算法(重要) 结语 Date的基本使用内置对象Date是构造函数,用new创建对象,无参数时返回当前时间,可加参数返回特定时间 //内置对象Date是构造函数,用new创建对象,无参数时返回当前时间,可加参数返回特定时间 var now_time = new Date(); console.log(now_time); // 年月日之间可以用-或者/ v
javascript内置对象Math案例总结分析

目录 Math概述 Math中常用函数的用法 1.绝对值方法 2.三个取整方法 3.求最大值/最小值 4.随机数案例求两个数之间的随机整数的小算法(重要) 随机点名结语 Math概述 Math 对象不是构造函数,它具有数学常数和函数的属性和方法.跟数学相关的运算(求绝对值,取整.最大值等)可以使用 Math 中的成员. Math中常用函数的用法 Math.PI //圆周率 Math.floor () //向下取整 Math.ceil () //向上取整 Math.round () //四舍
JavaScript 内置对象 BigInt详细解析

目录前言比较创建方法 asIntN() asUintN() toLocaleString() toString() valueOf() 前言说起JavaScript中的内置对象,其实又很多,今天我们介绍的是BigInt,在开发过程中,其实很少使用这个对象,所以你也不知道这个对象.它提供了一种方法来表示大于 2^53 - 1 的整数.这原本是 Javascript 中可以用 Number表示的最大数字.BigInt可以表示任意大的整数. 比较它在某些方面类似于 Number,但也有不同
javascript内置对象arguments详解

一.什么是argumentsarguments 是是JavaScript里的一个内置对象,它很古怪,也经常被人所忽视,但实际上是很重要的.所有主要的js函数库都利用了arguments对象.所以agruments对象对于javascript程序员来说是必需熟悉的.所有的函数都有属于自己的一个arguments对象,它包括了函所要调用的参数.他不是一个数组,如果用typeof arguments,返回的是'object'.虽然我们可以用调用数据的方法来调用arguments.比如length,还有
JavaScript 内置对象属性及方法集合

1.Date 属性(1): constructor 所建立对象的函数参考 prototype 能够为对象加入的属性和方法方法(43): getDay() 返回一周中的第几天(0-6) getYear() 返回年份.2000年以前为2位,2000(包含)以后为4位 getFullYear() 返回完整的4位年份数 getMonth() 返回月份数(0-11) getDate() 返回日(1-31) getHours() 返回小时数(0-23) getMinutes() 返回分钟(0-59) ge

JavaScript内置对象之Array的使用小结

相关推荐

随机推荐