ホームページ >ウェブフロントエンド >jsチュートリアル >ECMAScript 6の準備6:新しい文字列メソッド - String.Prototype。*

ECMAScript 6の準備6:新しい文字列メソッド - String.Prototype。*

William Shakespeare
William Shakespeareオリジナル
2025-02-15 10:10:12723ブラウズ

ECMAScript 6の準備6:新しい文字列メソッド -  String.Prototype。*

ES6アレイメソッドに関する以前の記事では、Arrayタイプで動作するECMAScript 6で利用可能な新しい方法を紹介しました。このチュートリアルでは、文字列で動作する新しいES6メソッドについて学びます:string.prototype。

いくつかの例を作成し、それらが利用できるポリフィルについて言及します。 1つのライブラリを使用してすべてポリフィルする場合は、Paul MillerがES6-Shimを使用できることを忘れないでください。

キーテイクアウト

string.prototype.startswith()およびstring.prototype.endswith()メソッドのメソッドを使用すると、文字列が特定のサブストリングで起動または終了するかどうかを確認できます。彼らは両方ともパラメーターとしてサブストリングと位置を受け入れ、文字列が提供されたサブストリングで始まるか終了するかによってTRUEまたはFALSEを返します。 String.Prototype.Includes()メソッドのメソッドは、文字列が別の文字列内に含まれている場合にtrueを返します。 startswith()およびendswith()メソッドと同じパラメーターを受け入れます。
    String.Prototype.Repeat()メソッドのES6のメソッドは、指定された数回繰り返される元の文字列を含む新しい文字列を返します。 string.raw()関数は、文字列をコンパイルし、プレースホルダーを提供された値に置き換えるテンプレート文字列のタグ関数です。
  • string.prototype.startswith()
  • すべての最新のプログラミング言語で最もよく使用される関数の1つは、文字列が特定のサブストリングで始まるかどうかを確認するものです。 ES6の前に、JavaScriptにはそのような機能がありませんでした。つまり、自分で書かなければなりませんでした。次のコードは、開発者が通常それをポリフィールした方法を示しています:
  • または、あるいは
これらのスニペットはまだ有効ですが、新しく入手可能なstring.prototype.startswith()メソッドが正確に再現していません。新しい方法には、次の構文があります:

サブストリングに加えて、2番目の引数を受け入れることがわかります。 SearchStringパラメーターは、確認するサブストリングを指定します。文字列の開始です。位置は、検索を開始する位置を示します。位置のデフォルト値は0です。文字列が提供されたサブストリングから始まり、それ以外の場合はstringがtrueを返します。この方法はケースに敏感であるため、「こんにちは」は「こんにちは」とは異なることを忘れないでください。

この方法の使用の例を以下に示します:
<span>if (typeof String.prototype.startsWith !== 'function') {
</span>  <span>String.prototype.startsWith = function (str){
</span>    <span>return this.indexOf(str) === 0;
</span>  <span>};
</span><span>}
</span>
<span>if (typeof String.prototype.startsWith !== 'function') {
</span>  <span>String.prototype.startsWith = function (str){
</span>    <span>return this.indexOf(str) === 0;
</span>  <span>};
</span><span>}
</span>

前のコードのライブデモを以下に示し、jsbinでも入手できます。

この方法は、Internet Explorerを除き、ノードおよびすべての最新のブラウザーでサポートされています。古いブラウザをサポートする必要がある場合は、この方法のポリフィルをMDNのメソッドのページに記載しています。別のポリフィルもMathias Bynensによって開発されました

string.prototype.endswith()

ご覧のとおり、この方法はstring.prototype.startswith()と同じパラメーターを受け入れ、同じタイプの値も返します。

違いは、文字列が長いかのように文字列内で検索できることです。言い換えれば、ストリングハウスを持っていて、「house」( 'us'、4)でメソッドを呼び出す場合、実際に弦楽屋を持っているようなものだからです(欠けている「e」に注意してください) 。
<span>if (typeof String.prototype.startsWith !== 'function') {
</span>  <span>String.prototype.startsWith = function (str){
</span>    <span>return this.substring(0, str.length) === str;
</span>  <span>};
</span><span>}
</span>

