プログラミング超初心者がRubyとJavaScript入門編を学び、次へ進もうとすると理解したことを忘れるため備忘録目的で記事を書きました。

具体的な取り組み方法¹。

取り組むときの注意²。

(追記:2023年06月01日)
③や⑨の除算で、Ruby と JavaScript の結果が一致する数値を例にしていますが、
/ による除算は Ruby と JavaScript で根本的に違います。詳細についてはコメントを下さった@scivola さんの説明や紹介記事がとても分かりやすいです！

①プログラムの実行（飛鳥です）

asuka.rb

- puts '飛鳥です'
+ puts "飛鳥です"

asuka.js

- console.log('飛鳥です');
+ console.log("飛鳥です");

シングルクォーテーション(') とバッククォーテーション(`)は異なる！

クォーテーション

出力結果
飛鳥です
飛鳥です

②コメントアウト（出力されない）

asuka.rb

# 出力されない

asuka.js

// 出力されない

出力結果
(なにも表示されない)

コメントアウト
〇：コード等の文字列を実行時には無視されるようコメント化する行為を指す言葉
✕ ：コメントそのものをコメントアウトとは呼ばない

※ @ibyrjbf さんより教えていただきました。ありがとうございます！

③ `2` と`1` を使って計算（足し算、引き算、掛け算、割り算、余り）

asuka.rb

puts 2 + 1
puts 2 - 1
puts 2 * 1
puts 2 / 1
puts 2 % 1

asuka.js

console.log(2 + 1);
console.log(2 - 1);
console.log(2 * 1);
console.log(2 / 1);
console.log(2 % 1);

出力結果
3
1
2
2
0

④文字の連結（飛鳥、文字・数値 `1+2` ）

asuka.rb

puts "飛" + "鳥"
puts "1" + "2"
puts "1 + 2"
puts 1 + 2

asuka.js

console.log("飛" + "鳥");
console.log("1" + "2");
console.log("1 + 2");
console.log(1 + 2);

出力結果
飛鳥
12
1 + 2
3

⑤変数（変数：name、値：飛鳥）

asuka.rb

name = "飛鳥"

puts name
puts "name"

asuka.js

let name = "飛鳥";

console.log(name);
console.log("name");

出力結果
飛鳥
name

⑥変数と文字列・数値を連結（変数：name・number、値：飛鳥・1、・ `+"です"`・ `+2` ）

asuka.rb

name = "飛鳥"
puts name + "です"

number = 1
puts number + 2

asuka.js

let name = "飛鳥";
console.log(name + "です");

let number = 1;
console.log(number + 2);

出力結果
飛鳥です
3

⑦変数名のルール(name・addname)

asuka.rb

# 英単語を使う 例）name
# 2語以上はアンダーバーで区切る 例）add_name

asuka.js

// 英単語を使う 例）name
// 2語以上は大文字で区切る　例）addName
// ×　頭文字に数字

⑧変数の値の更新(変数nameの値を `飛鳥` から `asuka` へ更新)

asuka.rb

name = "飛鳥"
puts name
name = "asuka"
puts name

asuka.js

let name = "飛鳥";
console.log(name);
name = "asuka";
console.log(name);
// 更新する時let不要

出力結果
飛鳥
asuka

⑨ `number = 1` に`10`を代入(足し算、引き算、掛け算、割り算、余り)

asuka.rb

number = 1
puts number
number += 10
puts number
number -= 10
puts number
number *= 10
puts number
number /= 10
puts number
number %= 10
puts number
# プログラミングというより算数になってきた・・・

asuka.js

let number = 1;
console.log(number);
number += 10;
console.log(number);
number -= 10;
console.log(number);
number *= 10;
console.log(number);
number /= 10;
console.log(number);
number % 10;
console.log(number);

出力結果
1
11
1
10
1
1

⑩変数を使って1~5を出力

asuka.rb

# 変数numberを定義して0を代入する
number = 0

# 変数numberに1を加えて、変数を更新
number += 1
puts number
number += 1
puts number
number += 1
puts number
number += 1
puts number
number += 1
puts number

asuka.js

// 変数numberを定義して0を代入する
let number = 0;

// 変数numberに1を加えて、変数を更新
number += 1;
console.log(number);

number += 1;
console.log(number);

number += 1;
console.log(number);

number += 1;
console.log(number);

number += 1;
console.log(number);

出力結果
1
2
3
4
5

⑪文字列`～です。`に、Rubyは変数の値`飛鳥`を、JavaScriptは定数の値`飛鳥`を埋め込んで連結する。(出力結果：`飛鳥です。`)

asuka.rb

name = "飛鳥"
puts "#{name}です。"

asuka.js

const name = "飛鳥";
console.log(`${name}です。`);

出力結果
飛鳥です。

Rubyで変数展開を使うメリット

asuka.rb

age = 20
- puts "飛鳥は気持ち#{age}歳です"　# 出力結果　飛鳥は気持ち20歳です
+ puts "飛鳥は気持ち" + age + "歳です" 　# 数値+文字列はエラーになる

⑫if文を作る。`age = 50`で条件式は`age > 20`の場合、`飛鳥の精神年齢ではありません`を出力。

asuka.rb

age = 50
if age > 20
  puts "飛鳥の精神年齢ではありません"
end

asuka.js

const age = 50;
if (age > 20) {
  console.log("飛鳥の精神年齢ではありません");
}

出力結果
飛鳥の精神年齢ではありません

⑬if文を作る。`name`の値が`"飛鳥"`の場合、『名前は合っています』と出力し、そうではない場合は『名前が合っていません』と、それぞれ出力する。

asuka.rb

name = "飛鳥"

if name == "飛鳥"
  puts "名前は合っています"
end

if name != "飛鳥"
  puts "名前は合っていません"
end

asuka.js

const name = "飛鳥";

if (name === "飛鳥") {
  console.log("名前は合っています");
}

if (name !== "飛鳥") {
  console.log("名前は合っていません");
}

出力結果
名前は合っています

⑭　⑬のif文を`else`を使って条件分岐する。

asuka.rb

name = "飛鳥"

if name == "飛鳥"
  puts "名前は合っています"
else
  puts "名前は合っていません"
end

asuka.js

const name = "飛鳥";

if (name === "飛鳥") {
  console.log("名前は合っています");
} else {
  console.log("名前は合っていません");
}

出力結果
名前は合っています

⑮更に条件を追加する。`score = 80`であると仮定し、100で`パーフェクト`、80以上で'おしい'、80未満`復習必須`。

asuka.rb

score = 80

if score == 100
  puts "パーフェクト"
elsif score >= 80
  puts "おしい"
else
  puts "復習必須"
end

asuka.js

const score = 80;

if (score === 100) {
  console.log("パーフェクト");
} else if (score >= 80) {
  console.log("おしい");
} else {
  console.log("復習必須");
}

出力結果
おしい

⑯`score = 80`であると仮定し、80以上かつ100未満で`おしい`。0以外かつ100以外で`おしい`。`score = 0`であると仮定し、0または100で`ある意味すごい`

asuka.rb

score = 80

if score >= 80 && score < 100
  puts "おしい"
end

score = 80

if score != 0 && score != 100
  puts "おしい"
end

score = 0

if score == 0 || score == 100
  puts "ある意味すごい"
end

asuka.js

const score = 80;

if (score >= 80 && score < 100) {
  console.log("おしい");
}

const score = 80;

if (score !== 0 && score !== 100) {
  console.log("おしい");
}

const score = 0;

if (score === 0 || score === 100) {
  console.log("ある意味すごい");
}

出力結果
おしい
おしい
ある意味すごい

⑰`n = 2`であると仮定し、10の倍数の時、2の倍数の時、5の倍数の時、2または5のいずれの倍数でもない場合についてRubyを使って判定する。

asuka.rb

n = 2

if n % 2 == 0 && n % 5 == 0
  puts "10の倍数"
elsif n % 2 == 0
  puts "2の倍数"
elsif n % 5 == 0
  puts "5の倍数"
else
  puts "2の倍数でも5の倍数でもない"
end

出力結果
2の倍数

⑱`n = 1`であると仮定し、JavaScriptのswith文を使って`case 0`のとき『不正解』、`case 1`のとき『正解』となるように条件分岐する。

asuka.js

const n = 1;

switch (n) {
  case 0:
    // n === 0と一致するときに実行
    console.log("不正解");
    break;

  case 1:
    // n === 1と一致するときに実行
    console.log("正解");
    break;

  default:
    console.log("不適切問題です");
    break;
}

出力結果
正解

break
意図的に break を省略する記法をフォールスルー(fall through) と言う

回答用のファイル(mdファイル)を別途用意して練習帳(この記事)のコードをコピーする。回答用の中にある、自力で書かなくてはいけないコードをすべて削除。回答用のファイルをVSコードで開き、コードを書く。やり方はQiitaの【Markdown記法チートシート】を活用してMarkdownをマスターする！《答え編》と同じ要領です。 ↩
mdファイルに書いているのでMarkdownと異なり、コードを間違えても気づきにくいです。 ↩