TechAcademy（テックアカデミー） Webデザインコース WebデザインHTMLHTMLで特殊文字のエスケープ処理を行う方法【初心者向け】
HTML

HTMLで特殊文字のエスケープ処理を行う方法【初心者向け】

初心者向けにHTMLで特殊文字のエスケープ処理を行う方法について解説しています。ブラウザ上では何が起きてるか分からないかもしれないですが、サイトのセキュリティ的にも大事な部分なので、ぜひ実際に書いて慣れていきましょう。

TechAcademyマガジンはオンラインのプログラミングスクールTechAcademy [テックアカデミー]が運営する教育×テクノロジーのWebメディアです。初心者でもすぐ勉強できる記事が2,000以上あります。

HTMLで特殊文字をエスケープする方法について解説しています。

特殊文字を表示したい際に便利な文字なので、書き方を覚えるというよりどんな種類があるのか知っておくだけでも役に立つでしょう。

HTMLについてそもそもよく分からないという方は、HTMLとは何なのか解説した記事をまずご覧ください。

 

なお本記事は、TechAcademyのWebデザインオンラインブートキャンプのカリキュラムをもとに執筆しています。

 

特殊文字とは

特殊文字とは、<>や”といったHTMLを書く際に使う記号や、©や£のような通常の文字とは異なる特別な文字のことを指します。

 

エスケープとは

エスケープとは、HTML上で特殊文字を期待通りに表示するために施す処理のことです。

特殊文字に指定されている文字は、割り当てられている記号を記述することで、表示することができます。

例えば、<は&lt;であったり、©は&copy;など、特殊文字には必ず該当する記号が割り当たっています。

 

[PR] HTML/CSSで挫折しない学習方法を動画で公開中

エスケープしない危険性

あなたがフォームなどで閲覧している人が文字を入力して送信するなどのサイトを作った場合があるとします。

この時、エスケープ処理を施さないことで、クロスサイトスクリプティング（XSS）という攻撃の標的にされることがあります。

詳細は省きますが、第三者が自由に入力できる部分がサイト内にあった場合は、エスケープ処理を怠らないようにしましょう。

 

実際に書いてみよう

それでは実際に書いてみましょう。

escape.html
----------------------------------------------------------
<html>
  <head>
    <title></title>
    <meta charset="utf-8" />
  </head>
  <body>
    <strong>この文字列は太くなります。</strong>
    <br />
    &lt;strong&gt;この文字は太くなりません。&lt;/strong&gt;
    <br />

    <h1>よく使う特殊記号</h1>

    &amp;(アンパサンド)
    <br />
    &lt;(小なり)
    <br />
    &gt;(大なり)
    <br />
    &quot;(ダブルクォーテーション)
    <br />
    &nbsp;（空白）
    <br />
    &copy;（コピーライト）
  </body>
</html>
----------------------------------------------------------

ブラウザで表示してみます。

 

それぞれの特殊記号が正常に表示されていることがわかります。

 

以上、特殊文字をエスケープする処理の流れを解説しました。特殊文字をブラウザ上に表示させたい場合は、参考にしてみてください。

現役エンジニアから学べる無料のプログラミング体験会もオンラインで実施しているので、ぜひ参加してみてください。

 

また、TechAcademyでは初心者でも最短4週間でオリジナルWebサイトを公開できるWebデザインオンラインブートキャンプを開催しています。

現役のWebデザイナーがパーソナルメンターとして受講生に1人ずつつき、マンツーマンのメンタリングで学習をサポートし、最短4週間でオリジナルのWebサイトを開発することが可能です。

独学に限界を感じている場合はご検討ください。

記事を検索

関連するキーワード

関連する記事

これだけは覚えておきたい！絶対パスと相対パスの違いとは【初心者向け】

HTMLについて今さら聞けない！という初心者のために、HTMLの基礎を紹介する記事です。 今回は、HTMLの絶対パスと相対パスの違いについて解説します。 ...
HTML

