首页 > 代码库 > 【js实例】Array类型的9个数组方法,Date类型的41个日期方法,Function类型

【js实例】Array类型的9个数组方法,Date类型的41个日期方法,Function类型

 前文提要:【js实例】js中的5种基本数据类型和9种操作符

Array类型的9个数组方法

Array中有9个数组方法:

1.检测数组 2.转换方法 3.栈方法 4.队列方法 5.冲排序方法
6.操作方法 7.位置方法 8.迭代方法 9.归并方法

在实例中介绍,实例如下

/*Array类型js数组中的每一项可以用来保存任何类型的数据;js数组的大小是可以动态调整的*/var colors = ["red", "blue", "green"];alert(colors[0]);    //redalert(colors[1]);    //bluealert(colors[2]);    //greenalert(colors[3]);    //undefinedalert(colors.length);/*
1.
检测数组:
instanceof(), isArray()
*/
if (colors instanceof Array) { alert("yes"); //yes}if (Array.isArray(colors)) { alert("yes"); //yes}/*转换方法:
toString(), toLocaleString(), valueOf()alert()要接收字符串参数,当传入alert()的不是字符串参数时它会在后台调用toString()方法
*///返回一个字符串,字符串由数组中每个值的字符串组成,并且以逗号分隔alert(colors.toString());//通常和toString()方法一样,但是它是调用数组中每一项的toLocaleString()方法alert(colors.toLocaleString());//先是valueOf()方法,调用toString()方法,(valueOf返回的是数组)alert(colors.valueOf());alert(colors);//join接收一个参数,返回以参数做分隔符的所有数组项的字符串alert(colors.join("~")); //red~blue~green/*栈方法:push()和pop()push()向数组中添加元素,返回修改后数组的长度pop()移除数组中最后一项,返回移除的项*/var colors = ["red", "blue", "green"];var count = colors.push("white", "yellow");alert(count); //5alert(colors.length); //5alert(colors); //red,blue,green,white,yellowvar item = colors.pop();alert(item); //yellowalert(colors.length); //4alert(colors); //red,blue,green,white/*队列方法:shift()和unshift()shift()移除数组的第一项并返回移除的项unshift()在数组的第一项之前添加任意项,并返回数组的长度*/var colors = ["red", "blue", "green"];var item = colors.shift();//shift()alert(item); //redalert(colors.length); //2alert(colors); //blue,green//unshift()var count = colors.unshift("white", "yellow");alert(count); //4alert(colors.length); //4alert(colors); //white,yellow,blue,green/*排序方法:reverse()和sort()reverse()会反转数组想的顺序,返回排序后的数组sort()比较的是字符串,接收的参数会调用每个数组项的toString()方法,返回排序后的数组sort()接收的参数也可以是函数*///reverse()var value = http://www.mamicode.com/[1, 3, 5, 2, 10];var values = value.reverse();alert(value); //10,2,5,3,1alert(values); //10,2,5,3,1//sort()var value = http://www.mamicode.com/[1, 3, 5, 2, 10];var values = value.sort();alert(value); //1,10,2,3,5alert(values); //1,10,2,3,5/*操作方法:concat(), slice()和splice()concat()创建当前数组的副本,若有参数则将其添加到副本数组尾部,最后返回新创建的数组slice()基于当前数组创建新数组,但是不改变原数组;接收两个参数start, endstart为返回项的起始位置,end为返回项的结束位置(具体见例子),splice(),接收2个或3个参数通常用于删除,插入或替换(插入和替换都要产生删除操作,删除项数可为0),返回删除的项删除:splice(x, y);x为删除的起始位置,y为要删除的项数插入和替换(通过改变参数实现):splice(x, y, z);x为起始位置,y为要删除的项数,z为要插入的项;z可以是任意多个项*///concat()var colors = ["red", "blue", "green"];var colors2 = colors.concat();alert(colors); //red,blue,greenalert(colors2); //red,blue,greenvar colors3 = colors.concat("yellow", ["black", "brown"]);alert(colors); //red,blue,greenalert(colors3); //red,blue,green,yellow,black,brown//slice()var colors = ["red", "blue", "green", "yellow", "black"];//1.若有一个参数,则返回从起始位置到原数组末尾所组成的数组var colors2 = colors.slice(1);//2.若有两个参数,则返回从起始位置到结束位置前一项所组成的数组var colors3 = colors.slice(1, 4);//3.若start < end时返回空数组var colors4 = colors.slice(2, 1);//4.若参数为负数,则参数加上数组长度作为start或者endvar colors5 = colors.slice(-3, -1);alert(colors); //red,blue,green,yellow,blackalert(colors2); //blue,green,yellow,blackalert(colors3); //blue,green,yellowalert(colors4); //返回空数组,屏幕上显示空白警告框alert(colors5); //green,yellow//splice()//删除var colors = ["red", "blue", "green", "yellow", "black"];var remove = colors.splice(1, 2);alert(colors); //red,yellow,blackalert(remove); //blue,green//插入var colors = ["red", "blue", "green", "yellow", "black"];var remove2 = colors.splice(1, 0, "white", "brown"); //删除项数为0alert(colors); //red,white,brown,blue,green,yellow,blackalert(remove2); //空数组//替换var colors = ["red", "blue", "green", "yellow", "black"];var remove2 = colors.splice(1, 1, "white", "brown"); //删除项数为1alert(colors); //red,white,brown,green,yellow,blackalert(remove2); //blue/*位置方法:indexOf()和lastIndexOf()两个方法用于返回查找项在数组中的位置,未找到返回-1;都接收两个参数x和y, x:要查找的项;y:查找起始点位置的索引(可选参数)indexOf()从数组开头向后查找查找并返回查找参数的第一个位置,找不到返回-1;lastIndexOf()从数组末尾向前查找,返回查找参数的第一个位置注意:要查找的项必须严格相等(===)*/var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];//indexOf()alert(numbers.indexOf(4)); //3alert(numbers.indexOf(4, 4)); //5alert(numbers.indexOf(4, 6)) //-1 alert(numbers.indexOf(10)); //-1//lastIndexOf()alert(numbers.lastIndexOf(4)); //5alert(numbers.lastIndexOf(4, 4)); //3alert(numbers.lastIndexOf(4, 2)); //-1alert(numbers.lastIndexOf(10)) //-1//要查找的项必须严格相等(===)var person = {name : "Nicholas"};var people = [{name : "Nicholas"}];var morePeople = [person]; //注意这是数组alert(people.indexOf(person)); //-1alert(morePeople.indexOf(person)); //0/*迭代方法:every(), filter(), forEach(), map(), some()每个方法接收两个参数:函数参数x,运行该函数的作用域对象y函数参数x接收三个参数:数组项的值,该项在数组中的位置和数组对象本身every():对数组中的每一项运行给定的函数,如果该函数对每一项都返回true,则返回truesome():对数组中的每一项运行给定的函数,如果该函数中某一项返回true,则返回truefilter():对数组中的每一项运行给定的函数,返回该函数会返回true的项组成的数组forEach():对数组中的每一项运行给定的函数,无返回值map():对数组中的每一项运行给定的函数,返回每次函数调用结果组成的数组*/var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];//every()var everyResult = numbers.every(function(item, index, array) { return (item > 2);});alert(everyResult); //false//some()var someResult = numbers.some(function(item, index, array) { return (item > 2);});alert(someResult); //true//filter()var filterResult = numbers.filter(function(item, index, array) { return (item > 2);});alert(filterResult); //3,4,5,4,3//map()var mapResult = numbers.map(function(item, index, array) { return item * 2;});alert(mapResult); //2,4,6,8,10,8,6,4,2/*归并方法:reduce()和reduceRight()接收两个参数:一个在数组每一项调用的函数x,作为归并基础的初始值y(可选)函数x:接收四个参数,前一个值,当前值,项的索引和数组对象reduce():从数组的第一项开始reduceRight():从数组的最后一项开始*/var values = [1, 2, 3, 4, 5];//reduce()var sum = values.reduce(function(prev, cur, index, array) { return prev + cur;});alert(sum); //"15"//redeceRight()var sum2 = values.reduceRight(function(prev, cur, index, array) { return prev + cur;})alert(sum2); //"15"

 

Date类型的41个日期方法

Date类型可分为如下:

继承的方法:Date(), parse(),toLocaleString(),toString()和valueOf()方法;

日期格式化方法:

toDateString()
toTimeString()
toLocaleDateString()
toLocaleTimeString()
toUTCString()

日期/时间组件方法:getTime(), getTimezoneOffset()等

具体在实例中给出:

/*Date类型*/var now = new Date();alert(now);//继承的方法//Date.parse()接收一个表示日期的字符串参数,根据参数返回相依日期的毫秒数;//ECMA-262规范没有定义此函数支持的格式,应地区实现而异var someDate = new Date(Date.parse("May 25, 2004"));    alert(someDate);    //Tue May 25 2004 00:00:00 GMT+0800//Date.UTC()方法接收7个参数:年year,月month(0开始),日day(1-31),小时hour(0-23),分钟min,秒s,毫秒ms//year和month为必须参数;day默认为1,其它参数默认为0var y2k = new Date(Date.UTC(2000, 0));    alert(y2k);            //Sat Jan 01 2000 08:00:00 GMT+0800var allFives = new Date(Date.UTC(2005, 4, 5, 17, 55, 55, 3600));alert(allFives);    //Fri May 06 2005 01:55:58 GMT+0800//Date()构造函数会模仿Date.parse()和Date.UTC()方法var d = new Date("May 25, 2004");var dd = new Date(2005, 4, 5, 17, 55, 55, 3600);alert(d);        //Tue May 25 2004 00:00:00 GMT+0800alert(dd);        //Fri May 06 2005 01:55:58 GMT+0800/*Date类型也重写了toLocaleString(),toString()和valueOf()方法;但是浏览器之间对toLocaleString()和toString()输出不一致.下面输出为火狐浏览器下输出*/var date = new Date("1, 1, 2001");alert(date);                    //Mon Jan 01 2001 00:00:00 GMT+0800alert(date.toLocaleString());    //2001/1/1 上午12:00:00alert(date.toString());            //Mon Jan 01 2001 00:00:00 GMT+0800//注意:valueOf()方法返回的是日期的毫秒数alert(date.valueOf());            //978278400000/*日期格式化的方法这些方法也是因浏览器而异,以下为火狐浏览器输出*/var date = new Date("1, 1, 2001");//toDateString():以特定于实现的格式显示星期几,月,日和年alert(date.toDateString());        //Mon Jan 01 2001//toTimeString():以特定于实现的格式显示时,分,秒和时区alert(date.toTimeString());        //00:00:00 GMT+0800//toLocaleDateString():以特定于地区的格式显示星期几,月,日和年alert(date.toLocaleDateString());        //2001/1/1//toLocaleTimeString():以特定于实现的格式显示时,分,秒alert(date.toLocaleTimeString());        //上午12:00:00//toUTCString():以特定与实现的格式完整的UTC日期alert(date.toUTCString());        //Sun, 31 Dec 2000 16:00:00 GMT/*日期/时间组件方法*/var date = new Date(2001, 1, 1);//返回表示日期的毫秒数,与valueOf()返回的值相同alert(date.getTime());//返回本地时间与UTC世纪那相差的分钟数alert(date.getTimezoneOffset());//以毫秒数设置日期,传入参数为毫秒alert(date.setTime(3600000000000));//参数为为毫秒数//var date = new Date(2001, 1, 1);//取得四位数的年份alert(date.getFullYear());//返回UTC日期的4位数年份alert(date.getUTCFullYear());//设置日期年份,传入参数必须为4位数alert(date.setFullYear(2002));    //参数为年//设置UTC日期年份,传入参数必须为4位数alert(date.setUTCFullYear(2003));//参数为年//月:0-11var date = new Date(2001, 1, 1);//返回日期中的月份alert(date.getMonth());//返回UTC日期中的月份alert(date.getUTCMonth());//设置日期的月份,传入参数必须大于0,超过则增加年份alert(date.setMonth(1));//参数为月//设置UTC日期的月份,传入参数必须大于0,超过则增加年份alert(date.setUTCMonth(2));//参数为月//日:1-31var date = new Date(2001, 1, 1);//返回日期月份中的天数alert(date.getDate());//返回UTC日期月份中的天数alert(date.getUTCDate());//设置日期月份中的天数alert(date.setDate(23));//参数为日//设置UTC日期月份中的天数alert(date.setUTCDate(24));//参数为日//星期:1-6,0表示星期日var date = new Date(2001, 1, 1);//返回日期中的星期几alert(date.getDay(2));//返回UTC日期中的星期几alert(date.getUTCDay(3));//时:0-23var date = new Date(2001, 1, 1);//返回日期中的小时数alert(date.getHours());//返回UTC日期中的小时数alert(date.getUTCHours());//设置日期中的小时数alert(date.setHours(2));//参数为时//设置UTC日期中的小时数alert(date.setUTCHours(3));//参数为时//分:0-59var date = new Date(2001, 1, 1);//返回日期中的分钟数alert(date.getMinutes());//返回UTC日期中的分钟数alert(date.getUTCMinutes());//设置日期中的分钟数alert(date.setMinutes(34));//参数为分//设置UTC日期中的分钟数alert(date.setUTCMinutes(35));//参数为分//秒:0-59var date = new Date(2001, 1, 1);//返回日期中的秒数alert(date.getSeconds());//返回UTC日期中的秒数alert(date.getUTCSeconds());//设置日期中的秒数alert(date.setSeconds(45));//参数为秒//设置UTC日期中的秒数alert(date.setUTCSeconds(46));//参数为秒//毫秒var date = new Date(2001, 1, 1);//返回日期中的毫秒数alert(date.getMilliseconds());//返回UTC日期中的毫秒数alert(date.getUTCMilliseconds());//设置日期中的毫秒数alert(date.setMillseconds(3454));//参数为毫秒//设置UTC日期中的毫秒数alert(date.setUTCMillseconds(1111));//参数为毫秒

 

Function类型

/*函数Function 类型*//*1.函数是对象,函数名是只想函数对象的指针,不会与函数绑定(函数是对象,函数名是指针)*/function sum(num1, num2) {    return num1 + num2;}alert(sum(10, 10));    //20var anotherSum = sum;alert(anotherSum(10, 10));    //20//sum是函数的指针并不与函数绑定sum = null;alert(anotherSum(10, 10));    //20/*2.函数没有重载*/function addNum(num) {    return num + 100;}function addNum(num) {    return num + 200;}alert(addNum(100));    //300/*3.解析器会通过“函数声明提升”将函数声明添加到执行环境中去,而函数表达式则须解析器执行到它所在的代码行才会被执行*/alert(sum(10, 10));    //20function sum(num1, num2) {    return num1 + num2;}alert(sum2(19, 10));    //errorvar sum2 = function(num1, num2) {    return num1 + num2;}/*4.函数的内部属性:arguments和this,callee,caller注意:不能在严格模式下使用callee,caller*///arguments保存函数的参数,该对象还有一个callee的属性,callee是一个指针,指向拥有arguments对象的函数function factorial(num) {    if (num <= 1) {        return -1;    } else {        return num * arguments.callee(num - 1);    }}alert(4);        //24//this引用的是函数执行的环境对象。var color = "red";var o = {color : "blue"};function showColor() {    alert(this.color);}//直接调用函数则this引用的环境对象是windowshowColor();        //redalert(window.color);//red//this引用的环境对象是o,所以调用的是o中的coloro.showColor();        //red/*caller保存至调用当前函数的函数的引用(在全局作用域中调用当前函数则值为null),除opera早期版本不支持外其他都支持,注意:ECMAScript并没有定义这个属性*/function outer() {    inner();}function inner() {    alert(inner.caller);}outer();    //显示outer函数的源代码/*apply(), call()apply():接收两个参数x,y;x为运行函数的作用域,y为参数数组(可以为Array实例)call():第一个参数与apply()类似,但是后面的参数不已数组形式传递,而是直接传递给数组*/function sum(num1, num2) {    return num1 + num2;}//注意:在严格模式下,未指定环境对象而调用函数则this值不会转型为window,this此时为undefinedfunction callSum1(num1, num2) {    return sum.apply(this, arguments);}function callSum2(num1, num2) {    return sum.apply(this, [num1, num2]);}alert(callsum1(10 ,10));    //20alert(callsum2(10 ,10));    //20function sum(num1, num2) {    return num1 + num2;}function callSum(num1, num2) {    return sum.call(this, num1, num2);}alert(callSum(10, 10));        //20

 

【js实例】Array类型的9个数组方法,Date类型的41个日期方法,Function类型