※この記事は初学者の毎日のアウトプット用に作成している記事です
ブラウザーのコンソールの使い方
JavaScriptは環境構築をしなくても、ブラウザのコンソールで使い方の確認をすることができる
主要なwebブラウザーには「開発ツール」が搭載されている
この開発ツールにはJavaScriptの処理結果やエラーメッセージを表示する機能が存在する
開発ツールの開き方は
・command + option + I (mac)
・Ctrl + shift + I (windows)
で開発ツールが開きコンソールタブをクリックするとコンソールが表示される
変数と定数
変数
値を代入した後、何度でも値を代入し直せる
let x = 10;
x = 20; // OK（再代入できる）
console.log(x); // 20
定数
一度値を代入すると再び代入することができない
const z = 50;
z = 60; // エラー: Assignment to constant variable.
文字列
文字列は""(ダブルクウォート)もしくは''(シングルクウォート)で囲む
また文字列に対して + 演算子を使うと文字列を結合することができる
let part1 = "Welcome";
let part2 = "Cafe";
let sign = part1 + " " + part2; // "Welcome Cafe"
console.log(sign);
配列
配列は複数の値を一つにまとめて保存しておけるデータ
インデックス番号で配列のデータを参照することができる
let bento = ["おにぎり", "卵焼き", "唐揚げ", "ブロッコリー"];
console.log(bento[0]); // おにぎり
console.log(bento[2]); // 唐揚げ
また配列は複数のデータを保持・参照するだけでなく配列の長さを調べることができたり、後からデータを追加することもできる
let bento = ["おにぎり", "卵焼き", "唐揚げ", "ブロッコリー"];
// お弁当箱の中身の数（length）
console.log(bento.length); // 4
// 新しいおかず（トマト）を追加
bento.push("トマト");
console.log(bento); // ["おにぎり", "卵焼き", "唐揚げ", "ブロッコリー", "トマト"]
console.log(bento.length); // 5
オブジェクト
オブジェクトも複数の値を一つにまとめて保存しておけるデータ
全体を{}で囲みデータを,区切りで記述する
データの一つをプロパティと呼び、「プロパティ名：値」で記載
プロパティのことをキーとも呼ぶ
let meishi = {
name: "田中 太郎",
age: 30,
job: "エンジニア"
};
プロパティ名は2種類の参照方法がある
1,オブジェクトとプロパティを結ぶ
2,オブジェクト名に続き[]を書き参照したいプロパティ名を""で囲む
// 名刺の情報を表示
console.log(meishi.name); // 田中 太郎
console.log(meishi["age"]); // 30
参考書籍：