今天,我复习了一下JavaScript的数组相关的知识,总结一下数组的API:

  总共有11个API:按照学习的先后顺序来吧,分别是:

  ① toString() 

    语法:arr.toString();

    将数组转化为字符串,并且返回这个字符串,以逗号分隔;但是不改变原数组;    

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

toString()

  ②concat()

    语法:arr.concat(arr1,arr2,arr3...);

    用于连接2个或者多个数组,该方法不改变原数组,而仅仅返回被连接后的数组的副本。支持打散数据。

 var arr1=[1,2,3];
 var arr2=[4,5,6];
 var arr3=arr1.concat(arr2);
 console.log(arr1);   //[1, 2, 3]
 console.log(arr2);   //[4, 5, 6]
 console.log(arr3);   //[1, 2, 3, 4, 5, 6]

concat()

  ③join()

    语法:arr.join("");

    用于在数组中的每两个相邻元素之间插入指定的字符串进行分割。该方法不改变原数组。特殊情况:字符串为空的时候,以逗号代替。

 var arr4=[7,8,9];
 var result2=arr4.join();
 var result3=arr4.join("--");
 console.log(arr4);      //[7, 8, 9]
 console.log(result2);   //7,8,9
 console.log(result3);   //7--8--9

join()

  ④reverse()

    语法:arr.reverse();

    用于颠倒数组中的顺序。直接修改原数组

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

reverse()

  ⑤sort()

    语法:arr.sort(callback);

    对数组元素进行排序。直接修改原数组。如果没有callback,那么按照字符编码进行升序排列。如果有callback就按照callback的规则进行排序    

 var arr6=[1,3,12,23,45,123,234];
 var result6=arr6.sort();
 console.log(arr6);          //[1, 12, 123, 23, 234, 3, 45]
 console.log(result6);       //[1, 12, 123, 23, 234, 3, 45]

 var arr7=[1,3,12,23,45,123,234];
 var result7=arr7.sort(function(a,b){return a-b})
 console.log(result7);   //[1, 3, 12, 23, 45, 123, 234]

sort()

  ⑥splice()

    语法:arr.splice(starti,n,elem1,elem2...)

    用于数组的插入、删除、替换,主要取决于你要删掉的元素个数和你插入元素个数的大小决定。若删掉0个,即为添加,删掉个数=插入个数即为替换,若添加个数为0,则为删除。 返回被删除的元素组成的临时新数组,修改原数组,要插入的值,只能以单独的参数传入,不支持打散数组参数。

 var arr8=[1,2,3,4,5,6,7];
 var result8=arr8.splice(2,0,8);  //插入
 console.log(arr8);    //[1, 2, 8, 3, 4, 5, 6, 7]
 console.log(result8); //[]
 var arr9=[1,2,3,4,5,6,7];
 var result9=arr9.splice(2,1,8);  //替换
 console.log(arr9);    //[1, 2, 8, 4, 5, 6, 7]
 console.log(result9); //[3]
 var arr10=[1,2,3,4,5,6,7];
 var result10=arr10.splice(2,1);  //删除
 console.log(arr10);    //[1, 2, 4, 5, 6, 7]
 console.log(result10); //[3]

splice

  ⑦slice()

    语法:arr.slice(starti,endi+1);

    用于截取数组中从starti到endi位置的数组,若省略endi,则表示从starti开始截取到结尾;若starti为负数,则表示倒着截取。不修改原数组

 var arr11=[1,2,3,4,5];
 var result11=arr11.slice(1,3);
 var result12=arr11.slice(1);
 var result13=arr11.slice(-1);
 console.log(arr11);         //[1, 2, 3, 4, 5]
 console.log(result11);      //[2, 3]
 console.log(result12);      //[2, 3, 4, 5]
 console.log(result13);      //[5]

slice()

  ⑧push()

    语法:arr.push(elem1,elem2...);

    用于向数组末尾添加一个或多个元素,并返回数组的长度。修改原数组

 var arr12=[1,2,3,4];
 var result14=arr12.push(5);
 console.log(arr12);     //[1, 2, 3, 4, 5]
 console.log(result14);  

push()

  ⑨pop()

    语法:arr.pop();

    用于删除数组的最后一个元素,并返回被删除的元素。修改原数组。

 var arr13=[1,2,3,4];
 var result15=arr13.pop();
 console.log(arr13);     //[1, 2, 3]
 console.log(result15);  

pop()

  ⑩shift()

    语法:arr.shift();

    用于删除数组的第一个元素,并返回被删除的元素。修改原数组。

 var arr14=[1,2,3,4];
 var result16=arr14.shift();
 console.log(arr14);     //[2, 3, 4]
 console.log(result16);  

shift()

  ⑪unshift()

    语法:arr.unshift(elem1,elem2,...);

    用于向数组开头添加一个或多个元素,并返回数组的长度。修改原数组

 var arr15=[1,2,3,4];
 var result17=arr15.unshift(5);
 console.log(arr15);     //[5, 1, 2, 3, 4]
 console.log(result17);  

unshift

   总结:数组API比较多,但是一定要记住。并且分清哪些是修改原数组的,哪些没有修改。

