TechAcademy（テックアカデミー） フロントエンドコース プログラミング JavaScript JavaScriptのArray型におけるsliceの利用方法について現役エンジニアが解説【初心者向け】
オーダーメイドコース
icon
icon
JavaScript

JavaScriptのArray型におけるsliceの利用方法について現役エンジニアが解説【初心者向け】

初心者向けにJavaScriptのArray型データにおけるsliceメソッドの利用方法について解説しています。sliceメソッドは配列から指定のデータを取り出すときに使用します。今回はsliceの使い方、実行結果を見ていきましょう。

テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社　調査期間：2021年8月12日～8月16日　 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名　 調査手法：インターネット調査

JavaScriptのArray型データにおけるsliceメソッドの利用方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。

 

そもそもJavaScriptについてよく分からないという方は、JavaScriptとは何なのかについて解説した記事を読むとさらに理解が深まるでしょう。

 

なお本記事は、TechAcademyのオンラインブートキャンプJavaScript/jQuery講座の内容をもとにしています。

 

 

田島悠介

今回は、JavaScriptに関する内容だね！

大石ゆかり

どういう内容でしょうか？

田島悠介

Array型データにおけるsliceメソッドの利用方法について詳しく説明していくね！

大石ゆかり

お願いします！

 

目次

 

Array型データとは

Array型データとは、配列を表すデータのことです。

配列は、同じ型式をもつデータを並べるために用います。

例えば、複数の値をまとめて扱うリストのようなオブジェクトを配列と呼びます。

