この記事は、主に JavaScript の配列メソッドとループを紹介する javascript に関する関連知識を提供するものであり、非常に参考になり、皆様のお役に立てれば幸いです。
[関連する推奨事項: JavaScript ビデオ チュートリアル 、Web フロントエンド ]
1. 基本概念
JavaScript 配列は、複数の値を 1 つの変数に格納するために使用されます。同じデータ型を持つ 1 つ以上の値のコレクションです
2. 配列を作成する 3 つの方法
(1) JavaScript キーワード new を使用して Array オブジェクトを作成し、別途値を代入する
1 2 3 4 5 6 | let arr = new Array();
arr[0] = "html" ;
arr[1] = "css" ;
arr[2] = "javascript" ;
arr[3] = "java" ;
|
ログイン後にコピー
(2) 宣言時に値を代入する
1 2 | let arr1 = new Array( "html" , "css" , "java" , "javaweb" , "javascript" );
|
ログイン後にコピー
(3) 配列リテラルを使って直接作成する
1 2 | let arr2 = [ "html" , "css" , "java" , "javascript" , "javaweb" ];
|
ログイン後にコピー
とりあえず単純さ、読みやすさ、実行速度の点で、3 番目の方法 (配列テキスト方式) を使用してください。
3. 配列へのアクセス
(1) インデックス番号(添え字番号) を参照して配列要素を参照します。[0] はその要素です。配列の最初の要素。 [1]は2番目です。配列インデックスは 0 から始まります;
(2) 完全な配列には、配列名
(3) を参照することでアクセスできます。3) 配列要素を変更します。
4. 配列の共通プロパティ
length プロパティは、配列の長さ (配列要素の数) を返します。
1 | console.log(arr,arr.length);
|
ログイン後にコピー
5. 配列の一般的なメソッド
(1) join(): 配列のすべての要素を文字列に入れ、区切り文字で区切ります;
1 2 3 4 5 | let arr = new Array( "html" , "css" , "javascript" , "java" , "web" , "mysql" );
console.log(arr, typeof (arr));
let newarr = arr.join( "+" );
console.log(newarr, typeof (newarr));
|
ログイン後にコピー
(2)split()メソッドは区切り文字を介して文字列を配列配列型に変換します
1 2 3 4 5 6 7 |
let email = prompt( "请输入你的邮箱:" );
console.log(email);
let arr1 = email.split( "@" );
console.log(arr1, typeof (arr1));
document.write( "你的账号为:" +arr1[0]+ "<br>" + "你的网站时:" +arr1[1]);
|
ログイン後にコピー
上記 2 つの方法を使用して、文字列間のすべてのスペースを削除します。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | function trimAll(str){
let nowstr = str.trim();
let arr = nowstr.split( " " );
for (let i = 0;i<arr.length;i++){
if (arr[i] == "" ){
arr.splice(i,1);
i--;
}
}
return arr.join( "" );
}
let nowstr = trimAll( " 1 2 4 5 " );
console.log(nowstr);
|
ログイン後にコピー
(3) sort(): 配列を並べ替えます
1 2 3 4 5 6 7 8 9 10 | let arr = [31,23,26,76,45,1,90,6,24,56];
arr.sort( function (a,b){
return b-a;
});
console.log(arr);
|
ログイン後にコピー
注: 次のメソッドは配列自体を操作します
(4) Push(): 配列の末尾に 1 つ以上の要素を追加します。 、新しい長さを返します;
(5) Pop(): 配列の末尾の要素を削除します;
(6) unshfit(): 配列の先頭に要素を追加します配列;
(7) shfit(): 配列の先頭要素を削除;
(8) splice(): 汎用配列メソッド: 1. 配列内の要素を削除; 2.要素を追加する; 3. 要素を置き換える
1 2 3 4 5 6 7 8 9 10 11 12 | let arr = [ "html" , "java" , "csss" , "javascript" ];
console.log( "旧数组:" +arr);
arr.push( "weeb" );
arr.pop();
arr.unshift( "react" , "mysql" );
arr.shift();
arr.shift();
arr.splice(0,2);
arr.splice(3,2, "java" , "html" );
arr.splice(1,1, "javaweb" )
console.log( "新数组:" +arr);
|
ログイン後にコピー
6. 配列をループする一般的な方法
ループ: ループとは、次のときに特定の関数を繰り返し実行することです。条件が満たされています。1 つの操作です。
1. for ループを使用して配列を走査します。既知の条件と既知の長さです。最初に判断してからループします。
1 2 3 4 5 | let arr = new Array( "html" , "css" , "javascript" , "java" , "web" , "mysql" );
for (let i = 0;i < arr.length;i++){
document.write(arr[i]+ "<br>" );
}
|
ログイン後にコピー
2. while ループを使用して配列を走査します。未知の条件と未知の長さ。最初に判断してからループします。
1 2 3 4 5 6 | let i = 0;
while (i < arr.length){
document.write(arr[i]+ "<br>" );
i++;
}
|
ログイン後にコピー
3. do while 配列をループし、少なくとも 1 回実行します。
1 2 3 4 5 6 7 | let j = 0;
do {
document.write(arr[j]+ "<br>" );
j++;
}
while (j < arr.length);
|
ログイン後にコピー
4. for of 配列値をループします。直接要素の値
1 2 3 4 | for (let value of arr){
document.write(value+ "<br>" );
}
|
ログイン後にコピー
5. for in オブジェクトを介したループ i は key Key はオブジェクトをループするために特別に使用され、配列
1 2 3 4 | for (let i in arr){
document.write(arr[i]+ "<br>" );
}
|
ログイン後にコピー
6 をループすることもできます。配列メソッド 匿名コールバック関数 [配列をループ]
1 2 3 4 | arr.forEach( function (value,index,arr){
document.write(index+ "---" +value+ "----" +arr+ "<br>" );
})
|
ログイン後にコピー
7.map() 配列メソッドを使用する 配列を走査すると戻り値が得られます
1 2 3 4 5 6 7 8 9 10 11 12 |
let newarr = arr.map( function (value,index,oldarr){
document.write(index+ "---" +value+ "----" +oldarr+ "<br>" );
if (index == 0){
value = "12345" ;
}
return [value,index];
});
console.log(newarr);
|
ログイン後にコピー
8. flatmap() 配列メソッドを使用して走査します配列には戻り値があり、新しい配列も返します
1 2 3 4 5 6 7 8 9 10 11 |
let newarr1 = arr.flatMap( function (value,index,oldarr){
document.write(index+ "---" +value+ "----" +oldarr+ "<br>" );
if (index == 0){
value= "321" ;
}
return [value,index];
});
console.log(newarr1);
|
ログイン後にコピー
[関連する推奨事項 :JavaScript ビデオ チュートリアル、Web フロントエンド]
以上がJavaScript の配列メソッドとループについての詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。