修改原数组的API:   reverse()、sort()、push()、pop()、shift()、unshift()、splice()
不修改原数组的API:   toString()、concat()、slice()、join()

JavaScript新手学习笔记1——数组的更多相关文章

  1. JavaScript新手学习笔记(一)

    1.JavaScript 对大小写敏感. JavaScript 对大小写是敏感的. 当编写 JavaScript 语句时,请留意是否关闭大小写切换键. 函数 getElementById 与 getE ...

  2. JavaScript新手学习笔记3——三种排序方式(冒泡排序、插入排序、快速排序)

    每种编程语言学到数组的时候,都会讲到排序算法,当时学C语言的时候,卡在排序算法.今天来总结一下javascript中如何实现三种排序算法. 1.冒泡排序(默认升序排列哦) 原理: 冒泡排序的原理,顾名 ...

  3. JavaScript新手学习笔记4——我记不住的几个坑:短路逻辑、按值传递、声明提前

    1.短路逻辑 逻辑运算中,如果前一个条件已经可以得出最终结论,则后续所有条件不再执行!这里的逻辑运算指的是逻辑与和逻辑或. 我们要理解逻辑与是两个条件都为真的时候,才为真,如果第一个就是假的,那么后面 ...

  4. JavaScript学习笔记之数组(二)

    JavaScript学习笔记之数组(二) 1.['1','2','3'].map(parseInt) 输出什么,为什么? ['1','2','3'].map(parseInt)//[1,NaN,NaN ...

  5. PHP学习笔记之数组篇

    摘要:其实PHP中的数组和JavaScript中的数组很相似,就是一系列键值对的集合.... 转载请注明来源:PHP学习笔记之数组篇   一.如何定义数组:在PHP中创建数组主要有两种方式,下面就让我 ...

  6. javascript正则表达式 - 学习笔记

    JavaScript 正则表达式 学习笔记 标签(空格分隔): 基础 JavaScript 正则表达式是用于匹配字符串中字符组合的模式.在javascript中,正则表达式也是对象.这些模式被用于Re ...

  7. javaScript 对象学习笔记

    javaScript 对象学习笔记 关于对象,这对我们软件工程到学生来说是不陌生的. 因为这个内容是在过年学到,事儿多,断断续续,总感觉有一丝不顺畅,但总结还是要写一下的 JavaScript 对象 ...

  8. JavaScript正则表达式学习笔记(二) - 打怪升级

    本文接上篇,基础部分相对薄弱的同学请移步<JavaScript正则表达式学习笔记(一) - 理论基础>.上文介绍了8种JavaScript正则表达式的属性,本文还会追加介绍几种JavaSc ...

  9. JavaScript简易学习笔记

    学习地址:http://www.w3school.com.cn/js/index.asp 文字版: https://github.com/songzhenhua/github/blob/master/ ...

随机推荐

  1. Android中Application全局方法(变量)的调用

    Application和Actovotu,Service一样是android框架的一个系统组件,当android程序启动时系统会创建一个 application对象,用来存储系统的一些信息.通常我们是 ...

  2. Android Studio中关于Project与Module

    在Android Studio中一个Project和Eclipse中的WorkSpace是相似的,而一个Module与Eclipse中的Project是相似的(大致可以这么的认为) 若在Android ...

  3. 六、C# 派生

    派生 对一个现有的类型进行扩展,以便添加更多的功能,或者对现有的类型的操作进行重写.   比如可以将两个类都适用的方法和属性,用一个新的类进行重构,两个类再分别继承这个类.   定义一个派生类时,要在 ...

  4. 关于T-SQL重编译那点事,内联函数和表值函数在编译生成执行计划的区别

    本文出处:http://www.cnblogs.com/wy123/p/6266724.html 最近在学习 WITH RECOMPILE和OPTION(RECOMPILE)在重编译上的区别的时候,无 ...

  5. jQuery 选择器和JavaScript 选择器的技巧与异常原因

    jquery的选择器借鉴了css选择器,核心依然依靠JavaScript的getElementById()和getElementsByTagName()方法,但是他封装了2个方法,让jquery选择器 ...

  6. Gson解析json繁杂数据

    碰到json数据.里面格式众多.list+string[]+等等.具体json参数如下: eg:以下为接口参数: "responseData":{ "brandCode& ...

  7. 16 3Sum Closest(输出距离target最近的三个数的和Medium)

    题目意思:给一个数组,给一个target,找三个数的和,这个和要与target距离最近,输出这个和 思路:这个题比3sum要稍微简单一点,如果需要优化,也可以去重,不过因为结果唯一,我没有去重. mi ...

  8. Extjs之遍历Store内的数据

    Store作为数据的载体,通过下面的方法可以获得Store内的数据; Ext.define('haomlGeimjTongjGrid_store_data', { extend: 'Ext.data. ...

  9. 编写可维护的javascript代码--- 2015.11.22(注释)

    1.单行注释 // 这是一句单行注释 2.多行注释 /* 这里是代码 */     /*  这里都是注释 1232132  */      java的注释风格 /* * 另一段注释 * 这段注释包含2 ...

  10. layer弹出标签层tab

    引入文件: <script type="text/javascript" src="layer/layer.min.js"></script& ...