数组应该是每个语言中都用得极度频繁的数据类型,JavaScript也不例外。

个人认为,Js中的Array类型非常强大。

首先没有C/C++等语言需要在数组初始化时指定数组长度(并不可变)的要求。

也不需要指定特定的基本数据类型(Number,String,Boolean,Null,Undefined,Object),也就意味着,一个数组中可以存多种数据类型的值。

我想总结一下Array的常用方法,在这之前,先介绍一下Array的基本用法:

基本用法:

1、创建数组:

  1. //创建空数组
  2. var arr = [];
  3. var arr = new Array();
  4.  
  5. //创建一个指定长度的数组(没有多大意义,因为长度可变)
  6. var arr = new Array(10);
  7.  
  8. //创建一个带初始值的数组
  9. var arr = ["ling", "jia", "wen", 18];
  10. var arr = new Array("ling", "jia", "wen", 18);

2、数组的基本操作:

  1. //数组基于0开始数字索引取值
  2. console.log(arr[2]); // >"wen"
  3. console.log(arr[4]); // >undefined
  4.  
  5. //获取数组长度
  6. console.log(arr.length); //>4
  7.  
  8. //改变数组长度
  9. arr.length = 3;
  10. console.log(arr[3]); //undefined(本来应该输出18)
  11.  
  12. //巧妙利用数组长度添加元素
  13. arr[arr.length] = "man";
  14. console.log(arr[4]) // >man
  15. //利用push方法添加元素
  16. arr.push("arr")
  17. console.log(arr) //> ling,jia,wen,18,man,arr

3、数组与字符串转换:

1) 数组转为字符串类型:

  1. arr1 = arr.toString(); // "ling,jia,wen,18"
  2. arr2 = arr.join("-"); // "ling-jia-wen-18"

2)  字符串转数组:

  1. var str = "ling,jia,wen,2017";
  2. var arr = str.split(","); //["ling", "jia", "wen", "2017"]
  3. arr[3] = arr[3].parseInt(); //["ling", "jia", "wen", 2017]

push、pop、shift、unshift方法

1、基本用法:

    push() 末尾插入

    pop()   末尾删除

    shift()   首项删除

    unshift() 首项插入

  1. arr.push("man") // ["ling", "jia", "wen", 18, "man"]
  2. arr.pop() // ["ling", "jia", "wen", 18]
  3. arr.shift() // ["jia", "wen", 18]
  4. arr.unshift("hello") // ["hello", "jia", "wen", 18]

2、模拟数据结构:

模拟栈(先进先出):

push():入栈

pop():出栈

模拟队列(先进后出):

正向队列:

push():进队列

shift(): 出队列

反向队列:

unshift(): 进队列

pop(): 出队列

splice方法

这个方法特别强大,不得不单独拿出来说说;它可以巧妙地对数组进行删除、插入和替换

怎么做到的呢?

这个方法可以理解为接收三个参数:起始位置、删除项数、插入项内容

(在这里我把所有的插入项内容当做一个参数,实际上可能是多个参数)

理解这三个参数至关重要。理解了,便可以实现删除、插入和替换操作。

请看下面的例子:

  1. var arr = ["ling", "jia", "wen", 18]
  2. //实现删除操作
  3. // 从第1项开始,删除2项 arr-> [ "wen", 18]
  4. // remove:["ling", "jia"]
  5. // 也就是说,它会返回你删除的项,这个几乎没有在别人的博客中看到,不明白为什么??
  6. var remove = arr.splice(0,2)
  7.  
  8. //实现插入操作
  9. //从第1项开始,删除0项,插入项为"hello"和"world"
  10. // arr->["hello", "world", "wen", 18]
  11. arr.splice(0,0,"hello", "world")
  12.  
  13. //实现替换操作
  14. //从第2项开始,删除1项,插入1项
  15. //arr->["hello", "jia", "wen", 18]
  16. arr.splice(1, 1, "jia")

代码写的很清楚了

删除时,不插入任何东西,也就是省略第三个参数;

插入时将删除项设为0即可;

替换时,只要删除项和插入项数目相同便实现了替换;

迭代方法

array数组有5个迭代方法。他们接受两个参数:

