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

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

取り組むときの注意²。

①Rubyでは`こんにちは` `飛鳥です`と2つの文の出力を行うintroメソッドを定義し、introメソッドを呼び出す。JavaScriptでは関数を定義した際に使用した定数名introを用いて関数を呼び出す。但し、JavaScriptはfunctionを用いるverとアロー関数を用いるverの2種類かく。

asuka.rb

def intro
  puts "こんにちは"
  puts "飛鳥です"
end
puts "-----introduce-----"
# introduceメソッドを呼び出す
intro

asuka1.js

const intro = function() {
  console.log("こんにちは");
  console.log("飛鳥です");
};
console.log("-----introduce-----");
// 関数を呼び出す
intro();

asuka2.js

const intro = () => {
  console.log("こんにちは");
  console.log("飛鳥です");
};
console.log("-----introduce-----");
// 関数を呼び出す
intro();

出力結果
-----introduce-----
こんにちは
飛鳥です

メソッド≠関数

アロー関数はES6から導入された新しい書き方。なお、function≠アロー関数。

② ①のintroメソッド(Ruby) ・関数(JavaScript)の呼び出し時に名前(name)の部分が`飛鳥`という値が渡され、引数nameに代入してintroメソッドを呼び出す。

asuka.rb

def intro(name)
  puts "こんにちは"
  puts "#{name}です"
end
puts "-----introduce-----"
# 引数を渡してメソッドを呼び出す
intro("飛鳥")

asuka.js

// 関数の引数にnameを追加
const intro = (name) => {
  console.log("こんにちは");
  console.log(`${name}です`);
};
console.log("-----introduce-----");
// 引数を渡して関数を呼び出す
// introの引数に「飛鳥」を渡して呼び出す
intro("飛鳥");

出力結果
-----introduce-----
こんにちは
飛鳥です

引数のあるメソッドは、引数を渡さないで呼び出すとエラーになるので注意!!（ここでは、intoro("飛鳥")の("飛鳥")を省いてはNG）

③introメソッド(Ruby) ・関数(JavaScript)の第1引数`name` 第2引数`age` で`飛鳥です`と`精神年齢20歳です`を呼び出す。

asuka.rb

def intro(name:, age:)
  puts "#{name}です"
  puts "精神年齢#{age}歳です"
end
intro(name: "飛鳥", age: 20)

asuka.js

const intro = (name, age) => {
  console.log(`${name}です`);
  console.log(`精神年齢${age}歳です`);
};
intro("飛鳥", 20);

出力結果
飛鳥です
精神年齢20歳です

④imoメソッドを用いて300円の芋焼酎に税込みの金額`税込みで●●円`を出力する。但し、変数tax_includedに代入して結果が出力されるverを別途かく。

asuka1.rb

def imo(price)
puts "税込みで#{price * 1.1}円"
end
imo(300)

asuka2.rb

def imo(price)
 price * 1.1
end
tax_included = imo(300)
# 変数tax_includedを用いて、「税込みで●●円」となるように出力
puts "税込みで#{tax_included}円"

asuka1.js

const imo = (price) => {
   console.log(`税込みで${price * 1.1}円`);
};
imo(300);

asuka2.js

const imo = (price) => {
  return price * 1.1;
};
// 変数tax_includedを用いて、「税込みで●●円」となるように出力
let tax_included = imo(300);
console.log(`税込みで${tax_included}円`);

出力結果
Ruby:税込みで330.0円
JavaScript:税込みで330円

asuka1とasuka2の違い
asuka1では、メソッドあるいは関数imo内で計算結果を直接putsまたはconsole.logで出力している。この場合、計算結果がコンソールに表示されるだけであり、関数自体は値を返さない。一方、asuka2では関数内で計算結果を返すことにより、その結果を他の部分で利用することができる。これにより、関数が単なる処理の実行だけでなく、値を返して他の操作に使える汎用的な機能を持つことができる。

