`

JavaScript入门指南_7

    博客分类:
  • JS
阅读更多

JavaScript_7

Array类型:

  • JavaScript中的数组可以保存任何类型的数据
  • JavaScript中的数组大小可以动态调整

数组的声明:

  • 通过Array()构造方法创建
var names1=new Array();//创建一个空的数组
var names2=new Array(20);//创建一个长度为20的数组
var names3=new Array("rose","jerry","tom");//创建长度为3并且三个值分别为rose,jerry,tom的数组
alert(names1.length);//0
alert(names2.length);//20
alert(names3.length);//3
//数组的声明可以省略new关键字
/*
var names1=Array();//创建一个空的数组
var names2=Array(20);//创建一个长度为20的数组
var names3=Array("rose","jerry","tom");//创建长度为3并且三个值分别为rose,jerry,tom的数组
*/
  •  通过数组字面量方式创建
var names1=["tom","jack"];
var names2=[];//空数组
alert(names1.length);//2
alert(names2.length);//0

数组的使用:

var names=["tom","jack"];
names[2]="rose";//设置数组的第三个值为rose
names.length=4;//设置数组的长度为4,实际有三个元素,第四个为undefined
alert(names.length);//4
alert(names[3]);//undefined
names[99]="tiny";//设置第100个元素为tiny,中间96个为undefined
alert(names.length);//100
names[names.length]="lily";//往数组的末尾添加新元素,长度加1,长度为101
  •  数组的默认值为undefined
var names=["tom","jack"];
alert(names);//显示数组tom,jack
alert(names.toString());//数组转为字符串,调用toString()方法,tom,jack
alert(names.join("-"));//更改数组显示的连接符,tom-jack

数组中的栈方法:

  •  栈,遵循后进先出原则
var names=[];
var count=names.push("tom","jack");//从前向后往栈里压,tom在栈底
alert(count);//2
alert(names);//tom,jack
count=names.push("rose");//rose在栈顶
alert(count);//3
alert(names);//tom,jack,rose

var item=names.pop();//rose被出栈
alert(item);//rose
alert(names.length);//2
alert(names[0]);//tom

数组中的队列方法:


 

var names=[];
names.push("tom","jack");//栈底tom
var item=names.shift();//栈底,也就是队列的前面,先到的先出
alert(item);//tom   tom在队前
alert(names.length);//1  tom出列了,剩下一个jack

var count=names.unshift("tom");//tom插队到队前,又变为2个了
alert(count);//2
count=names.unshift("jim","mary");//mary插到队前,jim插到队前  4个人了
alert(count);//4
alert(names);//jim,mary,tom,jack

 数组中的排序:

  • 反转数组
var nums=[1,2,6,3,4,5];
nums.reverse();
alert(nums);//5,4,3,6,2,1
  •  自然排序

 

var nums=[1,10,23,5,15];
nums.sort();
alert(nums);//1,10,15,23,5  先按第一个数排,再按第二个排

 

  •  根据排序函数排序
  • sort方法接受一个排序函数,根据排序函数进行排序
  • 排序函数的规则:如果第一个参数应该在第二个参数之前,则返回一个负数,如果两个参数相等则返回0,否则返回正数

 

 

function compare(v1,v2){
	if(v1<v2){
		return -1;
	}else if(v1>v2){
		return 1;
	}else{
		return 0;
	}
}
var nums=[1,10,23,5,15];
nums.sort(compare);
alert(nums);//1,5,10,15,23

 

//排序函数简写
function compare(v1,v2){
	return v1-v2;
}
var nums=[1,10,23,5,15];
nums.sort(compare);
alert(nums);//1,5,10,15,23

数组的其他方法:

  • concat():创建当前数组的一个副本,然后将接收的参数添加到这个副本的末尾
var nums=[1,10,23];
var nums2=nums.concat();
alert(nums2);//1,10,23
var nums3=nums.concat(2,1);
alert(nums3);//1,10,23,2,1
var nums4=nums.concat(2,[3,4]);
alert(nums4);//1,10,23,2,3,4
  •  slice():基于当前数组中的一个或多个项创建一个新的数组。
  • 该方法接受一个或俩个参数,分别代表返回项的起始和结束位置(不包含结束位置)。
  • 如果只有一个参数,则表示从当前位置到结束
  • 该方法不会影响原数组

var names=["tom","jerry","lily","rose"];
var names2=names.slice(1,3);
alert(names2);//jerry,lily
var names3=names.slice(2);
alert(names3);//lily,rose
var names4=names.slice(-3,-1);//最后一个为-1
alert(names4);//jerry,lily

  •  splice():可以对数组中元素进行插入、替换、删除操作
  • 删除操作:指定俩个参数,要删除的第一项的位置和要删除的项数
  • 插入操作:指定三个参数,起始位置,删除0项,插入的数据
  • 替换操作:指定三个参数,起始位置,要删除的项数,替换的元素

//删除操作
var names=["tom","jerry","lily","rose"];
var removed=names.splice(0,2);//从0索引开始,删除两位
alert(removed);//tom,jerry
alert(names);//lily,rose
//插入操作   lily,rose
names.splice(0,0,"tom","jerry");
alert(names);//tom,jerry,lily,rose
//替换操作  tom.jerry,lily,rose
names.splice(1,1,"hankson");//把jerry替换为hankson
alert(names);//tom,hankson,lily,rose

  •  indexOf()和lastIndexOf():根据下表找元素,找不到返回-1

var nums=[1,2,6,45,15,2,15];
var index1=nums.indexOf(2);//2所在的索引
alert(index1);//1
var index2=nums.lastIndexOf(2);//从后面找2的索引
alert(index2);//5
var index3=nums.indexOf(2,1);//从下标为1的地方开始找2的索引,包含1
alert(index3);//1

 

 数组的迭代:

  • 普通的for循环
  • for..in...
  • forEach
var nums=[1,2,6,45,15,2,15];
for(var i=0;i<nums.length;i++){
	console.log(nums[i]);
}

 

var nums=[1,2,6,45,15,2,15];
for(var index in nums){
	console.log(nums[index]);
}

 

var nums=[1,2,6,45,15,2,15];
nums.forEach(function(item,index,array){
	console.log(index+"-"+item);//0-1 1-2 2-6 ....
	console.log(array);//array=nums
});

 

总结:

  • Array类型,数组的声明,构造方法式,字面量式
  • 数组的使用:添加元素,增加长度等
  • 数组的栈操作,队列操作
  • 数组的排序
  • 数组的其他方法:concat复制追加,slice截取数组成新数组,splice根据参数的不同具有不同功能
  • 数组的迭代:for,for..in..,forEach
  • 大小: 17.1 KB
  • 大小: 12.6 KB
分享到:
评论

相关推荐

    JavaScript入门教程_适合初学者

    本教程旨在为新手提供一个全面的入门指南,帮助他们快速掌握JavaScript的核心概念。 首先,JavaScript是一种解释型、弱类型、基于原型的脚本语言。这意味着它不需要预先编译,而是逐行执行代码。弱类型意味着变量在...

    HTML+CSS+JavaScript编程入门指南

    下载文件是HTML+CSS+JavaScript编程入门指南这本书的示例代码,全书分HTML,CSS与JavaScript三个部分,然后结合三个部分用项目说明应用方法。各部分的代码展示了三种语言的使用方法,可以搭配webstorp执行

    Javascript入门指南(英文版)

    ### JavaScript入门指南知识点详解 #### 一、书籍概述与作者介绍 《JavaScript入门指南》(第三版)是一本面向初学者的JavaScript学习手册。本书旨在为刚接触JavaScript的学习者提供全面且深入的基础知识,帮助...

    Javascript培训资料整理分享:Javascript入门指南

    ### JavaScript培训资料整理分享:JavaScript入门指南 #### 一、初识JavaScript ##### 1.1 网页三剑客 网页开发中通常提到的“三剑客”包括HTML、CSS以及JavaScript。 - **HTML (HyperText Markup Language)**: ...

    JavaScript and AJAX_ Visual QuickStart Guide

    《JavaScript和AJAX_视觉快速入门指南》是一本专为初学者和中级开发者设计的教程,旨在帮助读者深入理解和掌握JavaScript编程语言以及AJAX(异步JavaScript和XML)技术。这本书通过直观、易于理解的方式,提供了丰富...

    starterkit-master_javascript_f_dsp_Windows编程_

    "starterkit"通常指的是初学者入门套件,因此我们可以期待这个压缩包包含了一些基础的教程、代码示例或者工具,帮助用户入门这三个领域的知识。 【描述】"jcbqoihwd uhq iwd qwhd gqwd gd iqwddulvqf brgh wdlbef ...

    Html+Css+Javascript从入门到精通.pdf

    ### Html+Css+Javascript从入门到精通 #### Web开发基础教程概述 《Html+Css+Javascript从入门到精通》是一本全面介绍了Web前端开发技术的教程。本书旨在帮助读者掌握Web开发的基础知识,并通过实践逐步深入理解...

    百度地图JavaScript_API_v2.0开发指南

    百度地图JavaScript API v2.0提供了一系列接口,允许开发者在网页...整个开发指南详细地介绍了百度地图JavaScript API v2.0的各项功能,旨在帮助开发者高效地利用百度地图资源,创建功能强大、交互性强的网页地图应用。

    JSON_入门指南

    资源名称:JSON_入门指南内容简介: JSON 即 Javascript Object Natation,它是一种轻量级的数据交换格式,非常适合于服务器与 Javascript 的交互。本文将快速讲解 JSON 格式,并通过代码示例演示如何...

    HTML、CSS与JavaScript网页设计入门指南

    HTML、CSS与JavaScript网页设计入门指南

    JavaScript权威指南(第5版)PDF版本下载.txt

    - **第1章:入门**:介绍了JavaScript的历史背景、特点以及应用场景。 - **第2章:语法**:讲解了JavaScript的基本语法,包括数据类型、变量声明、控制结构等。 - **第3章:函数**:详细阐述了函数在JavaScript中的...

    jdk1.6_javascript_DHTML_中文帮助chm

    《JDK1.6、JavaScript与DHTML:中文帮助与参考指南》 在这个压缩包中,我们包含了三个非常重要的资源,它们分别是“JDK1.6_API_中文参考.CHM”、“DHTML_参考手册.chm”以及“JavaScript语言参考手册.chm”。这些...

    JavaScript基础教程(pdf版)

    本教程旨在为初学者提供一个全面的JavaScript基础知识学习平台,帮助理解并掌握这种强大的脚本语言。 《JavaScript基础教程》首先会介绍JavaScript的历史背景和基本语法,包括变量、数据类型、操作符、流程控制...

    JavaScript权威指南(第6版)中文版.pdf百度网盘下载地址

    《JavaScript权威指南》第六版不仅适合初学者作为入门教程,也适用于有一定经验的开发者用来深入了解JavaScript的高级特性和最佳实践。通过系统地学习本书中的内容,读者可以全面掌握JavaScript的各项技能,从而更好...

    JavaScript入门教程--书籍(pdf)

    本教程旨在为初学者提供一个全面的JavaScript入门指南,帮助你快速掌握这一强大的脚本语言。 一、JavaScript概述 JavaScript,简称JS,由Netscape公司的Brendan Eich在1995年发明,起初用于网页交互,现在已成为Web...

    javascript编程指南(第四版)

    在JavaScript的世界里,了解变量、数据类型和操作符是入门的基础。变量是存储数据的容器,JavaScript有六种原始数据类型(字符串、数字、布尔值、null、undefined和symbol)和一种复合类型(对象)。操作符则用于...

    JavaScript入门文档

    新云下载小编为大家提供了JavaScript权威指南最新下载。 JavaScript权威指南简介 《JavaScript权威指南(第7版)》主要讲述的内容涵盖JavaScript语言...

    JavaScript权威指南第六版.mobi

    这些基本概念是理解JavaScript程序设计的基础,也是初学者入门的必学内容。 接着,书中深入讨论了JavaScript的对象模型,包括原型、原型链、闭包等高级概念,这些都是JavaScript强大而灵活的核心特性。同时,书中还...

Global site tag (gtag.js) - Google Analytics