constとfunctionの基本的な違い
JavaScriptには、変数を宣言するためのいくつかのキーワードがあります。その中でも、constとfunctionは特に重要です。
const
constは、定数を宣言するためのキーワードです。一度constで宣言された変数は、再代入することができません。つまり、一度値が設定されると、その値は変更できません。
const pi = 3.14;
pi = 3.1415; // TypeError: Assignment to constant variable.
function
一方、functionは関数を宣言するためのキーワードです。関数は、一連の手続きをまとめたもので、特定のタスクを実行したり、計算を行ったりします。
function greet() {
console.log("Hello, world!");
}
greet(); // "Hello, world!"
これらの違いを理解することで、JavaScriptのコードをより効率的に書くことができます。次のセクションでは、アロー関数と通常の関数の違いについて詳しく説明します。お楽しみに！
アロー関数と通常の関数の違い
JavaScriptには、functionキーワードを使用した通常の関数と、アロー(=>)を使用したアロー関数の2つの主要な関数タイプがあります。これらの関数タイプは、構文とthisの振る舞いの点で主に異なります。
通常の関数
通常の関数はfunctionキーワードを使用して宣言されます。thisの値は、関数がどのように呼び出されるかによって決まります。
function greet() {
console.log(this);
}
greet(); // Window {...} (ブラウザのグローバルオブジェクト)
アロー関数
アロー関数は、アロー(=>)を使用して宣言されます。thisの値は、関数が定義されたスコープによって決まります。
const greet = () => {
console.log(this);
};
greet(); // {} (アロー関数が定義されたスコープのthis)
これらの違いを理解することで、JavaScriptのコードをより効率的に書くことができます。次のセクションでは、thisキーワードの挙動について詳しく説明します。お楽しみに！
thisキーワードの挙動
JavaScriptのthisキーワードは、他の多くのプログラミング言語とは異なり、その挙動が非常に特殊です。thisの値は、関数がどのように呼び出されるかによって決まります。
通常の関数でのthis
通常の関数では、thisは関数が呼び出される際のコンテキストに依存します。つまり、関数がどのように呼び出されるかによって、thisの値が変わります。
function greet() {
console.log(this);
}
greet(); // Window {...} (ブラウザのグローバルオブジェクト)
const obj = {
greet: function() {
console.log(this);
}
};
obj.greet(); // { greet: [Function: greet] } (objオブジェクト)
アロー関数でのthis
一方、アロー関数では、thisは関数が定義された時点でのthisの値を「記憶」します。これをレキシカルスコープと呼びます。
const obj = {
greet: () => {
console.log(this);
}
};
obj.greet(); // {} (アロー関数が定義されたスコープのthis)
これらの違いを理解することで、JavaScriptのコードをより効率的に書くことができます。次のセクションでは、constでのオブジェクトと配列の扱いについて詳しく説明します。お楽しみに！
constでのオブジェクトと配列の扱い
JavaScriptのconstキーワードは、一度宣言された変数に再代入することを禁止します。しかし、constで宣言されたオブジェクトや配列のプロパティや要素は変更することができます。
オブジェクトでのconst
オブジェクトのプロパティは、そのオブジェクトがconstで宣言されていても変更することができます。
const obj = {
name: "John"
};
obj.name = "Jane"; // これは許されます
console.log(obj.name); // "Jane"
obj = {}; // TypeError: Assignment to constant variable.
配列でのconst
同様に、配列の要素もconstで宣言されていても変更することができます。
const arr = [1, 2, 3];
arr[0] = 4; // これは許されます
console.log(arr); // [4, 2, 3]
arr = []; // TypeError: Assignment to constant variable.
これらの違いを理解することで、JavaScriptのコードをより効率的に書くことができます。次のセクションでは、var, let, constの比較について詳しく説明します。お楽しみに！
var, let, constの比較
JavaScriptには、変数を宣言するための3つのキーワード、var、let、constがあります。これらは、スコープ、再代入、再宣言という観点で異なります。
var
varは、関数スコープの変数を宣言します。varで宣言された変数は、同じスコープ内で再宣言することができます。また、varで宣言された変数は、再代入することができます。
var x = 1;
var x; // 再宣言は許されます
x = 2; // 再代入も許されます
let
letは、ブロックスコープの変数を宣言します。letで宣言された変数は、同じスコープ内で再宣言することはできません。しかし、letで宣言された変数は、再代入することができます。
let y = 1;
let y; // TypeError: Identifier 'y' has already been declared
y = 2; // 再代入は許されます
const
constも、ブロックスコープの変数を宣言します。constで宣言された変数は、同じスコープ内で再宣言することはできません。さらに、constで宣言された変数は、再代入することもできません。
const z = 1;
const z; // TypeError: Identifier 'z' has already been declared
z = 2; // TypeError: Assignment to constant variable.
これらの違いを理解することで、JavaScriptのコードをより効率的に書くことができます。この記事がJavaScriptの学習に役立つことを願っています！