asuka2で『return』を使わない場合
Ruby:『return』がなくても、Rubyは最後に記述した式の値が評価されるのでエラーは出ない。つまり呼び出し元の変数tax_includedに計算結果が代入され、後続のputsで正しく結果が出力される。
JavaScript:『return』がないと、price * 1.1という計算の結果がどこにも使われないため、関数はundefinedが返される。そのため、『return』を使って関数の呼び出し元に計算結果を返す必要がある。『return』を使うことで計算結果が呼び出し元の変数tax_includedに代入され、後続のconsole.logで正しく結果が出力される。

⑤ 数字が0の時`『0です』`、1のときは`『0ではないです』`と出力するためのif文をつくる。このとき引数の値が0または1のときの`zero`メソッド(Ruby)または関数(JavaScript)を呼び出す。ただし、Rubyはreturnを使うケースと使わないケース、JavaScriptはfunctionキーワードまたはアロー関数を使ってかく。

return.rb

def zero?(num)
  if num == 0
   return  puts "0です"
  end
 puts "0ではないです"
end
zero?(0)
zero?(1)

nonreturn.rb

def zero?(num)
  if num == 0
    puts "0です"
  else
    puts "0ではないです"
  end
end
zero?(0)
zero?(1)

asuka1.js

function zero(num) {
  if (num === 0) {
    console.log("0です");
    return;
  }
  console.log("0ではないです");
}
zero(0);
zero(1);

asuka2.js

const zero = (num) => {
  if (num === 0) {
    console.log("0です");
    return;
  }
  console.log("0ではないです");
};
zero(0);
zero(1);

出力結果
0です
0ではないです

『return.rb』でreturnを使う場合
returnがないと、最後に記述した式の値が評価されるため、zero?(0)では出力結果が0ですと0ではないですの両方が出力されてしまうので注意。

Ruby:真偽値を返すメソッドは、メソッド名の末尾に「?」をつける慣習がある

⑥ 引数numの値が3の倍数かどうかを判定する条件式をansメソッド(Ruby)・関数(JavaScript)で作成する。そしてansに代入されているメソッドor関数の中で、numが3で割り切れるかどうかの結果(真偽値)を戻り値として返す。

引数の値が数値の123の場合を出力
引数の値が数値の10の場合を出力
Rubyでは変数ans、JavaScriptでは定数ansに代入されている関数を呼び出すif文(3の倍数の場合3の倍数ですそうではない場合3の倍数ではない)を作成する。この時、引数の値は数値の123。

asuka.rb

def ans?(num)
  # numが3の倍数かどうかを戻り値として返す
  return num % 3 == 0
end
puts ans?(123)
puts ans?(10)
# if文の条件式で、ansを呼び出す
if ans?(123)
  puts "3の倍数です"
else
  puts "3の倍数ではない"
end

asuka.js

const ans = (num) => {
  // numが3の倍数かどうかを戻り値として返す
  return num % 3 === 0;
};
console.log(ans(123));
console.log(ans(10));
// if文の条件式で、ansを呼び出す
if (ans(123)) {
  console.log("3の倍数です");
} else {
  console.log("3の倍数ではありません");
}

出力結果
true
false
3の倍数です

⑦`price`が1000円以上のときに送料無料、1000円未満のときは50円の送料がつくshoppingメソッド(Ruby)または関数(JavaScript)をつくり、引数が100円または1000円のときをそれぞれ出力する。また、出力する際の文は『商品は●●円』『送料込みで■■円』とする。

asuka.rb

def shopping(price)
	# priceが1000円以上のとき、戻り値としてpriceを返す
	if price >= 1000
		return price
	end
  # priceに50を加えた値を戻り値として返す
	return price + 50
end
puts "商品は100円"
puts "送料込みで#{shopping(100)}円"
puts "-----------"
puts "商品は1000円"
puts "送料込みで#{shopping(1000)}円"

asuka.js

function shopping(price) {
  // priceが1000円以上の場合、priceを返す
  if (price >= 1000) {
    return price;
  }
  // priceに50を加えた値を返す
  return price + 50;
}
console.log("商品は100円");
console.log("送料込みで" + shopping(100) + "円");
console.log("-----------");
console.log("商品は1000円");
console.log("送料込みで" + shopping(1000) + "円");

出力結果
商品は100円
送料込みで150円
-----------
商品は1000円
送料込みで1000円

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