
今回は文字データの取得変換について勉強するッピ!

文字データの取得変換?

そうッピ!
具体的には文字数を数えたり、大文字や小文字、変数の最初の文字を取り出して、変換する方法ッピ!
- 文字数を数える
- 文字を大文字にする
- 文字を小文字にする
- 変数の1文字を取り出す
- 変数のAからBまでの文字を取り出す
文字データの取得変換ついて学ぼう
必要なもの


- メモ帳
- ブラウザ
が必要ッピ!
元になるコード
<!-- 見えない部分 -->
<html>
<head></head>
<!-- ↓ここから見える部分↓ -->
<body>
<!-- ↓この下に入力してね!↓ -->
<script>
</script>
<!-- ここまで! -->
</body>
</html>
文字を取得する
文字やデータを入れる変数

さっそくやって行くッピよ~! 今回は文字数を数えるコードッピ!
let a = "Hello World";
document.write(a);
と入力するッピ!
できたらブラウザで確認してみるッピよ~


これは
let a = “Hello world“;
document.write(a);
という意味ッピね~

いつものやつだな!
入力したコード >
<!-- 見えない部分 -->
<html>
<head></head>
<!-- ↓ここから見える部分↓ -->
<body>
<!-- ↓この下に入力してね!↓ -->
<script>
let a = "Hello World";
document.write(a);
</script>
<!-- ここまで! -->
</body>
</html>
出力結果 >
Hello World
文字数を数える命令文

さっそくやって行くッピよ~! 今回は文字数を数えるコードッピ!
let a = "Hello World";
document.write(a.length);
と入力するッピ!
できたらブラウザで確認してみるッピよ~


お! 11になった!

これは
.length
をという命令を使って文字数を数えたッピ!
” Hello World “
で11文字という意味ッピね~
入力したコード >
<!-- 見えない部分 -->
<html>
<head></head>
<!-- ↓ここから見える部分↓ -->
<body>
<!-- ↓この下に入力してね!↓ -->
<script>
let a = "Hello World";
document.write(a.length);
</script>
<!-- ここまで! -->
</body>
</html>
出力結果 >
11
変数のn番目の文字を取得する

次は少し特殊な文字の取得方ッピ!
変数を使って文字を取得するッピよ~

let a = "good morning";
document.write(a[3]);
と入力してみるっぴ!


これは
let a = “good morning”;
document.write(a[3]);
という意味ッピ!
同じく変数の1文字だけを抜き出す

次は少し特殊な文字の取り出し方ッピ!
let a = "good morning";
document.write(a.charAt(3));
と入力するッピよ~


おおお!
なんかさっきと同じふうに表示されたぞ!

ふふふ、これがプログラミングのちからッピ!
これもさっきと同じように、1文字だけを抜き出すプログラムッピ!
document.write( a.charAt(3) );
という意味ッピ!
入力したコード >
let a = "good morning";
document.write(a.charAt(3));
出力結果 >
d
文章の切り抜きをする命令文

特定の文章を抜き出す命令文もあるッピ!

↓の文をコピーして
let a = "Hello World";
document.write(a.substr(0,2));
と入力するッピよ~


He
って表示されたぞ!

これは
let a = “Hello World”;
document.write(a.substr(0,2));
という意味ッピ!
スタートから2番目まで = He
を抜き出したッピよ~

変数.substr(抜き出し開始の数字, 抜き出し終了文字)
で文字を抜き出すことができるッピ!

なるほどな~
文章の前をはぶいて切り抜きをする命令文

他にも前をはぶいて切り抜きをすることも可能だッピ!
let a = "Hello World";
document.write(a.substring(4,a.length));


これは
let a = “Hello World”;
document.write(a.substring(4, a.length));
という意味ッピ!
入力したコード >
let a = "Hello World";
document.write(a.substr(0,2));
出力結果 >
He
入力したコード >
let a = "Hello World";
document.write(a.substring(4,a.length));
出力結果 >
o World
文字を取得し《大文字》にする

次は取得した小文字を大文字にする方法ッピ!
変数.toUpperCase();
を使って大文字にへんかんするッピよ~

変数を使う場合は
let a = "Hello World";
document.write(a.toUpperCase());
と入力するッピよ~


すっげーな!
入力したコード >
let a = "Hello World";
document.write(a.toUpperCase());
出力結果 >
HELLO WORLD
取得した文字をすべて小文字にする

最後は文字をすべて小文字にする方法ッピ!
toLowerCase(“文字列“)
というやり方で小文字にすることができるッピ!

変数を使う場合は、
let a = "Hello World";
document.write(a.toLowerCase());
という風に入力してみるッピよ~!


やったな!
入力したコード >
let a = "Hello World";
document.write(a.toLowerCase());
出力結果 >
hello world
大文字と小文字の違いは?
大文字にする命令文と小文字にする命令文。
これらを見分ける方法は、文章をよくみる必要があります。
toUpperCase //大文字にする命令文
toLowerCase //小文字にする命令文
上のような違いがあります。
単語の最初のみを大文字にする

単語の最初のみを大文字にする命令文もあるッピ!
.charAt(数字)
.toUpperCase( 数字 )
.substring( 数字 )
.toLowerCase( 数字 )
すべてを使うッピ!

let a = "good morning";
document.write(a.charAt(0).toUpperCase() + a.substring(1).toLowerCase());
と入力して確認してみるッピよ~


単語の最初だけ大文字になった!
入力したコード >
let a = "good morning";
document.write(a.charAt(0).toUpperCase() + a.substring(1).toLowerCase());
出力結果 >
Good morning
- 文字数を数えるlength
- 文字を大文字にするtoUpperCase
- 文字を小文字にするtoLowerCase
- 変数の1文字を取り出すcharAt
- 変数のAからBまでの文字を取り出すsubstring

上手くできたッピか?
これからも色んなゲーム作りやプログラムの解説をしていくッピ!
次回も楽しみにしているッピよ~~!