最も実用的なJS配列関数の整理
私たちは以前からJS配列に関する内容を整理してきましたが、今回は非常に実用的なJS配列の操作技術と書き方を整理して勉強してみましょう。
instance of
push()とpop()
逆転()
concat()
every()
filter()
1.文字列配列を|分割の形で出力します。例えば、「劉備𞓜張飛𞓜関羽」です。二つの方法で実現する。
instance of
;( ;)
// typeof ;
A instanceof B // A B ;
:
var arr = [1,2,3];
console.log(arr instanceof Array); //arr Array ;
Aray.isAray()
Array.isArray( ); // , ;
:
var arr = [1,2,3];
var num = 123;
console.log(Array.isArray(arr)); //true
console.log(Array.isArray(num)); //false
toString()
.toString(); // , [], ;
:
var arr = ["aaa","bbb","ccc"];
console.log(arr.toString()); // aaa,bbb,ccc
valueOf()
.valueOf(); // ;
:
var arr = ["aaa","bbb","ccc"];
console.log(arr.valueOf()); // ["aaa","bbb","ccc"]
配列.jin(パラメータ)
.join( ); // ;
console.log(arr.join()); // toString()
console.log(arr.join("|")); //
console.log(arr.join("&")); //
console.log(arr.join(" ")); // ,
console.log(arr.join("")); //
配列要素の追加と削除push()とpop()
1. .push() // ;
2. .pop() // ; ;
:
var arr = [1,2,3];
var aaa = arr.push("abc");// ;
console.log(arr);//
console.log(aaa);// ;
aaa = arr.pop();// ; ;
console.log(arr);//
console.log(aaa);//
unshift()とshift()
1. .unshift() // ;
2. .shift() // ; ;
:
var arr = [1,2,3];
aaa = arr.unshift("abc");// ;
console.log(arr);//
console.log(aaa);// ;
aaa = arr.shift();// ; ;
console.log(arr);//
console.log(aaa);//
配列要素の並べ替え逆転()
reverse() //
:
var arr1 = [1,2,3,4,5];
var aaa = arr1.reverse(); // [5,4,3,2,1]
sort()
sort() // ;( : )
// : Unicode ; ...
:
var arr = [4,5,1,3,2,7,6];
var aaa =arr.sort();
console.log(aaa); // [1, 2, 3, 4, 5, 6, 7]
console.log(aaa === arr);// true ( )
// ;
var arr2 = ["c","e","d","a","b"];
var bbb = arr2.sort();
console.log(bbb); // ["a", "b", "c", "d", "e"]
console.log(bbb===arr2); // true ( )
sort() // , ;
:
var arr = [4,5,1,13,2,7,6];
// : 1- 2; ; 2- 1; ;
arr.sort(function (a,b) {
return a-b; //
//return b-a; //
//return b.value-a.value; // value ;
});
console.log(arr); // [1, 2, 4, 5, 6, 7, 13]
ソフト()の底の原理
var aaa = bubbleSort([1,12,3], function (a,b) {
// return a-b;// :array[j]-array[j+1];
return b-a;// :array[j+1]-array[j];
});
console.log(aaa);
function bubbleSort(array,fn){
// , , -1;
for(var i=0;i<array.length-1;i++){
for(var j=0;j<array.length-1-i;j++){// , , ;
// ;
// if(array[j]>array[j+1]){// ; ;
//a-b>0 a>b ;
//b-a>0 a<b ;
// if(array[j]-array[j+1]>0){//
// if(array[j+1]-array[j]>0){//
// ;
if(fn(array[j],array[j+1])>0){
var temp = array[j];
array[j] = array[j+1];
array[j+1] = temp;
}
}
}
//
return array;
}
配列要素の操作concat()
1.concat( 2); // ;
var arr1 = [1,2,3];
var arr2 = ["a","b","c"];
var arr3 = arr1.concat(arr2);
console.log(arr3) // [1, 2, 3, "a", "b", "c"]
slice()
.slice( , ); // ;
:
var arr = [1, 2, 3, "a", "b", "c"];
console.log(arr.slice(3)); // 3 ;["a", "b", "c"]
console.log(arr.slice(0,3)); // ;[1, 2, 3]
console.log(arr.slice(-2)); // ;["b", "c"]
console.log(arr.slice(3,0)); // , [];[]
console.log(arr); // ;[1, 2, 3, "a", "b", "c"]
splice()
.splice( , , 1, 2,...); // ;
// ; /
:
var arr = [1,2,3,4,5,6,"a", "b", "c"]
arr.splice(5); // 3 ;( )
console.log(arr); // [1, 2, 3, 4, 5]
arr.splice(1,2); //( ) 1 2
console.log(arr); //[1, 4, 5]
//
var arr = [1,2,3,4,5,6,"a", "b", "c"];
console.log(arr.splice(3,3,"aaa","bbb","ccc")); //( )
console.log(arr); // [1, 2, 3, "aaa", "bbb", "ccc", "a", "b", "c"]
//
arr.splice(3,0,"aaa","bbb","ccc");//( )
//
console.log(arr);// ; [1, 2, 3, "aaa", "bbb", "ccc", "aaa", "bbb", "ccc", "a", "b", "c"]
indexOf/lastIndexOf
.indexOf( ); // , ( )
.lastIndexOf( ); // , ( )
:
var arr = ["a","b","c","d","c","b","b"];
console.log(arr.indexOf("b")); // 1
console.log(arr.lastIndexOf("b")); // 6
console.log(arr.indexOf("xxx")); // -1; -1;
配列反復(巡回)every()
, true,every true,
false, every false; false
, !!!
:
1. var arr = [111,222,333,444,555];
arr.every(function (a,b,c) {
console.log(a); //
console.log(b); //
console.log(c); // ;
console.log("-----"); // ;
// :c[b] = ; a= ;
return true;
});
2. //every bool , true true; false, false
var bool = arr.every(function (element, index, array) {
// : 200;
//if(element > 100){
if(element > 200){
return true;
}else{
return false;
}
})
alert(bool); //false
filter()
// , true
// ,return ture ;
:
var arr = [111,222,333,444,555];
var newArr = arr.filter(function (element, index, array) {
// , ;( )
if(element%2 === 0){
return true;
}else{
return false;
}
})
console.log(newArr); // [222, 444]
forEach()
// for ; ;
:
var arr = [111,222,333,444,555];
var sum = 0;
var aaa = arr.forEach(function (element,index,array) {
console.log(element); //
console.log(index); //
console.log(array); // [111, 222, 333, 444, 555]
sum += element; // ;
});
console.log(sum); //
console.log(aaa);//undefined; undefined
map()
// ,
// return ; return undefined;
:
var arr = [111,222,333,444,555];
var newArr = arr.map(function (element, index, array) {
if(index == 2){
return element; // return 333
}
return element*100; // 100
})
console.log(newArr); // [11100, 22200, 333, 44400, 55500]
私()
// , true, some true; , , !!!
:
var arr = [111,222,333,444,555];
var bool = arr.some(function (ele,i,array) {
// : 3
if(ele%3 == 0){
return true;
}
return false;
})
alert(bool); //true ; true
配列が空です
1. arr.length = 0; // ( , )
2. arr.splice(0); // ;
3. arr = []; // ; ( !)
// : , ; ;
: // arguments
fn(111,222,333);
function fn(){
arguments.length = 0; // [1, 2, 3]
arguments.splice(0); // arguments.splice is not a function
arguments = []; // , []
console.log(arguments);
}
配列事例1.文字列配列を|分割の形で出力します。例えば、「劉備𞓜張飛𞓜関羽」です。二つの方法で実現する。
var arr = [" "," "," "];
var separator = "|";
// for
var str = arr[0];
for(var i=1;i<arr.length;i++){
str += separator+arr[i];
}
console.log(str); // | |
//join() ;
console.log(arr.join("|")); // | |
2.文字列配列の要素の順番を反転します。[a","b","c",""d"-""d","c","b","a""。二つの方法で実現する。ヒント:i番目とlength-i-1個は交換します。
// .reverse()
var arr = ["a", "b", "c", "d"];
console.log(arr.reverse()); // ["d", "c", "b", "a"]
// :1. , ; 2. , ; 3. ;
for(var i=0;i<arr.length/2;i++){
var temp = arr[i];
arr[i] = arr[arr.length-1-i];
arr[arr.length-1-i] = temp;
}
console.log(arr);
3.給与の行列[1500,1200,2000,2100,1800]は、2000を超える給与を削除する。
var arr = [1500, 1200, 2000, 2100, 1800];
// filter() ;return true; ;
var newArr = arr.filter(function (ele, i, array) {
//2000 false;
if(ele<2000){
return true;
}else{
return false;
}
});
console.log(newArr); // [1500, 1200, 1800]
4.「c」、「a」、「z」、「a」、「x」、「a」の配列のそれぞれのaが現れる位置を見つけます。
var arr = ["c", "a", "z", "a", "x", "a"];
// (for/while/do...while) forEach();
arr.forEach(function (ele, index, array) {
// “a”, ;
if("a" === ele){
console.log(index);
}
});
5.一つの配列の重複要素を取り除く方法を編纂する(配列の重さを除く)
var arr = [" "," "," "," "," "," "];
// 1: : , , , , ;
var newArr = [];
//
arr.forEach(function (ele,index,array) {
// , , ;
if(newArr.indexOf(ele) === -1){// ;( , -1 )
newArr.push(ele);
}
});
console.log(newArr); // [" ", " ", " "]