JavaScript isset() は存在しない？じゃあどうやって変数定義を確認するの？

2024-05-19

JavaScriptにおける isset() の代替手段

typeof 演算子

最も一般的な方法は、typeof 演算子を使用することです。この演算子は、オペランドのデータ型を返します。変数が定義されていて値が設定されている場合は、'object' を返します。変数が定義されていない、または null の場合は、'undefined' を返します。

const obj = {
  name: 'John Doe',
  age: 30
};

if (typeof obj.name === 'object') {
  console.log('obj.name は存在します');
} else {
  console.log('obj.name は存在しません');
}

// 出力: obj.name は存在します

in 演算子

別の方法は、in 演算子を使用することです。この演算子は、指定されたプロパティがオブジェクト内に存在するかどうかを確認します。

const obj = {
  name: 'John Doe',
  age: 30
};

if ('name' in obj) {
  console.log('obj に name プロパティが存在します');
} else {
  console.log('obj に name プロパティは存在しません');
}

// 出力: obj に name プロパティが存在します

オプションチェーン演算子 (ES7 以降)

ES7 以降では、オプションチェーン演算子 (?.) を使用することができます。この演算子は、オブジェクトのプロパティが存在しない場合でもエラーを発生させずに undefined を返すため、より簡潔なコードを書くことができます。

const obj = {
  name: 'John Doe',
  age: 30
};

if (obj?.name) {
  console.log('obj.name は存在します');
} else {
  console.log('obj.name は存在しません');
}

// 出力: obj.name は存在します

留意点

上記の方法は、変数が定義されているかどうかのみを確認します。変数の値が null であるかどうかは確認しません。
オブジェクトのプロトタイプチェーン上のプロパティを確認するには、hasOwnProperty() メソッドを使用する必要があります。

isset() 関数は JavaScript に存在しませんが、上記のような代替手段を用いて、同様の機能を実現することができます。状況に応じて適切な方法を選択してください。

JavaScriptにおける isset() の代替手段 - サンプルコード

typeof 演算子

const obj = {
  name: 'John Doe',
  age: 30
};

function hasProperty(obj, prop) {
  return typeof obj[prop] === 'object';
}

if (hasProperty(obj, 'name')) {
  console.log('obj.name は存在します');
} else {
  console.log('obj.name は存在しません');
}

// 出力: obj.name は存在します

in 演算子

const obj = {
  name: 'John Doe',
  age: 30
};

function hasProperty(obj, prop) {
  return prop in obj;
}

if (hasProperty(obj, 'name')) {
  console.log('obj に name プロパティが存在します');
} else {
  console.log('obj に name プロパティは存在しません');
}

// 出力: obj に name プロパティが存在します

オプションチェーン演算子 (ES7 以降)

const obj = {
  name: 'John Doe',
  age: 30
};

function hasProperty(obj, prop) {
  return obj?.[prop];
}

if (hasProperty(obj, 'name')) {
  console.log('obj.name は存在します');
} else {
  console.log('obj.name は存在しません');
}

// 出力: obj.name は存在します

これらのサンプルコードは、変数が定義されているかどうかを確認する方法を示しています。変数の値が null であるかどうかを確認するには、以下のコードのように修正する必要があります。

function hasProperty(obj, prop) {
  return typeof obj[prop] === 'object' && obj[prop] !== null;
}

このコードは、typeof 演算子を使用して変数がオブジェクト型であることを確認し、さらに obj[prop] !== null で null でないことを確認します。

JavaScriptにおける isset() の代替手段 - その他の方法

三項演算子を使用して、簡潔なコードを書くことができます。

const obj = {
  name: 'John Doe',
  age: 30
};

const name = obj.name || 'N/A';
console.log(name); // 出力: John Doe

const age = obj.age || 0;
console.log(age); // 出力: 30

このコードでは、obj.name が存在しない場合は 'N/A' 、obj.age が存在しない場合は 0 を代入しています。

デフォルト値パラメータ (ES6 以降)

ES6 以降では、関数にデフォルト値パラメータを設定することができます。

function getProperty(obj, prop, defaultValue) {
  return obj[prop] || defaultValue;
}

const name = getProperty(obj, 'name', 'N/A');
console.log(name); // 出力: John Doe

const age = getProperty(obj, 'age', 0);
console.log(age); // 出力: 30

このコードでは、getProperty() 関数にデフォルト値パラメータ defaultValue を設定し、obj[prop] が存在しない場合は defaultValue を返します。

nullish coalescing演算子 (ES11 以降)

ES11 以降では、nullish coalescing演算子 (??) を使用することができます。この演算子は、左側のオペランドが null または undefined の場合に右側のオペランドを返します。

const obj = {
  name: 'John Doe',
  age: 30
};

const name = obj.name ?? 'N/A';
console.log(name); // 出力: John Doe

const age = obj.age ?? 0;
console.log(age); // 出力: 30