JavaScript Ⅱ

while文
繰り返し処理とは

// 変数numberを定義してください
let number = 1;

// while文を作成してください
while (number <= 100) {
console.log(number);
number += 1;
}

for文
for文では「変数の定義」「条件式」「変数の更新」の3つを括弧の中に書きます。括弧の中ではそれぞれをセミコロン(;)で区切ります。

計算式の省略
「number += 1」は「number ++」のように省略して書くことができます。また、引き算の場合にも、「number -= 1」を「number –」と省略することができます。

// for文を用いて、1から100までの数字を出力してください
for (let number = 1; number <= 100; number++) {
console.log(number);
}

// for文を完成させてください
for (let number = 1; number <= 100; number++) {
// if文を用いて、numberが3の倍数の時に「3の倍数です」、そうでないときは数字を出力してください
if (number % 3 === 0) {
console.log(“3の倍数です”);
} else {
console.log(number);
}
}

配列とは
const animals = [“dog”, “cat”, “sheep”];

console.log(animals[2]);

const animals = [“dog”, “cat”, “sheep”];

// for文を用いて、配列の値を順にコンソールに出力してください
for (let i = 0; i < 3; i++) {
console.log(animals[i]);
}

length
配列.lengthとすることで、配列の要素数を取得できます。

const animals = [“dog”, “cat”, “sheep”, “rabbit”, “monkey”, “tiger”, “bear”, “elephant”];

// lengthを用いて配列の要素の数を出力してください
console.log(animals.length);

// lengthを用いて条件式を書き換えてください
for (let i = 0; i < animals.length; i++) {
console.log(animals[i]);
}

オブジェクトとは
配列は複数の値を並べて管理するのに対して、オブジェクトはそれぞれの値にプロパティと呼ばれる名前をつけて管理します。

オブジェクトは、{プロパティ1: 値1, プロパティ2: 値2}のようにつくります。
配列は要素を[]で囲みましたが、オブジェクトは{}で囲みます。プロパティと値の間はコロン( : )で繋ぎます。また、配列と同様に、要素と要素はコンマ(,)で区切ります。

// 定数characterを定義し、指定されたオブジェクトを代入してください
const character = {name: “にんじゃわんこ”, age: 14};

// characterの値を出力してください
console.log(character);

「オブジェクト.プロパティ名 = 新しい値」とすることでオブジェクトの値を更新することができます。

const character = {name: “にんじゃわんこ”, age: 14};

// characterのnameの値を出力してください
console.log(character.name);

// characterのageの値を「20」に更新してください
character.age = 20;

// characterをコンソールに出力してください
console.log(character);

オブジェクトを要素に持つ配列

さらに、配列の中のオブジェクトのプロパティの値を取り出すには、
「配列[インデックス番号].プロパティ名」と書きます。

const characters = [
{name: “にんじゃわんこ”, age: 14},
{name: “ひつじ仙人”, age: 1000}
];

// charactersの1つ目の要素をコンソールに出力してください
console.log(characters[0]);

// charactersの2つ目の要素の「name」に対応する値をコンソールに出力してください
console.log(characters[1].name);

配列と繰り返し処理

const characters = [
{name: “にんじゃわんこ”, age: 14},
{name: “ひつじ仙人”, age: 100},
{name: “ベイビーわんこ”, age: 5},
];

// for文を完成させてください
for (let i = 0; i < characters.length; i++) {
console.log(“——————–“);

// 定数characterを定義してください
const character = characters[i];

// 「名前は〇〇です」を出力してください
console.log(`名前は${character.name}です`);

// 「〇〇歳です」を出力してください
console.log(`${character.age}歳です`);

}

undefinedとは
存在しない要素を取得する

undefinedとif文
undefined をif文の条件式に使ってみましょう。
「character.age」の値が「undefined」と等しいかどうかで処理を分岐します。

const characters = [
{name: “にんじゃわんこ”, age: 14},
{name: “ひつじ仙人”, age: 100},
{name: “ベイビーわんこ”, age: 5},
{name: “とりずきん”}
];

for (let i = 0; i < characters.length; i++) {
console.log(“——————–“);

const character = characters[i];

console.log(`名前は${character.name}です`);

// if文を追加してください
if (character.age === undefined) {
console.log(“年齢は秘密です”);
} else {
console.log(`${character.age}歳です`);
}
}

複雑なオブジェクトを扱う
オブジェクトの値の部分には、文字列や数値だけでなく、オブジェクトを用いることができます。以下の図では、「character」というオブジェクトの「favorite」プロパティに対応する値に、オブジェクトを用いています。
「オブジェクト名.プロパティ.プロパティ」のように呼び出します。

const cafe = {
name: “Progateカフェ”,
businessHours: {
// businessHoursの値に指定されたオブジェクトを代入してください
opening: “10:00(AM)”,
closing: “8:00(PM)”
},
};

// 「店名:〇〇」を出力してください
console.log(`店名:${cafe.name}`);

// 「営業時間:〇〇から△△」を出力してください
console.log(`営業時間:${cafe.businessHours.opening}から${cafe.businessHours.closing}`);

const cafe = {
name: “Progateカフェ”,
businessHours: {
opening: “10:00(AM)”,
closing: “8:00(PM)”
},
// menusプロパティに配列を代入してください
menus: [“コーヒー”, “紅茶”, “チョコレートケーキ”]
};

console.log(`店名: ${cafe.name}`);
console.log(`営業時間:${cafe.businessHours.opening}から${cafe.businessHours.closing}`);
console.log(`—————————-`);
console.log(“おすすめメニューはこちら”);

// for文を用いて配列menusの中身を表示させてください
for (let i = 0; i < cafe.menus.length; i++) {
console.log(cafe.menus[i]);
}

シェアする

  • このエントリーをはてなブックマークに追加

フォローする