できる気になっているJSを改めてチュートリアルからやってみる 4日目

～～ データ型 ～～

最近ちょっとずつまた学びなおす必要が出てきたなぁと思い、いろいろプログラムを勉強しなおしているところなんですが、実はもう今使っている知識は古いのかもと思って、アップデートしようとおもいやってみる会。

実施するのは、この記事

MDN - Javascript

完全な初心者向けと書かれたチュートリアルは全然初心者向けではないって話。アップデートしていきましょう。

Javascript は Numberだけ

javascriptって、Number型（とBigInt型）だけらしいです。小数点だろうが関係ないっす

文字列を数字に変えるときは Number を使いましょ。

let myNumber = '74';
Number(myNumber) + 3;

文字列

文字列を連結する コンカチする（concatenate）という単語は「結合する」ことを表すプログラミングの用語。

数値と文字列の扱いには十分注意しよう。

数字を文字列にするには、toStringというメソッドを使いましょう。

let myNum = 123;
myNum.toString();

文字列を数字にするには、Numberオブジェクトに渡して、数値に変換しましょう。

let myString = '123';
myNum = Number(myString);

テンプレートリテラル

標準の文字列リテラルをテンプレートリテラルに変換するには、引用符（' ' または " "）をバッククォート文字（` `）に置き換える必要があります。

let song = 'Fight the Youth';
song = `Fight the Youth`;

従来だとこんな感じ

let score = 9;
let highestScore = 10;
let output = 'I like the song "' + song + '". I gave it a score of ' + (score/highestScore * 100) + '%.';

テンプレートリテラルをつかうと、

output = `I like the song "${ song }". I gave it a score of ${ score/highestScore * 100 }%.`

複数の文のピースをつなげる必要はないです。文章全体を一組のバッククォートで囲むだけでOK。文字列内に変数または式を含める場合は、プレースホルダーとよばれる${}構造内に含めます

これ便利かも

もう一つあって、こんな感じ

let examScore = 45;
let examHighestScore = 70;
examReport = `You scored ${ examScore }/${ examHighestScore } (${ Math.round((examScore/examHighestScore*100)) }%). ${ examScore >= 49 ? 'Well done, you passed!' : 'Bad luck, you didn\'t pass this time.' }`;

・最初の2つのプレースホルダーは非常に単純で、変数を参照する単純な文字列のみが含まれています。
・3つ目は、パーセンテージの結果を計算し、それを最も近い整数に丸めます。
・4つ目は、三項演算子を使用してスコアが特定の値を超えているかどうかを確認し、結果に応じて合格または不合格のメッセージを出力します。

ほかにも従来だと文字列リテラルで複数の行に分割する場合は改行文字（\n）を含める必要があった。

output = 'I like the song "' + song + '".\nI gave it a score of ' + (score/highestScore * 100) + '%.';

テンプレートリテラルはソースコードの改行をそのまま再現するため、改行文字は不要。

output = `I like the song "${ song }".
I gave it a score of ${ score/highestScore * 100 }%.`;

はやくなれよう！（IEでは使えません）

おわり