本文深入探讨了JavaScript中数组与字符串之间的转换方法，包括toString(), toLocaleString(), join(), split()等函数的使用，以及数组查找、迭代、映射、筛选和汇总等高级操作的详细解析。
数组与字符串的转换
Array对象的数组与字符串相互转换的方法
- toString() 将数组转化为字符串
var a=[1,2,5,4,7,8,5,0,6,5,4];
var s=a.toString();
alert(s);
alert(typeof s);
当数组用于字符串环境中，JavaScript会自动调用toString()方法将数组转换成字符串。
var a=[1,2,5,4,7,8,5,0,6,5,4];
var b=[3,45,6,7];
var c=a+b;
alert(c);
toString()在把数组转换成字符串时，首先要将数组的每个元素都转换成字符串，当每个元素都转换成字符串时，才使用逗号隔开，以列表的形式输出这些字符串。
var a=[1,2,5,[4,7],8,[5,0,[6,5],4]];
var s=a.toString();
alert(s);
alert(typeof s);
- toLocaleString() 把数组转换成局部字符串
toLocaleString()方法与toString()方法用法基本相同，主要区别在于toLocaleString()方法能够使用用户所在地区特定的分隔符把生成的字符串连接起来，形成一个字符串。
var a=[1,2,5,4];
var s=a.toLocaleString();
alert(s);
alert(typeof s);
- join() 将数组元素连接起来以构建一个字符串
var a=[1,2,5,4];
var s=a.join("+");
alert(s);
alert(typeof s);
- split() 把字符串转换为数组
var a="1,2,5,4";
var s=a.split(",");
alert(s);
alert(s.constructor==Array);
alert(typeof s);
定位
- indexOf
indexOf返回某个元素值在数组中的第一个匹配项的索引，若没找到指定值，则返回-1。
array.indexOf(searchElement[,fromIndex])
参数说明：
- searchElement：必须参数，要在array中定位的值。
- fromIndex：可选参数，用于搜索的数组索引。如果省略该参数，则从索引0处开始搜索。如果fromIndex大于或等于数组长度，则返回-1。如果fromIndex为负，则搜索从数组长度加上fromIndex的位置处开始。
var s=["ab","df","er","jh","df","ab"];
document.write(s.indexOf("er")+"<br />"); //2
document.write(s.indexOf("df",2)+"<br />"); //4
document.write(s.indexOf("cc")+"<br />"); //-1
document.write(s.indexOf("ab",-2)+"<br />"); //5
- lastIndexOf
lastIndexOf返回指定的值在数组中的最后一个匹配项的索引。用法与indexOf相同。
array.lastIndexOf(searchElement[,fromIndex])
var s=["ab","df","er","jh","df","ab"];
document.write(s.lastIndexOf("er")+"<br />"); //2
document.write(s.lastIndexOf("df",2)+"<br />"); //1
document.write(s.lastIndexOf("cc")+"<br />"); //-1
document.write(s.lastIndexOf("ab",-2)+"<br />"); //0
迭代
- forEach：为数组中的每个元素调用定义的回调函数
为数组中的每个元素调用定义的回调函数。具体用法：
array.forEach(callbackfn[,thisArg])
参数说明：
- array：一个数组对象；
- callbackfn：回调函数，必须参数，最多有3个参数。对于数组中的每个元素，forEach都会调用callbackfn函数一次。
- thisArg：可选参数，callbackfn函数中this关键字可引用的对象。如果省略thisArg,则undefined将用作this值。
回调函数用法：
function callbackfn(value,index,array)
参数说明：
- value(数组元素的值）；
- index（数组元素的数字索引）；
- array（包含该元素的数组对象）。
使用forEach()迭代数组，把每个元素的值和下标索引输出显示。
var s=["ab","df","er","jh","df","ab"];
function ShowResults(value,index,ar){
document.write("value:"+value+" ");
document.write("index:"+index+" ");
document.write("<br />");
}
s.forEach(ShowResults);
使用forEach()迭代数组，计算数组元素的和并输出。
var s=[3,6,77,89,333,56];
var num=0;
function addNumber(value){
num+=value;
}
s.forEach(addNumber);
alert(num);
- every：检查定义的回调函数是否为数组中所有元素返回true
确定数组的所有成员是否满足指定的测试。
array.every(callbackfn[,thisArg])
参数说明：
- array：必须参数，一个数组对象；
- callbackfn：必需参数，一个接收最多3个参数的函数。every方法会为array中的每个元素调用callbackfn函数，直到callbackfn返回false，或直达数组的结尾；
- thisArg：可选参数，callbackfn函数中this关键字可引用的对象。如果省略thisArg,则undefined将用作this值。
说明：
- every方法会按升序顺序对每个数组元素调用一次callbackfn函数，直到callbackfn函数返回false。
- 如果找到导致callbackfn返回false的元素，则every方法会立即返回false。
- 否则，every方法返回true。every方法不为数组中缺少的元素调用该回调函数。
检测数组中的元素是否都为偶数。
var s=[3,6,77,89,333,56];
function CheckIfEven(value,index,ar){
document.write(value+" ");
if(value%2==0){
return true;
}else{
return false;
}
}
if(s.every(CheckIfEven)){
alert("都是偶数！");
}else{
alert("不全为偶数！");
}
检测数组中元素的值是否在指定范围内。
var numbers=[12,25,2];
var obj={
minimum:0,
maximum:66
}
var checkNumericRange=function(value){
if(typeof value!=='number'){
return false;
}else{
return value>=this.minimum && value<=this.maximum;
}
}
if(numbers.every(checkNumericRange,obj)){
alert("都在指定范围内！");
}else{
alert("部分不再范围内！");
}
- some：检查定义的回调函数是否为数组的任何元素返回true
array.some(callbackfn[,thisArg])
说明：
- some方法会按升序顺序对每个数组元素调用callbackfn函数，直到callbackfn函数返回true。
- 如果找到导致callbackfn返回true的元素，则some方法会立即返回true。
- 如果回调不对任何元素返回true，则some方法会返回false。
- some方法不为数组中缺少的元素调用该回调函数。除了数组对象之外，some方法可由具有length属性且具有已按数字编制索引的属性名的任何对象使用，如关联数组对象，Arguments等。
检测数组中元素的值是否都为奇数。
var s=[3,5,77,89,333,57];
function CheckIfEven(value,index,ar){
if(value%2==0){
return true;
}else{
return false;
}
}
if(s.some(CheckIfEven)){
alert("不全为奇数！！");
}else{
alert("全为奇数！");
}
- map：对数组的每个元素调用定义的回调函数，并返回包含结果的数组
对数组的每个元素调用定义的回调函数并返回包含结果的数组。具体用法：
array.map(callbackfn[,thisArg])
说明：
- map方法将返回一个全新的数组，其中每个元素均为关联的原始数组元素的回调函数返回值。对于数组中的每个元素，map方法都会调用callbackfn函数一次（采用升序索引顺序）。将不会为数组中缺少的元素调用回调函数。
- 除了数组对象外，map方法可由具有length属性，且具有已按数字编制索引的属性名的任何对象使用，如Arguments参数对象。
使用map方法映射数组，把数组中每个元素的值平方，乘以PI值，把返回的值作为新数组的元素值，最后返回这个新数组。
var ss=[2,4,3];
function AreaOfCircle(radius){
var area=Math.PI*(radius*radius);
return area.toFixed(0);
}
var areas=ss.map(AreaOfCircle);
alert(areas);
使用map方法映射数组，把数组中每个元素的值除以divisor的值，然后返回这个数组。其中divisor和回调函数都作为对象obj的属性存在，通过这种方法演示如何在map中使用thisArg参数。
var number=[6,12,25,30]
var obj={
divisor:10,
remainer:function(value){
return value%this.divisor;
}
}
var result=number.map(obj.remainer,obj);
alert(result);
使用JavaScript内置方法作为回调函数。
var number=[9,25];
var result=number.map(Math.sqrt);
alert(result);
使用map方法应用于一个非数组类型上。通过动态调用的 方法（call）把map作用域一个字符串上，则map将遍历字符串中每个字符，并调用回调函数,把每个字符左右3个字符截取出来，映射到一个新的数组中。
var word="thursday";
function threeChars(value,index,str){
return str.substring(index-1,index+2);
}
var result=[].map.call(word,threeChars);
//var result=Array.prototype.map.call(word,threeChars);
alert(result);
- filter：对数组的每个元素调用定义的回调函数，并返回回调函数为其返回true的值的数组
array.filter(callbackfn[,thisArg])
说明：
- 返回值是一个包含回调函数为其返回true的所有值的新数组。如果回调函数为array的所有元素返回false，则新数组的长度为0。
- 对于数组中的每个元素，filter方法都会调用callbackfn函数一次（采用升序索引顺序）。不为数组中缺少的元素调用该回调函数。
- 除了数组对象外，filter方法可由具有length属性，且具有已按数字编制索引的属性名的任何对象使用。
使用filter方法帅选出数组中的素数。
var number=[21,3,4,23,12,56,38,45,19,31,24];
function CheckIfPrime(value,index,ar){
high=Math.floor(Math.sqrt(value))+1;
for(var div=2;div<=high;div++){
if(value%div==0){
return false;
}
}
return true;
}
var primes=number.filter(CheckIfPrime);
alert(primes);
使用filter方法过滤数组中字符串的元素。
var ss=[1,3,"er","89","chinese",34,12,"food"];
var result=ss.filter(
function(value){
return(typeof value==='string');
}
);
alert(result);
使用filter方法过滤window对象包含的以字母css开头的属性名。
var filteredNames=Object.getOwnPropertyNames(window).filter(Isc);
for(i in filteredNames){
document.write(filteredNames[i]+"<br/>");
}
function Isc(value){
var firstChar=value.substr(0,3);
if(firstChar.toLowerCase()=="css"){
return true;
}else{
return false;
}
}
汇总
- reduce
对数组中所有元素调用指定的回调函数。该回调函数的返回值为累积结果，并且此返回值在下一次调用该回调函数时作为参数提供。
array.reduce(callbackfn[,initialValue])
参数说明：
- array：必须参数，一个数组对象；
- callbackfn(必需参数，一个接收最多4个参数的函数。对于数组中的每个元素，reduce方法会调用callbackfn函数一次；
- initialValue：可选参数，如果指定initialValue,则它将用作初始值来启动累积。第一次调用callbackfn函数会将此值作为参数而非数组值提供。
回调函数用法
function callbackfn(previousValue,currentValue,currentIndex,array)
参数说明：
- previousValue：通过上一次调用回调函数获得的值。如果向reduce方法提供initialValue,则在首次调用函数时，previousValue为initialValue.;
- currentValue：当前数组元素的值；
- currentIndex：当前数组元素的数字索引；
- array：包含该元素的数组对象。
将数组链接成字符串，各个值以“：：”分开。
var s=["abc","deem","consider",12,23];
function appendCurrent(previousValue,currentValue){
return previousValue+"::"+currentValue;
}
var result=s.reduce(appendCurrent);
alert(result);
向数组中添加值。
var s=[4,1,2,5];
function addDigitValue(previousValue,currentDigit,currentIndex,array){
var exponent=(array.length-1)-currentIndex;
var digitValue=currentDigit*Math.pow(10,exponent);
return previousValue+digitValue;
}
var result=s.reduce(addDigitValue,0);
alert(result);
获取一个数组，该数组包含另一个数组中介于1和和10之间。
ar s=[12,2,4,34,67,8,9,0,54,86,88,16];
function Process(previousArray,currentValie){
var nextArray;
if(currentValie>=1 && currentValie<=10){
nextArray=previousArray.concat(currentValie);
}else{
nextArray=previousArray;
}
return nextArray;
}
var emptyArray=new Array();
var result=s.reduce(Process,emptyArray);
alert(result);
- reduceRight
从右向左对数组中的所有元素调用指定的回调函数。该回调函数的返回值为累积结果，并且此返回值在下一次调用该回调函数时作为参数提供。具体用法：
array.reduceRight(callbackfn[,initialValue])
说明：
- 此语法与reduce方法完全相同，唯一不同的是它从数组右侧开始调用回调函数。
- 如果提供了initialValue，则reduceRight方法会按降序索引顺序对数组中的每个元素调用一次callbackfn函数。
- 如果未提供initialValue,则reduceRight方法会按降序索引顺序对每个元素（从倒数第二个元素开始）调用callbackfn函数。
使用reduceRight方法，以“：：”为分隔符，从右到左把数组元素的值连接在一起。
var s=[12,45,"good","important",23,56,99];
function joint(previousValue,currentValue){
return previousValue+"::"+currentValue;
}
var result=s.reduceRight(joint);
alert(result);
扫一扫
459
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
