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 = 18console.log(delete name)console.log(delete age)console.log(typeof age)

输出：

falsetrue"undefined"

解析：

第一个 false 是因为 delete 只能删除对象上的属性，name 不是属性，所以删除失败。第二个 true 是因为我们不使用任何声明创建变量，它会被视作全局变量，挂载到 window 对象上面，等价于 delete window.age，所以删除成功。第三个 undefined 是因为 age 被删除了。第三题

尝试推测它的输出：

let person = { name: "代码与野兽" }const members = [person]person = nullconsole.log(members)

输出：

[{  name: "代码与野兽"}]

解析：很多人会认为输出结果应该是 [ null ]，但是，我们只是设置了 person 这个变量的新引用，之前的引用还在 members 中。

简单来说，{ name: "代码与野兽" } 这个对象存在某个内存空间中，假设它的地址是 X201。它的逻辑大概像下面这样：

let person = X201const 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"))

输出：

777

解析：如果 parseInt 的参数是字符串和数字的组合，那么它会从头开始检查，直到碰到数据类型错误的位置，如果在数据类型错误的位置之前是一个有效的数字，它就会返回数字。

第七题

尝试推测它的输出：

[1, 2, 3, 4].reduce((x, y) => console.log(x, y))

输出：

12undefined3undefined4

解析：如果我们不给 reduce 传递初始值，那么 x 会是数组的第一个值，y 是数组的第二个值。

第八题

尝试推测它的输出：

function getUserInfo(one, two, three) {  console.log(one)  console.log(two)  console.log(three)}const superHero = "代码与野兽"const age = 1000getUserInfo`${superHero} 是 ${age} 岁`getUserInfo`hello`

输出：

["", " 是 ", " 岁"]"代码与野兽"1000["hello"]undefinedundefined

解析：我们使用模板字符串语法去调用函数时，第一个参数始终都是分割好的字符串数组。其余的参数是模板表达式的值。

第九题

尝试推测它的输出：

(() => {  let x, y;  try {    throw new Error()  } catch (x) {    (x = 1), (y = 2);    console.log(x)  }  console.log(x)  console.log(y)})()

输出：

1undefined2

解析：在 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);}

输出：

12347

解析：没什么好解释的......

第十二题

尝试推测它的输出：

const foo = { bar: 1 };with(foo) {  var bar = 2};console.log(foo.bar);

输出：

2

解析：with 的对象会作为 global 对象。在 with 使用 var 等价于 window.[xxx]。而这时 foo 就是那个 window。

关键词： 数据类型 就是那个 看看能不能 一个对象 构造函数