この方法の使用の例を以下に示します:

前のスニペットのライブデモを以下に示し、JSBINでも入手できます。

この方法は、Internet Explorerを除き、ノードおよびすべての最新のブラウザーでサポートされています。古いブラウザをサポートする必要がある場合は、この方法のポリフィルをMDNのメソッドのページに記載しています。別のポリフィルは、Mathias Bynensによって開発されました

string.prototype.includes()
<span>String.prototype.startsWith(searchString[, position]);
</span>
1つの文字列が別の文字列に含まれているかどうかを確認することについて話している間に、string.prototype.includes()メソッドを紹介します。文字列が別の文字列に含まれている場合、どこにいても、それ以外の場合はtrueが返されます。

その構文を以下に示します:

パラメーターの意味は、string.prototype.startswith()の場合と同じです。したがって、繰り返されません。この方法の使用の例を以下に示します:

以下のライブデモを見つけることができます。また、JSBINのように。

string.prototype.includes()は、インターネットエクスプローラーを除き、ノードおよびすべての最新のブラウザーでサポートされています。このチュートリアルで説明した他の方法と同様に、古いブラウザをサポートする必要がある場合は、Mathias Bynensが提供するポリフィルを見つけることができます(この男は自分の仕事をする方法を知っています!)、Mozilla開発者ネットワークで別のポリフィルを見つけることができます。

注:バージョン48まで、Firefoxは標準以外の名前が含まれています。
<span>const str = 'hello!';
</span><span>let result = str.startsWith('he');
</span>
<span>// prints "true"
</span><span>console.log(result);
</span>
<span>// verify starting from the third character
</span>result <span>= str.startsWith('ll', 2);
</span>
<span>// prints "true"
</span><span>console.log(result);
</span>
string.prototype.repeat()

次に、別のタイプのメソッドに進みましょう。 string.prototype.repeat()は、呼び出されたのと同じ文字列を含む新しい文字列を返すメソッドですが、指定された回数を繰り返します。この方法の構文は次のとおりです
<span>if (typeof String.prototype.startsWith !== 'function') {
</span>  <span>String.prototype.startsWith = function (str){
</span>    <span>return this.indexOf(str) === 0;
</span>  <span>};
</span><span>}
</span>

Timesパラメーターは、文字列を繰り返す必要がある回数を示します。ゼロを渡すと、空の文字列が得られますが、負の数や無限を渡すと、範囲が得られます。

この方法の使用の例を以下に示します:

前のコードのライブデモを以下に示し、JSBINでも入手できます。
<span>if (typeof String.prototype.startsWith !== 'function') {
</span>  <span>String.prototype.startsWith = function (str){
</span>    <span>return this.substring(0, str.length) === str;
</span>  <span>};
</span><span>}
</span>
この方法は、Internet Explorerを除き、ノードおよびすべての最新のブラウザーでサポートされています。古いブラウザをサポートする必要がある場合、この方法で2つのポリフィルを使用できます。1つはMathias Bynensによって開発され、もう1つはMozilla Developer Networkで開発されました。

string.raw()

このチュートリアルで説明したい最後の方法は、string.raw()です。テンプレート文字列のタグ関数

として定義されています

。興味深いのは、ライブラリのテンプレートに代わるものだからですが、実際にそれらのライブラリを置き換えるのに十分なスケーリングができるかどうかは100%確信していません。ただし、このアイデアは基本的にまもなく表示されるのと同じです。それがすることは、文字列をコンパイルし、すべてのプレースホルダーを提供された値に置き換えることです。

その構文は次のものです(バックテックに注意してください):

Templatestringパラメーターは、プロセスするテンプレートを含む文字列を表します。 この概念をよりよく理解するために、具体的な例を見てみましょう:

前のコードのライブデモを以下に示し、JSBINでも入手できます。

このメソッドは、オペラとインターネットエクスプローラーを除き、ノードおよびすべての最新のブラウザでサポートされています。古いブラウザをサポートする必要がある場合は、NPMで利用可能なこのようなポリフィルを使用できます。

