ホームページ > 記事 > ウェブフロントエンド > JavaScript の null を詳しく見る
推奨チュートリアル: 「JavaScript ビデオ チュートリアル 」
JavaScript には 2 つのタイプがあります: 基本型 (string
, # #) #booleans
number,
symbol) とオブジェクト。
let myObject = { name: '前端小智' }ただし、場合によっては、オブジェクトを作成できない場合があります。この場合、JS はオブジェクトが欠落していることを示す特別な値
null を提供します。
let myObject = nullこの記事では、JavaScript の null についてすべて学びます。その意味、検出方法、
null と
unknown の違い、そしてなぜそれを使用するのかについて説明します。
null により、コードのメンテナンスが困難になります。
1. null の概念
JS 仕様では、null:
nullたとえば、関数は、値が設定されていないオブジェクトを参照します。これは、JS の基本タイプの 1 つであり、ブール演算では
falsyと見なされます。
greetObject() はオブジェクトを作成しますが、オブジェクトを作成できない場合は
null を返すこともあります:
function greetObject(who) { if (!who) { return null; } return { message: `Hello, ${who}!` }; } greetObject('Eric'); // => { message: 'Hello, Eric!' } greetObject(); // => nullただし、関数
greetObject() がパラメータを指定して呼び出された場合、関数は
null を返します。
who パラメータには値がないため、
null を返すのが妥当です。
2. null を確認する方法
null 値を確認する良い方法は、厳密等価演算子:
const missingObject = null; const existingObject = { message: 'Hello!' }; missingObject === null; // => true existingObject === null; // => false
missingObject === null
missingObject 変数に
null が含まれるため、結果は
true になります。価値。
existObject === null は
false と評価されます。
2.1 null は仮想値
null および
false、
0、
''、
unknown、
NaN はすべて虚数です。条件文で false 値が見つかった場合、JS は false 値を強制的に
false に設定します。
Boolean(null); // => false if (null) { console.log('null is truthy') } else { console.log('null is falsy') }
2.2 typeof null
typeof value演算子は値のタイプを決定します。たとえば、typeof 15 は
'number' であり、
typeof {prop: 'Value'} の計算結果は
'object' となります。
type null
typeof null; // => 'object'の結果は何ですか。
'object'、
typoef null は # です。 ##object
は初期の JS 実装のバグです。
値を検出するには、typeof
演算子を使用します。前に述べたように、厳密等価演算子 myVar === null
を使用します。
演算子を使用して変数がオブジェクトかどうかを確認する場合は、null
値も除外する必要があります: <pre class="brush:php;toolbar:false">function isObject(object) {
return typeof object === 'object' && object !== null;
}
isObject({ prop: 'Value' }); // => true
isObject(15); // => false
isObject(null); // => false</pre>
3. null
null の罠は、変数をオブジェクトだと思っているときに予期せず現れることがよくあります。次に、null
からプロパティを抽出すると、JS はエラーをスローします。
関数を再度使用し、返されたオブジェクトから message
プロパティへのアクセスを試みます: <pre class="brush:php;toolbar:false">let who = '';
greetObject(who).message;
// throws "TypeError: greetObject() is null"</pre>
because
変数は空の文字列であるため、関数は null
を返します。 null
から message
プロパティにアクセスすると、TypeError
エラーが発生します。 null マージによるオプションのチェーンを使用することで処理できます
:<pre class="brush:php;toolbar:false">let who = ''
greetObject(who)?.message ?? 'Hello, Stranger!'
// => 'Hello, Stranger!'</pre>
4. null ## の代替案#オブジェクトを構築できない場合、通常のアプローチは null
を返すことですが、このアプローチには欠点があります。実行スタックにnull が表示された場合は、チェックを実行する必要があります。
null
エラーをスローする代わりに、
代わりにデフォルトのオブジェクトを返します。
null
を返す場合は、最初に greetObject() 関数に戻ります。パラメーターが欠落している場合、
null:
function greetObject(who) { if (!who) { who = 'Stranger'; } return { message: `Hello, ${who}!` }; } greetObject('Eric'); // => { message: 'Hello, Eric!' } greetObject(); // => { message: 'Hello, Stranger!' }
を返す代わりにデフォルトのオブジェクトを返すか、エラーをスローすることができます:
function greetObject(who) { if (!who) { throw new Error('"who" argument is missing'); } return { message: `Hello, ${who}!` }; } greetObject('Eric'); // => { message: 'Hello, Eric!' } greetObject(); // => throws an errorこれら 2 つのアプローチにより、
の使用を回避できます。ヌル###。
5.
null 対 未定義 unknown は初期化されていない変数またはオブジェクトのプロパティの値であり、
は初期化されていない変数またはオブジェクトのプロパティの値です。 <pre class="brush:php;toolbar:false">let myVariable;
myVariable; // => undefined</pre>
null
と
の主な違いは、null
は欠落しているオブジェクトを表すのに対し、unknown
は初期化されていない状態を表すことです。 。 厳密等価演算子
演算子===
と unknown
:<pre class="brush:php;toolbar:false">null === undefined // => false</pre>
および二重等価演算子==
は、
および unknown
と等しいとみなされます。<pre class="brush:php;toolbar:false">null == undefined // => true</pre>
<p>我使用双等相等运算符检查变量是否为<code>null
或undefined
:
function isEmpty(value) { return value == null; } isEmpty(42); // => false isEmpty({ prop: 'Value' }); // => false isEmpty(null); // => true isEmpty(undefined); // => true
6. 总结
null
是JavaScript中的一个特殊值,表示丢失的对象,严格相等运算符确定变量是否为空:variable === null
。
typoef
运算符对于确定变量的类型(number
, string
, boolean
)很有用。 但是,如果为null
,则typeof会产生误导:typeof null
的值为'object'
。
null
和undefined
在某种程度上是等价的,但null
表示缺少对象,而undefined
未初始化状态。
更多编程相关知识,请访问:编程视频课程!!
以上がJavaScript の null を詳しく見るの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。