ホームページ > ウェブフロントエンド > jsチュートリアル > js は文字列と配列の間の変換操作を実装します_javascript スキル

js は文字列と配列の間の変換操作を実装します_javascript スキル

WBOY
リリース: 2016-05-16 15:20:29
オリジナル
1219 人が閲覧しました

この記事では、JavaScript における文字列と配列の相互変換方法を紹介し、具体的な内容は次のとおりです。
文字列と配列の間の変換操作は実際のコーディングプロセスで頻繁に使用されるため、非常に重要であり、これはマスターする必要がある知識ポイントです。習得するには十分な練習が必要なわけではありません。簡単に説明します。
1. 文字列を配列に変換します
この操作では、split() 関数を使用します。この関数は、指定された文字を区切り文字として使用して文字列を配列に変換できます。コード例は次のとおりです。

var Str="abc-mng-zhang-mayi";
var newArray=Str.split("-");
console.log(newArray); 
ログイン後にコピー
出力からわかるように、split() 関数は文字列を配列に変換しました。


2. 配列を文字列に変換します
この操作は、Array オブジェクトの join() 関数を使用して実装できます。この関数は、配列内の要素を指定された文字で接続し、結果の文字列を返すことができます。
コードは次のとおりです:

var newArray=["abc","mng","zhang","mayi"];
var Str=newArray.join("-");
console.log(Str); 
ログイン後にコピー
上記のコードは要件を実装しており、「-」を使用して配列要素を接続し、文字列を生成します。

上記の 2 つの例では、すべて組み込み関数を使用しています。もちろん、独自の関数を作成することもできます。そのほうがより柔軟で、基本を理解できます。

3. カスタム文字列を配列に変換します

function StringToArray(str,substr) 
{ 
 var arrTmp=new Array(); 
 if(substr=="") 
 { 
 arrTmp.push(str); 
 return arrTmp; 
 } 
 var i=0,j=0,k=str.length; 
 while(i<k) 
 { 
 j=str.indexOf(substr,i); 
 if(j!=-1) 
 { 
  if(str.substring(i,j)!="") 
  { 
  arrTmp.push(str.substring(i,j)); 
  } 
  i = j+1; 
 } 
 else
 { 
  if(str.substring(i,k)!="") 
  { 
  arrTmp.push(str.substring(i,k)); 
  } 
  i=k; 
 } 
 } 
 return arrTmp; 
}
var Str="abc-mng-zhang-mayi";
console.log(StringToArray(Str,"-"));
console.log(StringToArray(Str,"-").length);
ログイン後にコピー
上記のコードには、文字列を配列に変換する関数も実装されています。

コードについてコメントしてみましょう。
コードのコメント: 1.function StringToArray(str,substr){}、この関数は変換に使用されます。str は変換される文字列、substr は区切り文字です。
2. var arrTmp=new Array()、分割された文字列フラグメントを格納する配列を宣言します。
3.if(substr=="") {arrTmp.push(str);return arrTmp;}、文字列区切り文字が空の場合、文字列全体が配列に入れられます。
4. var i=0,j=0,k=str.length; 3 つの変数を宣言し、k の値は文字列内の文字数です。
5.while(i 6.j=str.indexOf(substr,i)、文字列内で区切り文字が現れる位置を検出するために使用されます。indexOf() 関数が 2 つのパラメーターを取る場合、2 番目のパラメーターは指定された文字の開始位置を検索します。このコード セグメントは、次のコードと組み合わせて理解する必要があります。
7.if(j!=-1)、検索された区切り文字が存在する場合。
8.if(str.substring(i,j)!=""){}、開始位置から最初の区切り文字までの文字列をインターセプトします。
9.arrTmp.push(str.substring(i,j));、インターセプトした文字列を配列に入れます。
10.i=j+1; 検索の開始位置を区切り文字の次の文字に設定します。
11.else{}、検索がない場合。
12.if(str.substring(i,k)!=""){arrTmp.push(str.substring(i,k));}、最後の区切り文字の後の文字が空でない場合は、それを配列に追加します。
13.i=k、i を k に設定すると、ループが停止します。
14.return arrTmp; 配列を返します。

関連知識:
1.push() メソッドの定義と使用法:
このメソッドは、指定された配列の末尾に 1 つ以上の新しい要素を追加し、配列の長さを返すことができます。
注: 新しい要素は、新しい配列を作成するのではなく、元の配列に直接追加されます。
クリックすると、配列のその他のプロパティとメソッドが表示されます。
文法構造:

arrayObject.push(要素 1, 要素 2, ...., 要素 N)

パラメータリスト:

パラメータの説明
パラメータ(a...N) 必須。追加される新しい要素。

コード例:


var a = [1,2,3];
console.log(a.push("zhang","dao"));
ログイン後にコピー

2.indexOf() メソッドの定義と使用法: このメソッドは、文字列内で指定された文字列が最初に出現する位置を返します。
対応する文字列が取得できない場合、戻り値は -1 です。
注: この方法では大文字と小文字が区別されます。
文法構造:

stringObject.indexOf(substring,startindex)

コード例:


var a=new String("abcdefg")
console.log(a.indexOf("b"));
ログイン後にコピー
b は文字列 abcdefg の 2 番目に表示されます。出力結果: 1.

var a=new String("abcdefg")
console.log(a.indexOf("B"));

ログイン後にコピー
このメソッドでは大文字と小文字が区別されるため、文字列 abcdefg には大文字の B は含まれません。出力結果: -1。


var a=new String("abcdefg")
console.log(a.indexOf("e",4));
ログイン後にコピー
検索開始位置は4で、文字列の先頭から最初に出現する位置を計算します。出力結果:4.

3.substring() 関数。

4. カスタム配列を文字列に変換します

function ArrayToString(arr,str) 
{ 
 var strTmp=""; 
 for(var i=0;i<arr.length;i++) 
 { 
 if(arr[i]!="") 
 { 
  if(strTmp=="") 
  { 
  strTmp = arr[i]; 
  } 
  else
  { 
  strTmp=strTmp+str+arr[i]; 
  } 
 } 
 } 
 return strTmp; 
}
var newArray=["abc","mng","zhang","mayi"]; 
console.log(ArrayToString(newArray,"-"));
ログイン後にコピー

上記のコードは要件を満たしており、配列を文字列に変換できます。コードに関するコメントをいくつか示します。
コードのコメント:
1.function ArrayToString(arr,str){}、最初のパラメータは配列、2 番目のパラメータは接続文字列です。
2.var strTmp=""、空の文字列を宣言します。
3.for(var i=0;i 4.f(arr!=""){}配列要素が空でない場合。
5.if(strTmp=="") {strTmp=arr;}、文字列も空の場合、配列内のこの要素を文字列 strTmp に割り当てます。
6.else{strTmp=strTmp+str+arr}、それ以外の場合は文字列連結を実行します。
7.return strTmp、変換された文字列を返します。

上記は、js で文字列と配列の間で変換するための詳細なコードです。皆さんの学習に役立つことを願っています。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート