你到底懂不懂JavaScript?来做做这12道面试题试试!
携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第 21 天,点击查看活动详情
JavaScript 是每一个前端开发者都应该掌握的基础技术,但是很多时候,你可能并不完全懂 JavaScript。
检测一个人的技术水平有两个非常简单的办法,看他写的代码,或者让他看别人写的代码。
我总结了一些可以考察对 JavaScript 理解能力的代码题,你可以试着做一下,看看能不能全部答对。全答对了,才算是懂一些 JavaScript。
第一题
尝试推测它的输出:
const person = { name: '代码与野兽' }
Object.defineProperty(person, 'age', { value: 18 })
console.log(person.age)
console.log(Object.keys(person))
输出:
18
['name']
解析:
很多人容易搞错第二个输出,因为使用 defineProperty 定义的属性默认是不可枚举的。
第二题
尝试推测它的输出:
const name = '代码与野兽'
age = 18
console.log(delete name)
console.log(delete age)
console.log(typeof age)
输出:
false
true
"undefined"
解析:
第一个 false 是因为 delete 只能删除对象上的属性,name 不是属性,所以删除失败。
第二个 true 是因为我们不使用任何声明创建变量,它会被视作全局变量,挂载到 window 对象上面,等价于 delete window.age,所以删除成功。
第三个 undefined 是因为 age 被删除了。
第三题
尝试推测它的输出:
let person = { name: '代码与野兽' }
const members = [person]
person = null
console.log(members)
输出:
[{
name: "代码与野兽"
}]
解析:
很多人会认为输出结果应该是 [ null ],但是,我们只是设置了 person 这个变量的新引用,之前的引用还在 members 中。
简单来说,{ name: '代码与野兽' } 这个对象存在某个内存空间中,假设它的地址是 X201。它的逻辑大概像下面这样:
let person = X201
const members = [X201]
persion = null
第四题
尝试推测它的输出:
function SuperHero() {
this.make = '代码与野兽'
return { make: '野兽与代码'}
}
const mySuperhero = new SuperHero()
console.log(mySuperhero)
输出:
{
make: "野兽与代码"
}
复制代码
解析:
如果构造函数最终返回了一个对象,那么之前设置的属性都将失效。
第五题
尝试推测它的输出:
const name = '代码与野兽'
console.log(name.padStart(14))
console.log(name.padStart(2))
输出:
" 代码与野兽"
"代码与野兽"
解析:
padStart 方法可以在字符串的开头填充空格。
参数是新字符串的总长度,如果这个长度比原来的字符串长度短,那么不会填充。
第六题
尝试推测它的输出:
console.log(parseInt("7"))
console.log(parseInt("7*6"))
console.log(parseInt("7Din"))
输出:
7
7
7
解析:
如果 parseInt 的参数是字符串和数字的组合,那么它会从头开始检查,直到碰到数据类型错误的位置,如果在数据类型错误的位置之前是一个有效的数字,它就会返回数字。
第七题
尝试推测它的输出:
[1, 2, 3, 4].reduce((x, y) => console.log(x, y))
输出:
1
2
undefined
3
undefined
4
解析:
如果我们不给 reduce 传递初始值,那么 x 会是数组的第一个值,y 是数组的第二个值。
第八题
尝试推测它的输出:
function getUserInfo(one, two, three) {
console.log(one)
console.log(two)
console.log(three)
}
const superHero = '代码与野兽'
const age = 1000
getUserInfo`${superHero} 是 ${age} 岁`
getUserInfo`hello`
输出:
["", " 是 ", " 岁"]
"代码与野兽"
1000
["hello"]
undefined
undefined
解析:
我们使用模板字符串语法去调用函数时,第一个参数始终都是分割好的字符串数组。其余的参数是模板表达式的值。
第九题
尝试推测它的输出:
(() => {
let x, y;
try {
throw new Error()
} catch (x) {
(x = 1), (y = 2);
console.log(x)
}
console.log(x)
console.log(y)
})()
输出:
1
undefined
2
解析:
在 catch 中访问 x,访问的是参数,而不是外面的变量 x。
第十题
尝试推测它的输出:
class Clazz {}
console.log(typeof Clazz)
输出:
"function"
解析:
在 JavaScript 中,Class 也是 function。
第十一题
尝试推测它的输出:
const arr = [7, 1, 4, 3, 2];
for (const elem of arr) {
setTimeout(() => console.log(elem), elem);
}
输出:
1
2
3
4
7
解析:
没什么好解释的......
第十二题
尝试推测它的输出:
const foo = { bar: 1 };
with(foo) {
var bar = 2
};
console.log(foo.bar);
输出:
2
解析:
with 的对象会作为 global 对象。在 with 使用 var 等价于 window.[xxx]。而这时 foo 就是那个 window。
程序员面试题库分享
1、前端面试题库 (面试必备) 推荐:★★★★★
地址:前端面试题库
2、前端技术导航大全 推荐:★★★★★
地址:前端技术导航大全
3、开发者颜色值转换工具 推荐:★★★★★
地址 :开发者颜色值转换工具
最新文章
- linux下 nginx、php-fpm、mysql 开机自启动
- HttpClient学习整理
- mysql常用操作语句
- Jquery仿彩票更换数字动画效果
- 6、UITableView表的分割线左对齐
- Windows Live Writer配置测试
- 搜搜(www.soso.com),I 老虎油!
- td中的值自动换行
- IIS7.0发布后关于";不能在此路径中使用此配置节”的解决办法
- Python的字符编码
- 选择性计量学(Altmetric)介绍
- myeclipse10 blue版激活码
- 【非专业前端】vue+element+webpack
- Oracle存储过程procedure in、out、in out 模式参数【不发布,纯转】
- python接口自动化测试(三)-requests.post()
- async源码学习 - 控制流程waterfall函数
- LeetCode 题解 Permutation Sequence 需要优化!
- pages bookmarks for machine learning domain
- protobuffer php使用
- centos关闭selinux
热门文章
- MySQL 不四舍五入取整、取小数、四舍五入取整、取小数、向下、向上取整
- 【开源】libserial_parse_text:命令行解析的基础库
- vuex 的使用详解
- Spring boot 3.0 日志
- JAVA虚拟机06-垃圾回收及引用类型
- Android JetPack~ DataBinding(数据绑定)(一) 集成与使用
- P11_组件-button和image组件的基本用法
- Class path contains multiple SLF4J bindings解决
- JavaScript原型和原型链?有什么特点?
- echarts使用dataset数据集创建单轴散点图