Traffine I/O

日本語

2022-02-18

JavaScriptの基礎構文

JavaScriptの構文

JavaScriptの構文は、JavaScriptで書かれたプログラムの構造を規定する一連のルールを指します。

JavaScriptでは、文(ステートメント)はアクションを実行するコードの一部です。文はしばしばセミコロン(;)で終了します。

js
let x = 5;

この例では、let x = 5;は変数xを宣言し、それに値5を割り当てる文です。

式は値に解決する任意の有効なコード単位です。式には変数、リテラル、演算子、関数呼び出しなどが含まれます。

js
x * 10;

識別子

識別子は名前です。JavaScriptでは、識別子は変数、関数、ラベルの名前付けに使用されます。識別子を名前付ける際には、次のルールがあります。

  • 識別子は文字、数字、アンダースコア、ドル記号を含むことができる
  • 識別子は数字で始めることはできない
  • 識別子は大文字と小文字を区別する(myVarmyvarは異なる識別子)
  • 予約語(JavaScriptのキーワードなど)は識別子として使用できない

キーワード

キーワードはJavaScriptの予約語であり、特別な意味を持ちます。プログラムのフローを制御するために使用されます(ifelseforwhileなど)、変数を宣言するために使用されます(letconstvarなど)、関数を定義するために使用されます(function)など。キーワードは識別子として使用することはできません。

コメント

コメントはコードを説明し、理解しやすくするために使用されます。コードの実行には影響しません。JavaScriptは、単一行コメントと複数行コメントの両方をサポートしています。