フォーム作成に必須！HTMLでlabelタグを使う方法【初心者向け】

HTMLでlabelタグを使う方法について解説しています。 問い合わせフォームやアンケートフォームを作る上では重要な知識になるので、ぜひlabelの書き方...
HTML

HTMLで略語を表現する方法 - abbr【初心者向け】

HTMLについて今さら聞けない！という初心者のために、HTMLの基礎を紹介する記事です。 今回は、HTMLの略語・名前の特記・住所表現 について解説します...
HTML

入門から応用まで！HTMLの学習に役立つリファレンスサイト10選

HTMLで作りたい機能があるのに方法がわからない時、大きな味方になってくれるのが、リファレンスサイトです。 今回はそんなHTMLのリファレンスサイトを10...
HTML

コーディングの基礎！HTMLでdivタグを使う方法【初心者向け】

HTMLで書くdivタグの使い方を解説しています。 コーディングする上で基礎の基礎にあたるので、HTMLを身につけようと思っている人は必須で覚えておきまし...
HTML

3種類の書き方を覚える！HTMLで空白を作る方法【初心者向け】

HTMLを書いていて、文字と文字の間を少し離したいことがたびたびあります。 しかし、HTMLに慣れないうちは思ったように空けたくても空けられないこともしば...
HTML

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

いざという時に便利！HTMLで特殊文字を扱う方法【初心者向け】

HTMLで特殊文字を扱う方法について解説しています。コードをサイト上に表示させるために必要な知識になるので、いざという時に便利でしょう。 HTMLについてそもそもよく分からないという方は、HTMLとは何なのか解説した記事をまずご覧ください。   なお本記事は、TechAcademyのWebデザインオンラインブートキャンプのカリキュラムをもとに執筆しています。   特殊文字とは 特殊文字とは、「a」や「b」などとは少し違った特殊な文字のことを指します。 例えば”<“という文字を入力したいとしても、”<“は”<“という文字として認識されず、<div>や<p>などのタグの始めとして認識されてしまいます。 しかしそれでは”<“という文字を打つことはできません。 そのため”<“は特殊文字という部類で定義され、ある特殊な文字列を打ち込むことでそれがHTML内で”<“に変換され、それを表示するという仕組みになっています。   大石ゆかり 特殊文字って何ですか？ 田島悠介 要するに、タグそのものを表示したい場合どうするのか？ってことなんだよ。 大石ゆかり タグを書いても表示されるのは中身で、タグ自体は表示されませんね。 田島悠介 そうそう。そんな時に使うのが、特殊文字なんだ。とりあえず例を見てみよう。 大石ゆかり はい！   特殊文字の表記方法 特殊文字は&の後に特定の文字列を入力することで特殊文字として認識されます。 &quot; => “” &amp; => & 一見何を書いているのかわからず、最初は戸惑うことが多いと思います。 特にPHPなどのプログラミング言語と混ざって記入してある場合、何を意味するのかわからないと、コードを読むことができなくなってしまいます。 特殊文字はとても種類が多いですが、よく使用される文字は限られているので、その文字を覚えておくと良いでしょう。   [PR] HTML/CSSで挫折しない学習方法を動画で公開中実際に書いてみよう それでは実際に特殊文字を使用してみましょう。 &quot; => ダブルクォーテーション &amp; => & &lt; => 小なり &gt; => 大なり よく使用される特殊文字は上の4つです。 ぜひ覚えておくようにしましょう。   まとめ 今回は特殊文字について解説していきました。 特殊文字は一見マニアックな知識に感じますが、実際のデザインの現場では何度も出てくる場面があります。 とっつきにくそうでも覚えておけば、役に立つ事まちがいないのでぜひ勉強しておくようにしましょう。   大石ゆかり ltとgtについてはわかりました。タグに使われる文字をHTML上で表示したいときに使えますね。でも、＆(アンパサンド)は？ 田島悠介 ややこしいんだけど、特殊文字自体を表示したい場合に使うんだよ。 大石ゆかり HTMLとして特殊な役割がある文字を表示したい場合に使うのが特殊文字。その特殊文字を表示したい場合に使う特殊文字もあるんですね。複雑ですね。 田島悠介 上の例にあるように、ltやgtを入力すると、開始タグと終了タグの文字が表示されるよね。ただ、今度は＆lt;って文字を表示する際に困ってしまうんだ。そこで＆を特殊文字で表示するんだよ。   [お知らせ]TechAcademyでは初心者でも最短4週間でオリジナルWebサイトを公開できるWebデザインオンラインブートキャンプを開催しています。
HTML

