BACK
|Vanilla Javascript

Javascriptの基礎 Vol.2 演算 Arithmetic Operators、連結ーConcatination

Vanilla Javascript

JavascriptのArithmetic Operatorsー演算子とは?

Javascriptで普通に数字の計算をさせるやり方です。使い方は至ってシンプルで小学校で習った数学と同じように使え、変数に対して使うことができます。

ウェブアプリやウェブページを使うのにどうして必要なの?と思ったりするかもしれませんが、どちらを作るにしても、意外とよく使う演算子なので基礎をしっかりおさえておきましょう。

オペレーター(演算子)の8種類

  1. + 足し算
  2. ー 引き算
  3. * 掛け算
  4. / 割り算
  5. ** 乗数
  6. % 係数 与えられた数字で破った際の残りの整数をリターン
  7. ++ 増加 (整数の値が一つ増える)
  8. -- 減少 (整数の値が一つ減る)

使用例

let a = 10
let b = 5

a = a + b
console.log(a)
//結果は15
//**オペレーターは数値の何乗するか、というところ。

普通の計算機と同じように使えます。

6番はいつ使うのか?と思いそうですが、レスポンシブデザインする際に結構よく使います。7と8はループを使う時によく使いますね。あとは例えばLikesの数のカウンターを作ったりする時に使います。

let likes = 0

function liked (){
    likes++
}

BIDMAS, BODMAS or PEDMAS ー計算順序とは?

演算子を使う上で一番重要なことは、計算順序です。順序を覚えなくてもカンニングは出来るので、目を通しておきましょう。小学校や中学校で習った算数と同じで、コンピュータの世界でも共通のようです。

  1. Brackets ーカッコ内
  2. Index ー乗数
  3. Divide ー割り算
  4. Multiply ー掛け算
  5. Add ー足し算
  6. Subtract ー引き算

の順番で計算しますよ、という意味です。

つまり

let result = 20 - 12 * (12 - 9) / 2
//result = 2

という数式がある場合は、下記の順序で行きます

  1. 12 - 9 = 3
  2. 3 / 2 = 1.5
  3. 12 * 1.5 = 18
  4. 20 - 18 = 2

ということです。

知っていると複雑な計算を一文でかけるので、カッコイイです。

Concatination足し算ではなくて連結する際の+記号の使い方

+記号は数字、ストリング、また変数を連結する時に使います。これは変化可能な文章を作る時によく使われます。

let name = 'John'
let age = 18

let message = name + 'さんは今年で' + age + '歳になります。'

console.log(message)
//Johnさんは今年で18歳になります。

Concatination ー連結のモダンなやり方

昔は文章を変数と連結させる時は一々+シンボルで連結させていましたが、多くのプログラマーがこれを嫌います。最近はバックティックが使えるようになり、コードが綺麗に見える、という理由でバックティックを使う人が多いです。

let name = 'John'
let age = 18

let message = `${name}さんは今年で${age}歳になります。`
console.log(message)
//Johnさんは今年で18歳になります。

通常エスケープキーの下にあるのがバックティックというシンボルで、シングルクオテーションやダブルクオテーションではないのでご注意を!

*Flamingod NewsはアメリカITの最新のニュースを日本語で紹介します。

...