結論
<span>String.prototype.startsWith(searchString[, position]);
</span>
このチュートリアルでは、ECMAScript 6で文字列で動作するいくつかの新しい方法について学びました。カバーしていないその他の方法は、string.fromCodePoint()、String.Prototype.CodePointat()、およびString.Prototype.Normalize()です。この記事を楽しんだことを願っています。また、ECMAScript 6の詳細を学ぶためにチャンネルに従って続けることを願っています。 ES6文字列メソッドについてよく尋ねる質問

ES6で導入された新しい文字列メソッドは、ECMAScript 2015としても知られています。これらには、startswith()、endswith()、()、repeat()、およびテンプレートリテラルなどの方法が含まれます。 startswith()メソッドは、文字列が指定された文字列で始まるかどうかをチェックし、endswith()は、文字列が指定された文字列で終了するかどうかをチェックします。 include()メソッドは、文字列に指定された文字列が含まれているかどうかをチェックします。 Repeat()メソッドは、指定された数回文字列を繰り返します。テンプレートリテラルを使用すると、$ {} syntaxを使用して、文字列リテラル内に式を埋め込むことができます。

startswith()メソッドは、es6?

es6のstartswith()メソッドをどのように使用して、文字列が指定された文字列の文字で始まるかどうかを判断するために使用されます。文字列が指定された文字列から始まり、それ以外の場合はfalseでtrueが返されます。構文はstr.Startswith(SearchString [、position])です。検索ストリングは、STRの開始時に検索されるキャラクターです。オプションの位置は、検索が開始される文字列の位置です。省略した場合、検索は文字列の先頭から始まります。指定された文字列の文字。文字列が指定された文字列で終了し、それ以外の場合はfalseで終了する場合にtrueが返されます。構文はstr.endswith(searchstring [、length])です。検索ストリングは、STRの終わりに検索されるキャラクターです。オプションの長さは、検索する文字列の長さです。省略すると、文字列の長さが使用されます。別の文字列内に見つかりました。文字列に指定された文字列が含まれている場合、それ以外の場合はfalseが含まれている場合にtrueが返されます。構文はstr.includes(searchstring [、position])です。検索ストリングは、検索する文字列です。オプションの位置は、検索を開始する文字列内の位置です。省略した場合、検索は文字列の先頭から始まります。指定された文字列のコピー数は、呼び出され、結合されました。構文はstr.Repeat(count)で、ここで、カウントは文字列を繰り返す回数です。カウントは0から無限の間でなければ、負の数ではない必要があります。

ES6でテンプレートリテラルはどのように機能しますか?マルチライン文字列と弦補間機能を使用できます。それらは、二重または単一の引用符の代わりに、バックチック()文字で囲まれています。テンプレートリテラルには、ドルサインとカーリーブレース($ {expression})で示されるプレースホルダーを含めることができます。プレースホルダーの式とそれらの間のテキストは関数に渡されます。 )メソッドは、文字列に指定された文字列が含まれているかどうかを確認するために使用されます。ただし、それらには重要な違いがあります。 include()メソッドはブール値を返します - 文字列に指定された文字列が含まれている場合はtrue、それ以外の場合はfalseです。一方、indexOF()メソッドは、指定された文字列の最初の発生のインデックスを返します。文字列が見つからない場合は-1。

すべてのブラウザでES6文字列メソッドを使用できますか?

​​

ほとんどの最新のブラウザーはES6文字列メソッドをサポートしています。ただし、ES6をサポートしていない古いブラウザの場合、BABELなどのトランスピラーを使用してES6コードをES5に変換する必要がある場合があります。 🎜>

いくつかのES6文字列メソッドは、配列で使用できます。たとえば、include()メソッドを使用して、配列に特定の要素が含まれているかどうかを判断できます。ただし、すべての文字列メソッドが配列に適用できるわけではありません。各メソッドの特定の使用と制限を理解することが重要です。タグ付きテンプレートを使用すると、テンプレートリテラルを関数で解析できます。タグ関数の最初の引数には、文字列値の配列が含まれています。残りの議論は式に関連しています。タグ関数は、これらの引数で操作を実行し、操作された文字列を返します。

以上がECMAScript 6の準備6:新しい文字列メソッド - String.Prototype。*の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。