📖

【JavaScript】新卒が練習問題を解説してみた

2022/05/19に公開

JavaScript

tech

弊社の育成で提供される問題に取り組み、記憶に残したいところを抜粋して解説します。
間違っているところや別解答があればコメントお願いします！

解説

練習問題1

次の変数を用意する。

変数a に 俺の塩ラーメン
変数b に 700
変数c に 円

用意した変数を結合して「俺の塩ラーメン700円」と表示させる。

const a = "俺の塩ラーメン"
const b = 700
const c = "円"

console.log(a+b+c)

私はこの解答を出しましたが、他にもいろんな解答があります。
例えば

// const部分は解答（1）と同じであるため省略

console.log(`${a}${b}${c}`)

なんて解答があります。
今回のような全てが変数である場合の解答ではあまり良さを感じられませんが

console.log(`俺の塩ラーメン${b}円`)

のように文字列と並べて書く場合にはかなり綺麗で簡単に書けそうです！

また気をつけたいのが

// const部分は解答（1）と同じであるため省略

console.log(a, b, c)

という解答です。
これを実行すると俺のラーメン　700　円といった感じで変数の間にスペースができます。
確かに出力されるのですが、今回の場合は文字列として綺麗ではないので不正解かなと思いました！

練習問題2

次の文章を表示する。ただし改行も正しく表示すること　カギカッコは省略してもよい。

「雨ニモマケズ
　　風ニモマケズ
　　雪ニモ夏ノ暑サニモマケヌ
　　丈夫ナカラダヲモチ」

私が出した解答はこちらです。

const str = ["雨ニモマケズ","風ニモマケズ","雪ニモ夏ノ暑サニモマケヌ","丈夫ナカラダヲモチ"]

console.log( str.join('\n') )

このjoin()メソッドは全要素を順に連結した文字列を新たに作成して返すメソッドです！
今回は（）に'\n' を入れたことで要素と要素の間で改行が行われています。
使い方としては（）に'-' を入れて、要素と要素を-で繋げたり、とかですかね＾＾

【参考】📌join()メソッド -mdn web docs-

最初('\n')の部分を('/n')としてしまい不正解を食らいました。。。
ただのスラッシュではなく、バックスラッシュです。。。

他にも

const str = '雨ニモマケズ\n風ニモマケズ\n雪ニモ夏ノ暑サニモマケヌ\n丈夫ナカラダヲモチ'

console.log(str)

こんな解答や

const str = `雨ニモマケズ
風ニモマケズ
雪ニモ夏ノ暑サニモマケヌ
丈夫ナカラダヲモチ`

console.log(str)

こんな解答があると教えて頂けました！
私の解答と比べるとかなり簡単に書かれていて
こういった些細な処理でも、いかに分かりやすく見やすく書くかを大事にしたいです。

練習問題3

変数Dを用意し、任意の文字列を代入しておく。
変数Dの文字数が3の倍数だった場合、良い文章、2の倍数だった場合悪い文章、2の倍数且つ3の倍数だった場合普通の文章、それ以外の時はまぁまぁな文章と表示する。

これはかの有名なFizzBuzz問題ですね＾＾

const D = "ムムム"

if( D.length % 6 == 0){
    console.log("普通の文章")
} else if( D.length % 2 == 0 ){
    console.log("悪い文章")
} else if( D.length % 3 == 0 ){
    console.log("良い文章")
} else {
    console.log("まぁまぁな文章")
}

私は上記のように答えましたが、もっと簡単に答える方法もありそうです。
この問題で引っかかりやすいのが
一番最初にD.length % 6 を持ってこないとこの計算は成り立たないと言う点です！
上から処理されていくことを意識できていなかった昔の私は間違えました！

練習問題4

変数Eを用意し、任意の値を代入しておく。
変数Eが文字列だった場合、文字列と表示し、数値だった場合、数値と表示する。

私が最初に書いた誤答がこちらです。

const E = 666
if( isNaN(E) ){
    console.log("文字列")
} else {
    console.log("数値")
}

私は数値の判定に📌isNaN関数を使おうと考えたのですが
この関数は最初に引数として受け取った値を数値に型変換するという特性を持つため
'666'のように数値を文字列として出力しようとしても、判定は数値と出てしまいます... ; ;

したがって、

const E = '666'
if( typeof E === 'number' ){
	console.log("数値")
} else {
	console.log("文字列")
}

が解答例となります！
数値判定は難しいらしく、これでも完答ではないそうです。
（undefindでも文字列となってしまうため）
何か良い答えがわかる方いましたら教えてください！

練習問題5

ループ文を使用して以下のように記号を出力するプログラムを作る。

*****
*****
*****
*****
*****

解答はこちらです。

let row = ''
let output = ''


for (let i = 0; i < 5; i++) { 
    for (let x = 0; x < 5; x++) {
        row = row + '*' 
    }
    output = output + row + '\n' 
    row = ''
}

console.log(output)

この解答ではfor文を用いたループ処理を行っています。
ループ処理を２つ重ねることで、＊を５個×５行繰り返すことができます＾＾
変数rowに＊を入れる処理を５回行い、
変数outputに変数rowと改行を入れる処理を５回行い、出力て感じです！
【参考】📌for文 -mdn web docs-

練習問題6

下のような配列を用意する。
[1, 4, 5, 11, 2, 34, 1, 25]
配列の中身を全て加算して出力するプログラムを作る。

解答はこちらです。

const result = [1, 4, 5, 11, 2, 34, 1, 25]
const total = result.reduce(
    (previousValue, currentValue) => previousValue + currentValue, 0
)

console.log(total)

ここで使っているreduce()メソッドが（）の中身のロジックを配列の要素分反復させていて
（今回で言うと[1, 4, 5, 11, 2, 34, 1, 25]の計8回ということになります）
previousValueに前回の値、currentValueに現在の要素を入れて計算していることになります！
（最後の0は一番最初の計算時にpreviousValueに入る値）
わかりやすく今回の処理を文字に起こすと
（１周目）0 + 1 →（２周目）1 + 4 →（３周目）5 + 5 →（４周目）10 + 11 ...
となります＾＾
上手く説明できましたかね、、、

おわりに

この問題を解いたあと育成担当者に解説頂いたのですが
とても勉強になったので記事にしてみました！
ここで紹介した解答以外にもたくさん答え方があって
奥が深い世界だなと改めて実感しました！知れば知るほど面白い＾＾

宣伝

パーソンリンクではエンジニアを募集しています！

解説