配列の作成方法を1つとして[（ブラケット）で囲い、データをカンマで区切ることで複数のデータを配列にできます。

 

下記では、3つの文字列がnameArrayという変数に配列として格納されている状態です。

let nameArray = ['あああ', 'いいい', 'ううう'];

データを取り出す場合は、配列の後に[（ブラケット）で0から始まる要素数を指定しましょう。

 

そして、nameArrayから配列の1つ目のデータを取得する場合、下記のように記述します。

nameArray[0]; //あああ

 

[PR] コーディングで副業する方法とは

sliceとは

sliceとは配列であるArrayオブジェクトのメソッドです。

sliceメソッドを使うことで、配列から指定したデータをコピーして取り出せます。

 

sliceの使い方

配列を格納した変数、もしくは[（ブラケット）で囲った配列データに.slice()と記述しましょう。

引数は2つでどちらもオプショナル（省略可能）です。

 

第1引数は、データを取り出し位置を指定します。

例えば、2つ目のデータから取り出したい場合は、第1引数に1を指定しましょう。（要素数は0から始まるので2つ目は1となる）

また、第1引数を省略した場合は0を指定しのと同義です。

 

第2引数は、取り出しを終える直前の位置を指定する数です。

例えば、3つ目までとしたい場合は、第2引数に3を指定します。（要素数は0から始まるので3の前の2までとなる）

また、第2引数を省略した場合は配列の最後まで（Array.length）指定したタイミングと同様の動作が可能です。

 

sliceを利用して配列データの一部を取得してみよう

5つの文字列を格納した配列をnameArrayという変数に格納しています。

この配列にsliceメソッドを使って、結果をコンソールに出力するプログラムです。

出力結果をコードのとなりにコメントで記述しているため、引数の指定と結果を合わせて確認しましょう。

let nameArray = ['あああ', 'いいい', 'ううう', 'えええ', ' おおお'];

console.log( nameArray.slice() ); // ["あああ", "いいい", "ううう", "えええ", " おおお"]
console.log( nameArray.slice(1) ); //["いいい", "ううう", "えええ", " おおお"]
console.log( nameArray.slice(1, 3) ); //["いいい", "ううう"]

 

まとめ

配列のArrayオブジェクトのsliceメソッドを紹介しました。

引数の指定方法を把握することで自在にデータを取り出せます。

 

執筆してくれたメンター

横山茂雄（よこやましげお）

フリーエンジニアとして活動中。サーバーサイドからフロントまで時代の波に合わせてスキルを変化させてきました。

言語、フレームワーク、DB、現場、いずれも転々としながら、筋トレも欠かさない体育会系エンジニアです。

TechAcademyジュニアのゲームアプリコースを担当しています。

 

大石ゆかり

JavaScriptのArray型データにおけるsliceメソッドの利用方法がよく分かりやすくて良かったです！

田島悠介

ゆかりちゃん、これからも分からないことがあったら質問してね！

大石ゆかり

分かりました。ありがとうございます！

 

TechAcademyでは、初心者でもJavaScript・jQueryを使ったWebサービス公開を習得できるオンラインブートキャンプJavaScript/jQuery講座を開催しています。

挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。

記事を検索

関連するキーワード

関連する記事

JavaScriptで画像を表示する方法を現役エンジニアが解説【初心者向け】

JavaScriptで画像を表示する方法について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 目次 ...
JavaScript

JavaScriptでビンゴゲームを作る方法を現役エンジニアが解説【初心者向け】

JavaScriptでビンゴゲームを作る方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使って初心者向けに解説します。 J...
JavaScript

JavaScriptでHTMLのエスケープ処理を行う方法を現役エンジニアが解説【初心者向け】

JavaScriptでHTMLのエスケープ処理を行う方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使って初心者向けに解説します...
JavaScript

JavaScriptのgetElementByIdメソッドでHTMLの要素を取得する方法を現役エンジニアが解説

JavaScriptのgetElementByIdメソッドでHTMLの要素を取得する方法について、TechAcademyのメンター（現役エンジニア）が実際のコー...
JavaScript

JavaScriptでlastIndexOfメソッドを使って文字列を後ろから検索する方法を現役エンジニアが解説

JavaScriptでlastIndexOfメソッドを使って文字列を後ろから検索する方法について、TechAcademyのメンター（現役エンジニア）が実際のコー...
JavaScript

JavaScriptで真偽値と三項演算子を使う方法【初心者向け】

JavaScriptの使い方を初心者向けに紹介した記事です。 今回は、JavaScriptで真偽値と三項演算子を使う方法について、テックアカデミーのメンタ...
JavaScript

あわせてよく読まれている記事

PHPの配列でjoinメソッドを使う方法を現役エンジニアが解説【初心者向け】

PHPで配列を結合する方法について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 PHPではさまざまな方法で配列を結合できますので、この記事では用途に合わせた使い分けについて解説しています。 目次Array型データとはsliceとはsliceの使い方sliceを利用して配列データの一部を取得してみようまとめ執筆してくれたメンター そもそもPHPについてよく分からないという方は、PHPとは何なのか解説した記事を読むとさらに理解が深まります。   大石ゆかり PHPの配列を結合するにはどうしたらいいですか？ 田島悠介 配列を結合する方法はいろいろあるけど、array_mergeが使えるよ。 ただ連想配列でキーが同じだった場合に値が上書きされるよ。 大石ゆかり 連想配列？キー？上書き？　なんだか難しそうですね・・・ 田島悠介 聞いただけではイメージするのが難しいかもしれないね。 たとえば$sum[5]の「5」の数値が配列の添字、つまりキーだよ。 連想配列はこのキーが文字列の配列だね。 じゃあ、配列を結合する方法を実際のサンプルコードを使って説明するね。 大石ゆかり お願いします！ ※この解説記事では配列のキー（添字）が数値のものを添字配列といい、キーが文字列の連想配列と区別しています。PHPの配列については解説記事「PHPの配列の基本を現役エンジニアが解説【初心者向け】」を、連想配列については解説記事「PHPで連想配列を使う方法【初心者向け】」をご覧ください。   array_mergeで結合する方法 PHPで配列を結合するには、array_merge関数が使えます。 複数の配列をひとつに結合した配列を取得できます。 構文 結合された配列 = array_merge(配列1, 配列2); 配列1の後ろに配列2の要素が追加されて結合された配列が取得できます。 ※引数に指定する配列の数は、ひとつでも3つ以上でも指定できます。 ※結合された配列はarray_merge関数の戻り値で取得します。上記の構文だと配列1そのものが更新されるわけではありません。 配列のキーが同じ要素を結合すると？ 配列が連想配列（キーが文字列の配列）かどうかで結果が異なります。 キーが数値の添字配列の場合は、同じキーがあっても添字がゼロから振りなおされ、要素が追加されていきます。 キーが文字列の連想配列の場合は、同じキーがあると新しい要素に上書きされて追加にはなりません。 添字配列を結合する 配列のキーが数値の添字配列をarray_merge関数で結合すると、すべての要素のキーがゼロから振りなおされて追加されます。 ソースコード 色の名前が入った2つの配列 $colors1と$colors2の要素をarray_mergeで結合し、$colorsに代入します。 $colors1と$colors2の配列はキーが数値のため、結合したときにキーが降り直されます。 <?php $colors1 = array('赤', '緑', '青'); $colors2 = array('シアン', 'マゼンタ', '黄'); //配列を結合 $colors = array_merge($colors1, $colors2); //結合した配列を出力（preタグで改行させる） print_r('<pre>'); print_r($colors); print_r('</pre>'); ?> ※本来なら出力したいWebページ内で<html>タグなどを含める必要がありますが、今回はPHPのプログラムの解説が目的なので省略しています。基本的なPHPの書き方について詳しくは解説記事「基本的なPHPの書き方」をご覧ください。 表示結果 解説 $colors1 = array('赤', '緑', '青'); $colors1に3つの要素がある配列を代入しています。 配列 $colors1の中身は以下のように0から2のキーがあります。 Array ( [0] => 赤 [1] => 緑 [2] => 青 ) ※配列を作成するときに、値だけ指定すると自動的にゼロから始まる添字がついてキーが作成されます。配列の作成について詳しくは解説記事「PHPの配列の基本を現役エンジニアが解説【初心者向け】」をご覧ください。 $colors2 = array('シアン', 'マゼンタ', '黄'); $colors2にも3つの要素がある配列を代入しており、中身は以下の状態です。 Array ( [0] => シアン [1] => マゼンタ
PHP

JavaScriptでArrayオブジェクトを使う方法【初心者向け】

JavaScriptをプログラミング初心者向けに紹介した記事です。 今回は、JavaScriptの組み込み関数の1つ、JavaScriptでArrayオブジェクトを使う方法について解説します。 また、入門向けのJavaScriptの学習サイトもまとめて紹介しているので、合わせてご覧ください。   本記事では、テキストエディタのmiを使っていますが、JavaScriptの場合はWebブラウザとテキストエディタがあれば特別な開発環境がなくても開発することができます。   なお本記事は、オンラインブートキャンプ フロントエンドコース（JavaScript・jQuery講座）の内容をもとにしています。   今回の記事の内容は動画でもご覧いただけます。 テキストよりも動画の方が理解しやすいという場合はぜひご覧ください。   目次 組み込み関数のArrayオブジェクトとは Arrayオブジェクトを実際に生成してみよう Arrayオブジェクトのプロパティ・メソッドを呼び出してみよう 　プロパティ1. length（配列の長さを取得する） 　メソッド1. slice()（配列の要素を取り出す） 　メソッド2. reverse()（要素の順番をひっくり返す） 　メソッド3. push()（末尾に新しい要素を追加する） Arrayオブジェクトの任意の箇所を削除する 多次元配列を作成してみよう     組み込み関数のArrayオブジェクトとは 組み込み関数とは、JavaScrip側であらかじめ用意してくれているオブジェクトのことです。Arrayオブジェクトは、組み込み関数の1つで、配列を扱う際に使います。   参考までに、組み込み関数の代表的なものには次のようなものがあります。   <組み込み関数（代表的なもの）> String　文字列を扱う Number　数値を扱う Boolean　論理値を扱う Array　配列を扱う Date　日付を扱う Math　数値計算で扱う   はじめから関数の内容が決まっているので、こちらで定義する手間もなく、実行するだけ。非常に便利なので重宝します。 組み込みオブジェクトを使う場合、newを使って次のようにオブジェクトを生成します。 var オブジェクト名= new object();    大石ゆかり Arrayって配列のことですよね？配列もオブジェクトなんでしょうか？ 田島悠介 JavaScriptでは配列はオブジェクトなんだよね。 大石ゆかり 配列は無いんですか？ 田島悠介 配列をオブジェクトで包んで、関数を追加したりしてるんだよね。なので純粋な配列ではなくて、配列のような感じになってるんだよね。では、Arrayオブジェクトを生成してみよう！   [PR] コーディングで副業する方法とはArrayオブジェクトを実際に生成してみよう 適当なオブジェクト名（family）をつけ、Arrayオブジェクトを生成してみます。配列に関する様々なプロオパティやメソッドを出力することができます。 var family = new Array(); これでArrayオブジェクトが1つ生成されましたが、まだfamilyの箱の中身はからっぽの状態です。Taro・Jiro・Saburoを加え、console.logで呼び出してみます。 <!DOCTYPE html> <html lang = “ja”> <head> <meta charset = “utf-8″> <title>JavaScriptの練習</title> </head> <body> <script> var family= new Array("Taro", "Jiro", "Saburo"); console.log(family);
JavaScript

Rubyでsliceメソッドを使う方法を現役エンジニアが解説【初心者向け】

Rubyでsliceメソッドを使う方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。   Rubyについてそもそもよく分からないという方は、Rubyとは何なのか解説した記事を読むとさらに理解が深まります。   なお本記事は、TechAcademyのオンラインブートキャンプ、Ruby講座の内容をもとに紹介しています。   田島悠介 今回は、Rubyに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 Rubyでsliceメソッドを使う方法について詳しく説明していくね！ 大石ゆかり お願いします！   sliceメソッドとは 配列から指定された要素を返します。指定の要素を切り取る(slice)イメージです。 切り取りたい部分を指定する方法は主に3つあります。 「インデックスを一つ 指定」して、該当部分の要素を切り出す方法。 「指定位置から指定の長さを指定」して、該当部分の要素を切り出す方法。 「範囲を指定」して、該当部分の要素を切り出す方法。 配列だけでなく、文字列(String)クラスにも同名の slice メソッドがあります。使い方は一緒です。 ArrayクラスでもStringクラスでも メソッドの最後にビックリマーク(!)のついた破壊的メソッドがあります。 これはもとの配列や文字列を変化させるメソッドとなりますので、使用には注意が必要です。   sliceを使うメリットと使われるケース 配列や文字列から指定の要素を切り出すことができます。   [PR] コーディングで副業する方法とはsliceメソッドを使う方法 配列をインデックスする Arrayクラスのsliceメソッドを使用します。   文字列をインデックスする Stringクラスのsliceメソッドを使用します。   実際に書いてみよう # 配列を作成します。 arr = [0,1,2,3,4,5,6] # 配列から引数で指定した要素を slice します。 a1 = arr.slice(1) # 引数で指定した要素が slice されました。 p a1 #=> 1 # 配列はもとのままです。 p arr #=> [0,1,2,3,4,5,6] # 「指定位置から指定の長さ」の要素をまとめて取りだすこともできます。 # インデックス2から3つ分の要素を slice します。 a = arr.slice(2,3) # 引数で指定した要素が slice されました。 p a #=> [2,3,4] # 配列はもとのままです。 p arr #=> [0,1,2,3,4,5,6] # 引数は「範囲」で指定することもできます。 # インデックス2～3の要素を slice します。 a = arr.slice(2..3) # 引数で指定した要素が slice されました。 p a #=> [2,3] # 配列はもとのままです。 p arr #=>
Ruby

PHPで配列のkeyを取得する方法を現役エンジニアが解説【初心者向け】

今回は、PHPで配列のkeyを取得する方法について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 PHPで配列のkeyを取得することで、配列で使われているkeyを調べることができます。 実務でも配列のkeyを利用した値の操作を行いますので、ぜひ学習してみてください。   目次Array型データとはsliceとはsliceの使い方sliceを利用して配列データの一部を取得してみようまとめ執筆してくれたメンター   そもそもPHPについてよく分からないという方は、PHPとは何なのか解説した記事を読むとさらに理解が深まります。   田島悠介 今回は、PHPに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 PHPで配列のkeyを取得する方法について詳しく説明していくね！ 大石ゆかり お願いします！   この記事では、PHPで配列のkeyを取得する方法について記載しています。 まだPHPでの開発に慣れていない方でも理解できる内容です。   配列のkeyとvalueについて PHPでは連想配列という配列において、keyとvalueのセットで連想配列にデータを格納します。 配列とは、複数の値を入れる箱のようなものです。   通常の配列 通常の配列においては、添字（インデックス）という数字でデータ(value)の格納場所に番号を振っています。 配列サンプルコード <?php $array = ["りんご", "れもん", "もも"]; print_r($array); echo $array[1]; 配列実行結果 配列解説 <?phpでは、PHPプログラムを開始しています。 $array = [“りんご”, “れもん”, “もも”];では、$array配列に”りんご”, “れもん”, “もも”を代入しています。 print_r($array);では、$array配列を表示しています。 echo $array[1];では、$array配列の1番目のインデックスで指定した、れもんを表示しています。   連想配列 連想配列は、添字（インデックス）の代わりにデータ（value）を入れる箱に「key」という任意の名前をつけて管理します。 つまり、連想配列ではインデックスではなく、任意の文字列であるkeyを利用してvalueを抽出できます。 連想配列サンプルコード <?php $array = ["apple" => "りんご", "lemon" => "れもん", "peach" => "もも"]; print_r($array); echo $array["lemon"]; 連想配列実行結果 連想配列解説 <?phpでは、PHPプログラムを開始しています。 $array = [“apple” => “りんご”, “lemon” => “れもん”, “peach” => “もも”];では、$array配列に”apple” => “りんご”, “lemon” => “れもん”, “peach” => “もも”を代入しています。 print_r($array);では、$array配列を表示しています。 echo $array[“lemon”];では、$array配列のkeyであるlemonで指定した、れもんを表示しています。   array_keys関数の使い方 PHPのarray_keys関数は、連想配列の「key」だけを取得する関数です。 それでは、array_keys関数の使い方について見ていきましょう。   array_keys関数で「key」だけを抽出する 次のように、array_keys関数の引数に連想配列を渡すことで、「key」だけを抽出した配列として返却します。 array_keys($連想配列)   array_keys関数で検索するvalueとセットになっているkeyを抽出 第1引数に連想配列を渡し、第2引数に連想配列の中のvalueから検索したい値を渡すことで、検索するvalueとセットになっているkeyを抽出し配列にして返却します。 第3引数はオプションなので、必須ではありません。 第3引数は、boolean型のtrueを渡すことで、第2引数に渡した「検索するvalue」のデータ型まで完全に一致するものを連想配列の中から探します。 デフォルトではboolean型のfalseが設定されているので、データ型が完全に一致しなくても検索対象です。 boolean型というのは、trueかfalseの2つの値のどちらかになる型の値です。 array_keys($連想配列, $検索するvalue [, $型チェック = FALSE])   [PR] コーディングで副業する方法とはarray_keys関数で「key」だけを抽出する方法を実際に書いてみましょう ここでは、連想配列のkeyをすべて抽出する方法について見ていきましょう。   サンプルコード <?php $array = ["apple" => "りんご", "lemon" =>
PHP

JavaScriptで配列を分割する方法を現役エンジニアが解説【初心者向け】

JavaScriptで配列を分割する方法について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 目次Array型データとはsliceとはsliceの使い方sliceを利用して配列データの一部を取得してみようまとめ執筆してくれたメンター そもそもJavaScriptについてよく分からないという方は、JavaScriptとは何なのかについて解説した記事を読むとさらに理解が深まります。   田島悠介 今回は、JavaScriptに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 配列を分割する方法について詳しく説明していくね！ 大石ゆかり お願いします！   はじめに sliceメソッドは、JavaScriptの配列オブジェクトであるArrayのメソッドです。 配列の指定した範囲をコピーした、新しい配列を返します。   sliceメソッドについて sliceメソッドは、JavaScriptの配列オブジェクトであるArrayのメソッドで、配列の指定した範囲をコピーした新しい配列を返します。 指定した範囲をコピーしているため、もとの配列は変わりません。   sliceの引数は2つあります。 第1引数は、指定する範囲の始まりのインデックスです。 例えば、配列の2番目からとしたい場合は、第1引数は1（0から始まるため2番目のインデックスは1）です。 第2引数は、指定する範囲の終わりのインデックスであり、終わりのインデックスの直前までをコピーします。 例えば配列の4番目までとしたい場合は、第2引数は4（0から始まるインデックスの4番目の直前）です。 どちらも省略可能で、両方省略した場合は、最初から最後まで配列をまるごとコピーします。 第2引数のみを省略した場合は、第1引数で指定したインデックスから最後までとなる点を事前に理解しておきましょう。   [PR] コーディングで副業する方法とは配列を分割する方法 配列の分割は、sliceメソッドを使って分割したい範囲を指定することで実現可能です。 例えば、10個の要素を持つ配列を1〜5番目と6〜10番目までの2つに分割したい場合は、1回目のsliceメソッドの引数に0と5を指定して、1〜5番目をコピーします。 そして2回目のsliceメソッドの引数に5と10を指定して、6〜10番目をコピーしましょう。   実際に書いてみよう 1番目〜5番目という5つ文字列を持った配列に、sliceメソッドを使って動作を見ていきましょう。 引数の指定を3パターン実行していますので、結果を確認してください。 let array = ['1番目', '2番目', '3番目', '4番目', '5番目']; let array2 = array.slice(2); //3番目から最後まで let array3 = array.slice(2,4);//3番目から4番目まで let array4 = array.slice(); //全部 //結果 console.log(array); //["1番目", "2番目", "3番目", "4番目", "5番目"] console.log(array2); //["3番目", "4番目", "5番目"] console.log(array3); //["3番目", "4番目"] console.log(array4); //["1番目", "2番目", "3番目", "4番目", "5番目"]   まとめ sliceメソッドは範囲の指定方法だけわかれば使えます。 指定範囲をコピーするので、もとの配列はそのままで変わらないことに注意してください。   大石ゆかり JavaScriptで配列を分割する方法がよく分かったので良かったです！ 田島悠介 ゆかりちゃん、これからも分からないことがあったら質問してね！ 大石ゆかり 分かりました。ありがとうございます！   JavaScriptを学習中の方へ これで解説は終了です、お疲れさまでした。 つまずかず「効率的に」学びたい 副業や転職後の「現場で使える」知識やスキルを身につけたい プログラミングを学習していて、このように思ったことはありませんか？ テックアカデミーのフロントエンドコースでは、第一線で活躍する「プロのエンジニア」が教えているので、効率的に実践的なスキルを完全オンラインでしっかり習得できます。 合格率10%の選考を通過した、選ばれたエンジニアの手厚いサポートを受けながら、JavaScript・jQueryを使ったWebサービス開発を学べます。 まずは一度、無料体験で学習の悩みや今後のキャリアについて話してみて、「現役エンジニアから教わること」を実感してみてください。 時間がない方、深く知ってから体験してみたい方は、今スグ見られる説明動画から先に視聴することをおすすめします！
JavaScript

Rubyで文字列を削除する方法を現役エンジニアが解説【初心者向け】

Rubyで文字列を削除する方法について解説します。   そもそもRubyについてよく分からないという方は、Rubyとは何なのか解説した記事を読むとさらに理解が深まります。 なお本記事は、TechAcademyのオンラインブートキャンプRuby講座の内容をもとに紹介しています。   田島悠介 今回は、Rubyに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 Rubyで文字列を削除する方法について詳しく説明していくね！ 大石ゆかり お願いします！   slice, slice!メソッドの書き方 sliceメソッド、slice! メソッドは文字列から、開始位置と取得文字数を指定して取り出すメソッドです。 str.slice(3, 5) のように指定すると、strの4文字目(インデックスが3の持ち)から5文字分を取り出します。 slice! メソッドは破壊的なメソッドで、元の文字列は取り出した文字列を除いたものになるので注意しましょう。   delete, delete!メソッドの書き方 deleteメソッド、delete!メソッドは文字列から、指定の文字列を削除するメソッドです。 str.delete(“abc”) のように指定すると、strからabcを削除します。   [PR] コーディングで副業する方法とは指定した文字を文字列から削除する方法 delete メソッドを使うことで、指定した文字を文字列から削除できます。   指定した位置（または範囲）の文字を文字列から削除する方法 slice! メソッドを使うことで、指定した位置（または範囲）の文字を文字列から削除できます。   実際に書いてみよう 指定した文字を文字列から削除する方法 delete, delete! メソッドから練習しましょう。   irb(main):001:0> str = "abcdaaefaagh" => "abcdaaefaagh" irb(main):002:0> str.delete("a") => "bcdefgh" irb(main):003:0> str => "abcdaaefaagh" irb(main):004:0> str.delete!("a") => "bcdefgh" irb(main):005:0> str => "bcdefgh"   指定した位置（または範囲）の文字を文字列から削除する方法 続いて slice, slice! メソッドです。slice! メソッドを使うことで、特定範囲の文字を削除できます。   irb(main):001:0> str = "0123456789" => "0123456789" irb(main):002:0> str.slice(0, 1) => "0" irb(main):003:0> str.slice(3, 5) => "34567" irb(main):004:0> str => "0123456789" # slice! メソッドで 2文字目から8文字分を取り出し irb(main):005:0> str.slice!(1, 8) => "12345678" # 元の文字列は slice! メソッドで取り出されたものを除いたものに変化 irb(main):006:0> str => "09"   筆者プロフィール メンター稲員さん フリーランスエンジニア。 大手SEからフリーランスのWeb系エンジニアにジョブチェンジ。 経験言語：Ruby、Rails、Python、C/C++、Java、Perl、HTML/CSS3、JavaScript、CoffeeScript,Node.js。 おうち大好きマンです。   大石ゆかり 内容分かりやすくて良かったです！ 田島悠介 ゆかりちゃんも分からないことがあったら質問してね！ 大石ゆかり 分かりました。ありがとうございます！   TechAcademyでは、初心者でもRuby on Railsを使ったプログラミングを習得できるオンラインブートキャンプRuby講座を開催しています。 挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。
Ruby

あなたの目的に合わせて学べるコース

副業したい方

Web制作の力を身につけ
副業までサポート

はじめての副業コース

転職したい方

未経験から
Webエンジニアに

Webエンジニア転職保証コース

スキルアップしたい方

AIも統計解析もできる
Pythonを学ぶ

Pythonコース

※ 経済産業省の行うリスキリングを通じたキャリアアップ支援事業の補助金対象コースです。条件を満たすことで支払った受講料の最大70％がキャッシュバックされます。詳しくは こちら のページをご確認ください。

TechAcademyから
現役エンジニアの方へ
お知らせ

オーダーメイドコース
TechAcademy（テックアカデミー） フロントエンドコース プログラミング JavaScript JavaScriptのArray型におけるsliceの利用方法について現役エンジニアが解説【初心者向け】