TIPS:Angularで文字列/配列から部分文字列/要素を抜き出すには?(slice)JavaScriptのString/Arrayクラスにおけるsliceメソッドと同じように、Angularで文字列から部分文字列を抽出したり配列から特定範囲の要素を取得したりできるsliceパイプの基本的な使い方を説明する。※現在では、Web標準技術を利用したアプリ開発が広く普及し、そのためのフレームワークも多数存在しています。その中でも主流のフレームワークの1つである「Angular」を活用し、そのための知識を備えることには大きな意味があります。本連載は、Angularユーザーに向けて、その使いこなしTIPSを紹介するものです。Tips」を同サイトおよび筆者の了解を得たうえで、本フォーラムに移行したものです。Insiderで公開した状態のまま移行しているため、用語統一などの基準が@ITの通常の記事とは異なる場合があります。v2時点で執筆し、v4時点で内容を確認・検証しました。sliceパイプを利用することで、文字列から特定位置の部分文字列を取り出したり、配列から特定の要素だけを抜き出したりすることが可能になります。JavaScript標準のString#slice/Array#sliceメソッドに相当するパイプです。部分文字列を抜き出すまずは、文字列から部分文字列を抜き出す例から見ていきます。出力結果:文字列から抜き出された部分文字列まず、リスト2の1がsliceパイプの基本です。5〜7文字目を取得します*1。引数endを省略した2の例では、引数startで指定された位置から文字列の末尾までを取り出します。3のように引数startが文字列長を超えている場合には、そもそも文字列を取り出せないので、戻り値は空文字列です。文字列の先頭は0文字目とカウントします。引数endで指定される要素(この場合はインデックス7=8文字目)は抜き出す対象とはなりません(endで示す直前の要素までが取得されると考えるとよいでしょう)。4は、引数start/endに負数を指定した場合です。この場合、文字位置は文字列の末尾からカウントします。文字列の末尾は(0ではなく)-1と数える点に注意してください。配列から特定範囲の要素を取得する冒頭述べたように、sliceパイプは文字列だけでなく、配列にも適用できます。引数start/endの考え方は、文字列の場合と同じです。先ほどのサンプルと比べながら、結果を確認してください。メールマガジンをご購読ください。申し込みページへITmediaはアイティメディア株式会社の登録商標です。