读者福利
========
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
由于篇幅过长,就不展示所有面试题了,想要完整面试题目的朋友(另有小编自己整理的2024大厂高频面试题及答案附赠)
在JavaScript中,每个变量都可以容纳对象值和基本类型值。因此,如果null
意味着 “不是一个对象”,那么JavaScript也需要一个初始化值,意味着 “既不是一个对象也不是一个原始值”。这个初始化值就是 undefined
。
undefined 的出现
如果一个变量myVar
还没有被初始化,它的值是undefined
。
let myVar;
assert.equal(myVar, undefined);
如果一个属性.unknownProp
丢失,访问该属性会产生undefined
的值。
const obj = {};
assert.equal(obj.unknownProp, undefined);
如果一个函数有一个没有参数的返回语句,该函数隐含地返回undefined
。
function myFunc() {
return;
}
assert.equal(myFunc(), undefined);
如果一个参数x
被省略了,语言将该参数初始化为undefined
。
function myFunc() {
return;
}
assert.equal(myFunc(), undefined);
myFunc();
通过obj?.someProp
的可选链路,如果obj未定义或为空,则返回未定义。
undefined?.someProp
undefined
null?.someProp
undefined
一个对象的原型要么是一个对象,要么在原型链的末端是null
。Object.prototype
没有原型。
Object.getPrototypeOf(Object.prototype)
null
如果我们将一个正则表达式(如/a/
)与一个字符串(如'x'
)相匹配,我们要么得到一个带有匹配数据的对象(如果匹配成功),要么得到空(如果匹配失败)。
/a/.exec(‘x’)
null
JSON数据格式不支持undefined
,只支持null
。
JSON.stringify({a: undefined, b: null})
‘{“b”:null}’
4.1 undefined 和参数默认值
在以下情况下,将使用参数默认值。
-
缺少一个参数。
-
一个参数的值是
undefined
。
例如:
function myFunc(arg=‘abc’) {
return arg;
}
assert.equal(myFunc(‘hello’), ‘hello’);
assert.equal(myFunc(), ‘abc’);
assert.equal(myFunc(undefined), ‘abc’);
undefined
也触发了参数的默认值,这说明它是一个元值。
下面的例子说明了这一点的用处。
function concat(str1=‘’, str2=‘’) {
return str1 + str2;
}
function twice(str) { // (A)
return concat(str, str);
}
在A
行,我们没有为str
指定一个参数默认值。当这个参数缺失时,我们把这个状态转发给concat()
,让它选择一个默认值。
4.2 undefined 的和解构的默认值
解构中的缺省值与参数缺省值的工作原理类似–如果一个变量在数据中没有匹配,或者它与undefined
的变量匹配,就会使用它们。
const [a=‘a’] = [];
assert.equal(a, ‘a’);
const [b=‘b’] = [undefined];
assert.equal(b, ‘b’);
const {prop: c=‘c’} = {};
assert.equal(c, ‘c’);
const {prop: d=‘d’} = {prop: undefined};
assert.equal(d, ‘d’);
4.3 undefined 和 null 以及可选链
当通过 value?.prop
进行可选的链接时
-
如果
value
是undefined
或null
,则返回undefined
。也就是说,只要value.prop
会抛出一个异常,就会发生这种情况。 -
否则,返回
value.prop
。
function getProp(value) {
// optional static property access
return value?.prop;
}
assert.equal(
getProp({prop: 123}), 123);
assert.equal(
getProp(undefined), undefined);
assert.equal(
getProp(null), undefined);
下面两个操作的效果类似。
obj?.[«expr»] // optional dynamic property access
func?.(«arg0», «arg1») // optional function or method call
4.4 undefined 和 null 和 nullish 聚结
nullish 合并算子??
如果一个值undefined
或为null
,则允许我们使用默认值:
undefined ?? ‘default value’
‘default value’
null ?? ‘default value’
‘default value’
0 ?? ‘default value’
0
123 ?? ‘default value’
123
‘’ ?? ‘default value’
‘’
‘abc’ ?? ‘default value’
‘abc’
null合并赋值操作符??=
:
function setName(obj) {
obj.name ??= ‘(Unnamed)’;
return obj;
}
assert.deepEqual(
setName({}),
{name: ‘(Unnamed)’}
);
assert.deepEqual(
setName({name: undefined}),
{name: ‘(Unnamed)’}
);
assert.deepEqual(
setName({name: null}),
{name: ‘(Unnamed)’}
);
assert.deepEqual(
setName({name: ‘Jane’}),
{name: ‘Jane’}
);
下面分享一下我们自己的代码中处理undefined
和null
的最常见方法。
5.1 undefined 或 null 都不能作为实际值使用
举例,我们可能希望一个属性file.title
永远存在,并且永远是一个字符串。有两种常见的方法来实现这一点。
这里,只检查undefined
和null
,而不检查一个值是否是字符串。你必须自己决定是否要把它作为一个额外的安全措施来实施。
5.1 undefined 和 null 都是禁止的
如下所示
function createFile(title) {
if (title === undefined || title === null) {
throw new Error(‘title
must not be nullish’);
}
// ···
}
为什么选择这种方法?
我们想把undefined
和null
当作一样的东西,因为JavaScript代码经常这样做–比如说。
// 检测一个属性是否存在
if (!obj.requiredProp) {
obj.requiredProp = 123;
}
const myValue = myParameter ?? ‘some default’;
如果我们的代码中出现了问题,出现了undefined
或null
,我们希望它尽可能快地失败。
5.1.2 undefined 和 null 都会触发默认值
如下所示
function createFile(title) {
title ??= ‘(Untitled)’;
// ···
}
我们不能在这里使用参数缺省值,因为它只由undefined
触发。相反,我们依靠nullish 合并赋值运算符??=
。
为什么选择这种方法?
-
我们想把
undefined
和null
同等对待(见上一节)。 -
我们希望我们的代码能够稳健地、无声地处理
undefined
和null
。
5.2 undefined 或 null 都是“关闭”值
例如,我们可能希望一个属性file.title
是一个字符串或 “关闭”(文件没有标题)。有几种方法可以实现这一点。
5.2.1 null是 "关闭的 "值
function createFile(title) {
if (title === undefined) {
throw new Error(‘title
must not be undefined’);
}
return {title};
}
另外,undefined
可以触发一个默认值。
function createFile(title = ‘(Untitled)’) {
return {title};
}
为什么选择这种方法?
更多面试题
**《350页前端校招面试题精编解析大全》**内容大纲主要包括 HTML,CSS,前端基础,前端核心,前端进阶,移动端开发,计算机基础,算法与数据结构,项目,职业发展等等
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
没有标题)。有几种方法可以实现这一点。
5.2.1 null是 "关闭的 "值
function createFile(title) {
if (title === undefined) {
throw new Error(‘title
must not be undefined’);
}
return {title};
}
另外,undefined
可以触发一个默认值。
function createFile(title = ‘(Untitled)’) {
return {title};
}
为什么选择这种方法?
更多面试题
**《350页前端校招面试题精编解析大全》**内容大纲主要包括 HTML,CSS,前端基础,前端核心,前端进阶,移动端开发,计算机基础,算法与数据结构,项目,职业发展等等
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
[外链图片转存中…(img-0gUXErnJ-1715770850160)]