JavaScriptでエスケープ処理を行う方法【初心者向け】

JavaScriptで書くエスケープ処理を行う方法について解説しています。 セキュリティ対策のためにも知っておきたい知識なので、書き方を覚えておきましょう。 また、入門向けのJavaSriptを学習できるサイトも紹介しているので、合わせてご覧ください。   なお本記事は、オンラインブートキャンプ フロントエンドコース（JavaScript・jQuery講座）の内容をもとにしています。   エスケープ処理(エスケープシーケンス)とは エスケープ処理（エスケープシーケンス）とは、JavaScriptで特殊な文字を入力する際に￥（円マーク）か\（バックスラッシュ）を前につけて表示する方法です。 ￥（円マーク）か\（バックスラッシュ）のどちらかというところですが、基本的には同じキーです。 設定されているフォントによって￥を押したら、\（バックスラッシュ）で表示される環境もありますし、￥のまま表示される環境もあります。   現在では、UTF環境が一般的だということもあり、￥のキーを押すことで、\（バックスラッシュ）で表示されます。 また、日本語キーボードでは￥キーですが、英語キーボードでは\（バックスラッシュ）キーを使用します。 何故、英語キーボードでは￥ではなく、\（バックスラッシュ）かというと、そもそも英語キーボードを使用する国の通貨が￥（日本円）では無いためです。   エスケープ処理（エスケープシーケンス）一覧 使用文字 エスケープシーケンス後の意味 \b バックスペース \t 水平タブ \v 垂直タブ \n 改行 \r 復帰 \f 改ページ \’ シングルクオーテーション \” ダブルクオーテーション \¥ ¥文字 \0 NULL文字 \xXX Latin-1文字（XXは16進数） \uXXXX Unicode文字（XXXXは16進数）   エスケープ処理の書き方 例えば、”1行目2行目”という文字列をデベロッパーツールのconsoleに表示してみましょう。 まずは、開業せずにそのまま表示します。 プログラム console.log("1行目2行目"); 表示結果 1行目2行目   次に、改行キーであるEnterを押して次のようなコードで実行してみましょう。 すると次のように文法エラーになってしまいます。 プログラム console.log("1行目 2行目"); 表示結果 Uncaught SyntaxError: Invalid or unexpected token   人間の目から見ると1行目と2行目の間には改行が入っていますが、コンピューターから見ると改行はなく、単に文法に間違いが有るように見えているようです。 そこで、エスケープ処理（エスケープシーケンス）を使用してみます。 すると表示結果のように、1行目と2行目の間に改行が入った状態で表示されます。 エスケープ処理（エスケープシーケンス）を行わないと、改行を表示することができませんでした。 プログラム console.log("1行目\n2行目"); 表示結果 1行目 2行目   [PR] HTML/CSSで挫折しない学習方法を動画で公開中実際にエスケープ処理（エスケープシーケンス）を書いてみよう シングルクォートの中にシングルクォートを表示 JavaScriptの文法上次のようにシングルクォートの中にシングルクォートを表示することはできません。 プログラム console.log('Tech's academy'); 表示結果 Uncaught SyntaxError: missing ) after argument list   通常はシングルクォートを文字列として使用したい場合は、次のようにダブルクオーテーションで囲む必要があります。 プログラム console.log("Tech's academy"); 表示結果 Tech's academy   この処理を、エスケープ処理（エスケープシーケンス）を使用して処理すると次のようになります。 プログラム console.log('Tech\'s academy'); 表示結果 Tech's academy   まとめ 人間の目からすれば、エスケープ処理（エスケープシーケンス）せずに書いても動く方が便利だと思えるかもしれません。 しかし、コンピューターにとっては、エスケープ処理（エスケープシーケンス）を行わないと、意図する処理を行ってくれません。 したがって、エスケープ処理（エスケープシーケンス）を理解することで、意図する処理ができるようになります。   また、TechAcademyではJavaScriptを使ってWebサービスを公開できるオンラインブートキャンプ フロントエンドコース（JavaScript・jQuery講座）を開催しています。 プログラミングの初心者でも受講可能です。Webサイトの表現の幅を広げたいという方はぜひご覧ください。
JavaScript

Javaでエスケープ処理を行う方法【初心者向け】

この記事では、Javaでエスケープ処理を行う方法について解説します。 実際にプログラムを書いて説明しているので、ぜひ理解しておきましょう。   なお本記事は、TechAcademyのJava講座の内容をもとに作成しています。   田島悠介 今回は、Javaに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 エスケープ処理を行う方法について詳しく説明していくね！ 大石ゆかり お願いします！   エスケープシーケンスとは Javaでは「”（＝ダブルクォーテーション）」で囲んだ内容を文字列とみなしますが、例えばこの「”」という記号そのものを出力したい場合どうすれば良いでしょうか？ 単純に「System.out.println(“””);」と書いてもエラーになってしまいます。これは、2番目の「”」が文字列の内容ではなく、終端を表す記号とみなされてしまうからです。 この問題を解消するために使用するのが「エスケープシーケンス」です。 上記の「”」の例であれば、「System.out.println(“\””);」とします。この「\”」というのがエスケープシーケンスです。この2文字で「”」という記号を表しています。 Javaでは「”」以外にも、改行やtab等、そのままでは文字列として扱えないものがあり、それぞれに対して「エスケープシーケンス」が用意されています。 （例）改行→「\n」、tab→「\t」   エスケープ処理とは プログラム内で使用できない文字を、代替の文字に置き換えることをエスケープ処理と言います。 前述のエスケープシーケンスを使用した文字の置換もエスケープ処理のひとつです。 エスケープシーケンスはJavaの制約に基づくものですが、仕様上の理由により独自の制限を設けたい場合もあります。 例えばJavaが出力したファイルを他のプログラムが読み込む様なシステムの場合、相手側プログラムの仕様に合わせてJava側が出力内容にエスケープ処理を施す必要があったりします。   [PR] HTML/CSSで挫折しない学習方法を動画で公開中実際に書いてみよう 下記のサンプルプログラムはエスケープシーケンスを使用して改行（\n）とタブ（\t）を出力します。 ひとつの文字列の中に改行とタブを連結して出力しています。 ソースコード package escapetest; public class EscapeSample { public static void main(String[] args) { EscapeSample escapeSample = new EscapeSample(); escapeSample.print(); } private void print() { StringBuilder sBuilder = new StringBuilder(); String h1 = "大見出し"; String h2 = "中見出し";
Java

JavaScriptで文字列を操作する方法【初心者向け】

JavaScriptについてプログラミング初心者向けに紹介した記事です。 今回は、JavaScriptで文字列を使う方法について解説します。 また、入門向けにJavaScriptを学習できるサイトを紹介しているので、合わせてご覧ください。   本記事では、テキストエディタのmiを使っていますが、JavaScriptの場合はWebブラウザとテキストエディタがあれば特別な開発環境がなくても開発することができます。   なお本記事は、オンラインブートキャンプ フロントエンドコース（JavaScript・jQuery講座）の内容をもとにしています。   今回の記事の内容は動画でもご覧いただけます。 テキストよりも動画の方が理解しやすいという場合はぜひご覧ください。   目次 JavaScriptで文字列を出力する JavaScriptで文字列を連結させる JavaScriptで特殊文字（エスケープシーケンス）を使う 　タブ（空白）：\t 　シングルコーテーション：\’ 　改行：\n   大石ゆかり 田島メンター！文字列について教えてほしいです。 田島悠介 文字列は必ずシングルコーテーションかダブルコーテーションで囲うというルールがあるんだよ。 大石ゆかり どちらでもいいんですか？何か違いはあるんでしょうか？ 田島悠介 違いを含めて、文字列について見てみよう！   JavaScriptで文字列を出力する JavaScriptで文字列を出力したいときは、「“　”（ダブルコーテーション）」か「‘　’（シングルコーテーション）」で囲います。どちらを使っても違いはないので、お好きなほうで構いません。   実際に「こんにちは」と出力してみます。 <!DOCTYPE html> <html lang=”ja”> <head> <meta charset=”utf-8″> <title>はじめてのJavaScript</title> </head> <body> <script> var x; x = "こんにちは" document.write(x); </script> </body> </html>   また、「I’m happy」のように「’」を含んだ文字列を表示させたいときは、「” “」で囲むとバグらず表示されますので、上手に使い分けましょう。 <script> var x;
JavaScript

Pythonでバックスラッシュを使ってエスケープする方法【初心者向け】

Pythonでバックスラッシュを使ってエスケープする方法について解説します。 Pythonについてそもそもよく分からないという方は、Pythonとは何なのか解説した記事をまずご覧ください。   なお本記事は、TechAcademyのPythonオンライン講座の内容をもとにしています。   田島悠介 今回は、Pythonに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 バックスラッシュを使ってエスケープする方法について詳しく説明していくね！ 大石ゆかり お願いします！   バックススラッシュとは Python で文字列を表現するときは、ダブルクォーテーション、またはシングルクォーテーションで囲って以下のように記述します。 "こんにちは！" 'こんにちは！' では、文字列の中で改行を表現したり、ダブルクォーテーションで囲った文字列の中でダブルクォーテーションを表現するにはどうしたら良いでしょうか。このような、特殊な文字を表現する際に使用するのがバックスラッシュです。 例えば、改行を表現するにはバックスラッシュを使い「\n」と記載します。 なお、バックスラッシュは、パソコンがMac と Windows の場合で入力方法と表示が異なります。 Mac の場合は option を押しながら ¥ を押すと「\」と表示されます。 Windows の場合は 「/」の右隣りの「\」キーを押すと「¥」と表示されます。   エスケープする書き方 バックスラッシュを用いて特殊な文字を表現することをエスケープシーケンスといいます。代表的なエスケープシーケンスには以下のような種類があります。 エスケープシーケンス 意味 \a ベル \b  バックスペース \f 改ページ \n 改行 \r キャリッジリターン \t 水平タブ \v 垂直タブ \\ 「\」そのもの \” 「”」ダブルクォーテーション \’ 「’」シングルクォーテーション \nnn 8進数nnnでASCIIコードの文字を指定 \xhh 16進数nnでASCIIコードの文字を指定 \uhhhh 16進数hhhhでUnicodeの文字を指定 \0 NULL 改行コードはMacやLinuxの場合「\n」ですが、Windowsの場合は「\r\n」で表現されます。 また、「\a」「\f」「\v」はテレタイプという初期のコンピューター環境で利用されていました。現在利用することはほとんどありません。   [PR] HTML/CSSで挫折しない学習方法を動画で公開中実際に書いてみよう 今回のサンプルプログラムでは、エスケープシーケンスを使った例をいくつか確認していきます。プログラムは Python インタプリタで入力していきます。はじめに以下のプログラムを入力しましょう。 print("こんにに\bちは！\n\"Python\"の世界へようこそ！") 実行結果は以下のようになります。 こんにちは！ "Python"の世界へようこそ！ 「\b」により直前の文字「に」が削除され、「\n」により改行が行われています。また「\”」でダブルクォーテーションが出力されています。「\n」や「\”」、「\’」がエスケープシーケンスで最も多く利用される表現です。 次に以下のプログラムを実行します。 print("\101\102\x63\x64") 実行結果は以下のようになります。8進数と16進数でASCIIコードの文字を指定しています。 ABcd 最後に以下のプログラムを実行します。 print("\u3042\u3044\u3046") 実行結果は以下のようになります。16進数でUnicodeの文字を指定しています。 あいう   この記事を監修してくれた方 太田和樹（おおたかずき） ITベンチャー企業のPM兼エンジニア 普段は主に、Web系アプリケーション開発のプロジェクトマネージャーとプログラミング講師を行っている。守備範囲はフロントエンド、モバイル、サーバサイド、データサイエンティストと幅広い。その幅広い知見を生かして、複数の領域を組み合わせた新しい提案をするのが得意。 開発実績：画像認識技術を活用した駐車場混雑状況把握（実証実験）、音声認識を活用したヘルプデスク支援システム、Pepperを遠隔操作するアプリの開発、大規模基幹系システムの開発・導入マネジメント 地方在住。仕事のほとんどをリモートオフィスで行う。通勤で消耗する代わりに趣味のDIYや家庭菜園、家族との時間を楽しんでいる。   大石ゆかり 内容分かりやすくて良かったです！ 田島悠介 ゆかりちゃんも分からないことがあったら質問してね！ 大石ゆかり 分かりました。ありがとうございます！ オンラインのプログラミングスクールTechAcademyではPythonを使って機械学習の基礎を学ぶPythonオンライン講座を開催しています。 初心者向けの書籍を使って人工知能（AI）や機械学習について学ぶことができます。 現役エンジニアがパーソナルメンターとして受講生に1人ずつつき、マンツーマンのメンタリングで学習をサポートし、最短4週間で習得することが可能です。 また、現役エンジニアから学べる無料のプログラミング体験会も実施しているので、ぜひ参加してみてください。
Python

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

JavaScriptをプログラミング初心者向けに紹介した記事です。 今回は、JavaScriptの組み込み関数の1つであるStringオブジェクトを使う方法について解説します。 また、入門向けのJavaScriptを学習できるサイトも紹介しているので、合わせてご覧ください。   本記事では、テキストエディタのmiを使っていますが、JavaScriptの場合はWebブラウザとテキストエディタがあれば特別な開発環境がなくても開発することができます。   なお本記事は、オンラインブートキャンプ フロントエンドコース（JavaScript・jQuery講座）の内容をもとにしています。   今回の記事の内容は動画でもご覧いただけます。 テキストよりも動画の方が理解しやすいという場合はぜひご覧ください。   目次 組み込み関数のStringオブジェクトとは Stringオブジェクトを実際に生成してみよう Stringオブジェクトのプロパティを呼び出してみよう     組み込み関数のStringオブジェクトとは 組み込み関数とは、JavaScrip側であらかじめ用意してくれているオブジェクトのことです。Stringオブジェクトは、組み込み関数の1つで、文字列を操作する際に使います。   参考までに、組み込み関数の代表的なものには次のようなものがあります。   <組み込み関数（代表的なもの）> String　文字列を扱う Number　数値を扱う Boolean　論理値を扱う Array　配列を扱う Date　日付を扱う Math　数値計算で扱う   はじめから関数の内容が決まっているので、こちらで定義する手間もなく、実行するだけ。非常に便利なので重宝します。 組み込みオブジェクトを使う場合、newを使って次のようにオブジェクトを生成します。 var オブジェクト名= new object();    大石ゆかり 田島メンター！文字列もオブジェクトなんでしょうか？ 田島悠介 そうなんだ。JavaScriptでは文字列もオブジェクト、もしくはオブジェクトのように振舞う設定になってるんだよ。 大石ゆかり オブジェクトはプロパティとメソッドを持っている、1つのかたまりのようなものでしたっけ。 田島悠介 そうそう。さっそくStringオブジェクトを生成してみよう！   [PR] HTML/CSSで挫折しない学習方法を動画で公開中Stringオブジェクトを実際に生成してみよう Stringオブジェクトを生成してみましょう。適当なオブジェクト名（s）をつけ、文字列hello worldを引数として渡し、出力します。 var s = new String(“hello world”);   ※文字列を出力する際は、「”　”」や「’　’」で囲うのを忘れないでくださいね    <!DOCTYPE html> <html lang = “ja”> <head> <meta charset = “utf-8”> <title>JavaScriptの練習</title> </head> <body> <script> 　var s = new String(“hello world”); </script> </body> </html>   生成できたら、console.logを使って呼び出してみます。 Stringオブジェクトでは基本的に、文字列を操作して出力する際に、便利なプロパティやメソッドを使います。 次の章から見ていきましょう。     Stringオブジェクトのプロパティを呼び出してみよう Stringオブジェクトでの文字列の操作の仕方を、3つのプロパティを例に見ていきましょう。 プロパティ1. length（文字列の長さを出力する） プロパティ2. charAt（左から何文字目かをとってきて出力する） プロパティ3. replace（文字を置換する） プロパティ1. length（文字列の長さを出力する） オブジェクトのプロパティを呼び出すやり方の確認です。 変数名に「.」で続けてプロパティ名を入れると、プロパティの値を呼び出すことができます。   <script> var s = new String(“hello world”); console.log(s.length); </script> hello world の文字数は11文字なので「11」と出力されました。（※空欄も一文字に含まれます）   プロパティ2. charAt（左から何文字目かを指定し出力する） <script> var s = new String(“hello world”); console.log(s.charAt(3)); </script> 3文字目を指定したので、「l」が出力されました。   プロパティ3. replace（文字を置換する） <script> var s = new String(“hello world”); console.log(s.replace(“world”,”Taro”)); </script> 文字を置換してくれるreplace。worldからTaroに置換されました。   エスケープシーケンスについて Stringを利用するということは、文字列のエスケープシーケンスを意識する必要があります。 エスケープシーケンスとは、特殊文字を利用する際の実装ルールです。 なお、JavaScriptでは’（シングルクォテーション）に囲まれた文字列と”（ダブルクォテーション）に囲まれた文字列に違いはありません。 これはエスケープシーケンスでも同様です。   エスケープシーケンスの例 記載方法 意味 \0 NULL文字 \' シングルクォート \" ダブルクォート \\ バックスラッシュ(\文字) \n 改行 \r 復帰 \v 垂直タブ \t 水平タブ \b バックスペース \f フォームフィード \uXXXX unicode コードポイント \u{X} … \u{XXXXXX} unicode コードポイント  \xXX Latin-1 文字   JavaScriptの組み込み関数の１つであるStringオブジェクトを使う方法は以上です。 ほかの組み込み関数といっしょに、是非活用してみてくださいね。   大石ゆかり Stringオブジェクトを生成すると、色々な関数が使えるんですね。 田島悠介 そうそう。そういうのはJavaScriptにあらかじめ組み込まれてるんだよね。一番わかりやすいのは、console.log(“aaa”.length);というコードを実行してみることかな。 大石ゆかり ただの文字列にドット(.)でつなげて、lengthプロパティを書いてますね。エラーにならないんですか？ 田島悠介 ちゃんと表示されるんだよね。JavaScriptはオブジェクトもしくはオブジェクトのように振舞うっていう仕様になってるんだよ。   [お知らせ]TechAcademyではJavaScriptを使ってWebサービスを公開できるオンラインブートキャンプ フロントエンドコース（JavaScript・jQuery講座）を開催しています。プログラミングの初心者でも受講可能です。
JavaScript

プログラミング講師
募集中

詳しくはこちら

WEEKLY RANKING

TechAcademy（テックアカデミー） Webデザインコース WebデザインHTMLHTMLで特殊文字のエスケープ処理を行う方法【初心者向け】