単一行コメントは2つのスラッシュ(//)で始まります。

js
// This is a single-line comment

Multi-line comments start with a forward slash and an asterisk (/_), and end with an asterisk and a forward slash (_/):

js
/*
This is a
multi-line comment
*/

変数

変数はどんなプログラミング言語においても基本的な要素です。JavaScriptでは、変数は値に対する象徴的な名前です。変数はデータを格納し、そのデータをプログラム全体で操作および参照するために使用されます。

変数の宣言

JavaScriptでは、varletconstのいずれかを使用して変数を宣言することができます。それぞれのキーワードには異なる特性があります。

  • var: このキーワードは変数を宣言し、オプションで初期値を設定します。
js
var name;
  • let: このキーワードはブロックスコープのローカル変数を宣言し、オプションで初期値を設定します。
js
let name;
  • const: このキーワードはブロックスコープの読み取り専用の名前付き定数を宣言します。
js
const name = 'John';

constは初期化が必要であり、即座に値を割り当てない限り、const変数を宣言することはできません。

変数への代入

変数を宣言した後、代入演算子(=)を使用して値を変数に割り当てることができます。

js
let name;
name = 'John';

また、変数を宣言と同時に値を割り当てることもできます。

js
let name = 'John';

変数のスコープ

変数のスコープは、コード内でアクセスできる範囲を決定します。JavaScriptにはグローバルスコープとローカルスコープの2つのスコープがあります。

  • グローバルスコープ: 関数外で宣言された変数や関数内でvarキーワードで宣言された変数は、グローバル変数となり、コードのどの部分からでもアクセスできます。
js
var globalVar = 'I am global!';
  • ローカルスコープ: 関数やブロック内で宣言された変数は、その関数またはブロック内部でのみアクセス可能なローカル変数です。関数またはブロックの外部からはアクセスできません。
js
function myFunction() {
  let localVar = 'I am local!';
}

ただし、ブロック{}内でletconstを使用して宣言された変数は、もっとも近い囲むブロック内でのみアクセス可能なブロックスコープの変数となります。

js
{
  let blockVar = 'I am block-scoped!';
}

データ型

JavaScriptでは、プログラム内で操作できるさまざまな種類のデータをデータ型と呼びます。JavaScriptは動的な型システムを持っており、変数は任意のデータ型の値を保持でき、実行中にその型を変更することができます。

プリミティブなデータ型

JavaScriptのプリミティブなデータ型には、Number(数値)、String(文字列)、Boolean(真偽値)、Null(null)、Undefined(未定義)、Symbol(シンボル)があります。

  • Number(数値): このデータ型は整数と浮動小数点数を表します。
js
let num1 = 25;  // an integer
let num2 = 80.5;  // a floating-point number
  • String(文字列): このデータ型は文字の連続を表します。文字列はシングルクォーテーション('')、ダブルクォーテーション("")、もしくはバックティック(``)で囲むことで作成できます。
js
let str1 = 'hello';  // using single quotes
let str2 = "world";  // using double quotes
let str3 = `hello world`;  // using backticks
  • Boolean(真偽値): このデータ型は論理値を表します。true(真)またはfalse(偽)の値しか取ることができません
js
let isReading = true;
let isSleeping = false;
  • Null(null): このデータ型は意図的にオブジェクトの値が存在しないことを表します。"値なし"や"不明"を示すためによく使用されます。例:
js
let empty = null;
  • Undefined(未定義): 値が割り当てられていない未定義の変数です。
js
let x;
console.log(x);  // output: undefined
  • Symbol(シンボル): ECMAScript 6で導入されたシンボルは、一意で不変なプリミティブな値であり、オブジェクトのプロパティのキーとして使用することができます。
js
let symbol1 = Symbol();
let symbol2 = Symbol('sym2');

複合データ型

プリミティブなデータ型に加えて複合データ型として、JavaScriptにはオブジェクト(Object)と配列(Array)があります。

  • オブジェクト(Object): オブジェクトはプロパティの集まりであり、各プロパティはキーと値のペアです。オブジェクトのキーは文字列であり、値は任意のデータ型になります。
js
let person = {
  name: 'John',
  age: 30
};
  • 配列(Array): 配列は要素のコレクションを表す特別な型のオブジェクトです。配列の要素は任意のデータ型にすることができます。
js
let fruits = ['apple', 'banana', 'cherry'];

演算子

JavaScriptにおいて演算子は、特定の数学的、関係的、または論理的な操作をコンパイラに指示するための記号です。

算術演算子

算術演算子は、数値に対して算術演算を行うために使用されます。次の演算子があります。

  • 加算 (+)
  • 減算 (-)
  • 乗算 (*)
  • 除算 (/)
  • 剰余 (余り) (%)
  • インクリメント (++)
  • デクリメント (--)
js
let a = 10;
let b = 20;

console.log(b + a);  // Output: 30
console.log(b - a);  // Output: 10
console.log(b * a);  // Output: 200
console.log(b / a);  // Output: 2
console.log(b % a);  // Output: 0

代入演算子

代入演算子は変数に値を割り当てるために使用されます。単純な代入演算子は=です。また、算術演算と代入を組み合わせた複合代入演算子もあります。

  • +=
  • -=
  • *=
  • /=
  • %=
js
let a = 10;

a += 5;  // Same as a = a + 5; a is now 15

比較演算子

比較演算子は2つの値を比較するために使用されます。真または偽のブール値を返します。次の演算子があります。

  • 等しい (==)
  • 等しくない (!=)
  • 厳密に等しい(値と型が等しい)(===)
  • 厳密に等しくない(値または型が等しくない)(!==)
  • より大きい (>)
  • より小さい (<)
  • 以上 (>=)
  • 以下 (<=)
js
let a = 10;
let b = '10';

console.log(a == b);  // Output: true
console.log(a === b);  // Output: false

論理演算子

論理演算子は変数や値の論理を判断するために使用されます。次の演算子があります。

  • 論理積 (&&)
  • 論理和 (||)
  • 否定 (!)
js
let a = true;
let b = false;

console.log(a && b);  // Output: false
console.log(a || b);  // Output: true
console.log(!a);  // Output: false

その他の演算子

その他のJavaScriptの演算子には以下があります。

  • 条件付き(三項)演算子 (condition ? value_if_true : value_if_false)
  • 型演算子 (typeof)
  • インスタンス演算子 (instanceof)
js
let age = 15;

let canVote = (age >= 18) ? "Yes" : "No";
console.log(canVote);  // Output: No

console.log(typeof age);  // Output: number

let fruits = ['apple', 'banana', 'cherry'];
console.log(fruits instanceof Array);  // Output: true

制御構造

JavaScriptにおける制御構造は、特定の条件やループに基づいてプログラムの実行フローを決定します。これにより、条件に基づいて決定を行ったり、複数回のタスクを実行したり、一連の値を反復処理したりすることができます。

条件文

条件文は、異なる条件に基づいて異なるアクションを実行するために使用されます。JavaScriptでは、次の種類の条件文があります。

  • if文: 指定した条件が真の場合にコードブロックを実行します。
let age = 20
if (age >= 18) {
  console.log('You are eligible to vote.')
}
  • if...else文: 指定した条件が真の場合にコードブロックを実行します。条件が偽の場合、別のコードブロックが実行されます。
js
let age = 15;
if (age >= 18) {
  console.log('You are eligible to vote.');
} else {
  console.log('You are not eligible to vote.');
}
  • if...else if...else文: 異なる条件に対して異なるコードブロックを実行します。
js
let score = 85;
if (score >= 90) {
  console.log('Grade A');
} else if (score >= 80) {
  console.log('Grade B');
} else {
  console.log('Grade C');
}
  • switch文: 実行するコードブロックを複数のコードブロックから選択します。
js
let day = 3;
switch (day) {
  case 1:
    console.log('Monday');
    break;
  case 2:
    console.log('Tuesday');
    break;
  case 3:
    console.log('Wednesday');
    break;
  //...
  default:
    console.log('Invalid day');
}

ループ

ループは、特定の回数だけコードブロックを繰り返し実行するために使用されます。JavaScriptはさまざまな種類のループをサポートしています。

  • forループ: 指定した回数だけコードブロックを繰り返し実行します。
js
for (let i = 0; i < 5; i++) {
  console.log(i);
}
  • whileループ: 指定した条件が真の間、コードブロックを繰り返し実行します。
js
let i = 0;
while (i < 5) {
  console.log(i);
  i++;
}
  • do...whileループ: 指定した条件が真の間、コードブロックを繰り返し実行します。whileループとの違いは、do...whileループは条件をチェックする前にコードブロックを1回実行することです。
js
let i = 0;
do {
  console.log(i);
  i++;
} while (i < 5);
  • for...inループ: オブジェクトのプロパティを繰り返し処理します。
js
let person = {fname:"John", lname:"Doe", age:25};
for (let x in person) {
  console.log(x);
}
  • for...ofループ: 反復可能なオブジェクトの値を繰り返し処理します。
js
let cars = ['BMW', 'Volvo', 'Mini'];
for (let x of cars) {
  console.log(x);
}

Ryusei Kakujo

researchgatelinkedingithub

Focusing on data science for mobility

Bench Press 100kg!