1、每一次迭代运行的函数(该函数接受三个参数:数组当前项的值、数组当前项的索引、数组本身

2、函数的作用域对象(可省略)

every()


对于数组的每一项,执行给定函数,如果该函数对每一项都返回true,则该方法返回true

栗子:

  1. var numbers = [1,1,1,2,1,1,1];
  2. var everyNum = numbers.every(function(item, index, array){
  3. return (item === 1);
  4. });
  5. console.log(everyNum); //false
  6.  
  7. var numbers1 = [1,1,1,1,1,1,1];
  8. var everyNum = numbers1.every(function(item, index, array){
  9. return (item === 1);
  10. });
  11. console.log(everyNum); //true

some()

some方法和every方法对应,两者的关系就如同orand

对于数组的每一项,执行给定函数,如果该函数对有任意一项返回true,则该方法返回true

栗子:

  1. var numbers = [1,1,1,2,1,1,1];
  2. var everyNum = numbers.some(function(item, index, array){
  3. return (item === 2);
  4. });
  5. console.log(everyNum); //true

filter()

对于数组的每一项,执行给定函数,如果该函数有些项返回true,则该方法返回true的项重新组成的数组(有点绕)

直接上栗子更好理解:

  1. var numbers = [1,2,3,4,5,6,7,8,0];
  2. var filterNum = numbers.filter(function(item, index, array){
  3. return (item >= 4);
  4. });
  5. console.log(filterNum); //[4,5,6,7,8]

这个方法用于数组的条件查询在合适不过。

forEach()

这个迭代器相信大家都不陌生,就是单纯地枚举,然后dosomething();

  1. // 2 4 6 8
  2. var numbers = [1,2,3,4];
  3. numbers.forEach(function(item, index, array){
  4. console.log(item*2);
  5. });

map()

对于数组的每一项,执行给定函数,返回函数调用结果重新组成的数组

栗子:

  1. //[2, 4, 6, 8]
  2. var numbers = [1,2,3,4];
  3. var mapNum = numbers.map(function(item, index, array){
  4. return item*2;
  5. });
  6. console.log(mapNum);

OK,我所了解和能想起来的Array里面就差不多这么多了,有什么遗漏的欢迎补充!

JavaScript入门之数组:Array类型详解的更多相关文章

  1. JavaScript中数组Array方法详解

    ECMAScript 3在Array.prototype中定义了一些很有用的操作数组的函数,这意味着这些函数作为任何数组的方法都是可用的. 1.Array.join()方法 Array.join()方 ...

  2. JavaScript中的Array类型详解

    与其他语言中的数组的区别: 1.JavaScript数组的每一项都可以保存任何类型的数据,一个数组的数组元素可以是不同类型的数据. 2.数组的大小是动态调整的,可以随着数据的添加自动的增长. 1.两种 ...

  3. js课程 1-3 Javascript变量类型详解

    js课程 1-3  Javascript变量类型详解 一.总结 一句话总结:js对象点(属性方法),json对象冒号(属性方法).属性和方法区别只有一个括号. 1.json对象中的函数的使用? 函数名 ...

  4. GoLang基础数据类型--->数组(array)详解

    GoLang基础数据类型--->数组(array)详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.Golang数组简介 数组是Go语言编程中最常用的数据结构之一.顾名 ...

  5. 转: javascript模块加载框架seajs详解

    javascript模块加载框架seajs详解 SeaJS是一个遵循commonJS规范的javascript模块加载框架,可以实现javascript的模块化开发和模块化加载(模块可按需加载或全部加 ...

  6. js变量类型详解

    <html> <title>js变量类型详解</title> <meta http-equiv="content-type" conten ...

  7. JavaScript进阶知识点——函数和对象详解

    JavaScript进阶知识点--函数和对象详解 我们在上期内容中学习了JavaScript的基本知识点,今天让我们更加深入地了解JavaScript JavaScript函数 JavaScript函 ...

  8. javascript event(事件对象)详解

    javascript event(事件对象)详解   1. 事件对象     1. 事件对象 Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. 什 ...

  9. Linux Shell数组常用操作详解

    Linux Shell数组常用操作详解 1数组定义: declare -a 数组名 数组名=(元素1 元素2 元素3 ) declare -a array array=( ) 数组用小括号括起,数组元 ...

随机推荐

  1. 如何在家自制LED灯?很简单,我来告诉你!

    首先LED分凸头.平头和凹头,当中的凹头是没无方向性. 做示宽灯这类晚间才运用的光源,用凹头就好,它没无方向性,可将整个反光碗照亮. 做转向灯等指示性的光源用,准绳上应该用凸头的,它是个聚光镜,投映的 ...

  2. asp.net中怎样调用存储过程和存储过程的写法(转载,留着自己看)

    asp.net中怎样调用存储过程和存储过程的写法 创建一个只有输入参数的存储过程 create procedure proc_user@name varchar(20),@Password varch ...

  3. 揭开Socket编程的面纱(留着自己慢慢看)

    对TCP/IP.UDP.Socket编程这些词你不会很陌生吧?随着网络技术的发展,这些词充斥着我们的耳朵.那么我想问: 1. 什么是TCP/IP.UDP?2. Socket在哪里呢?3. Socket ...

  4. 第四章:Django 模型 —— 设计系统表

    1. Django框架提供了完善的模型(Model )层来创建和存储数据,每一个模型对应数据库中的唯一的一张表. 2. Django 模型基础知识: .每一本模型是一个Python类,继承了djang ...

  5. classloader加载的双亲委托模式

    要深入了解ClassLoader,首先就要知道ClassLoader是用来干什么的,顾名思义,它就是用来加载Class文件到JVM,以供程序使用 的.我们知道,java程序可以动态加载类定义,而这个动 ...

  6. apt-get 安装ubuntu-tweak

    Ubuntu Tweak是一款专门为Ubuntu(GNOME桌面)准备的配置.调整工具.主要面向新手级的普通用户.它可以设置很多并不能在系统首选项中设置的隐藏选项,以满足用户自定义的乐趣.即使是新手, ...

  7. oracle高级查询(实例基于scott用户四张表)

    oracle高级查询(实例基于scott用户四张表) 分组查询 多表查询 子查询 综合实例 ====================================================== ...

  8. java基础系列--集合类库(一)

    原创作品,可以转载,但是请标注出处地址:http://www.cnblogs.com/V1haoge/p/7229478.html 1.概述 Java的集合类库很是丰富,囊括了大部分的常见数据结构形式 ...

  9. ffmpeg.exe下载

    下载链接:http://pan.baidu.com/s/1cGTe6y

  10. Python简易爬虫爬取百度贴吧图片

    通过python 来实现这样一个简单的爬虫功能,把我们想要的图片爬取到本地.(Python版本为3.6.0) 一.获取整个页面数据 def getHtml(url): page=urllib.requ ...