前言

记录 js 输出问题过程和知识点解答

1 暂时性死区和变量提升

输出是什么?

1
2
3
4
5
6
7
8
function sayHi() {
console.log(name);
console.log(age);
var name = "Lydia";
let age = 21;
}

sayHi();
  • A: Lydia 和 undefined
  • B: Lydia 和 ReferenceError
  • C: ReferenceError 和 21
  • D: undefined 和 ReferenceError
答案 D let,const 声明前读取有暂时性死区,js 抛出`ReferenceError` 变量提升 `undefined`置顶

2 作用域以及事件循环

输出是什么?

1
2
3
4
5
6
7
for (var i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 1);
}

for (let i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 1);
}
  • A: 0 1 2 和 0 1 2
  • B: 0 1 2 和 3 3 3
  • C: 3 3 3 和 0 1 2
答案 由于 js 的事件循环机制,settimeout 的内容是在循环结束才输出的,第一个 i 声明用的是 var 此时 i 是在全局作用域,也就是我们一直递增到 3 结束循环才输出 settimeout 的内容,也就是 333 第二点由于下面是 let 声明的块级作用域,每次循环都会产生新值,所以 setimeout 的时候,i 拿到的是当前作用域里面的值,也就是 012

3 箭头函数和常规函数的 this

输出是什么?

1
2
3
4
5
6
7
8
9
10
const shape = {
radius: 10,
diameter() {
return this.radius * 2;
},
perimeter: () => 2 * Math.PI * this.radius,
};

shape.diameter();
shape.perimeter();
  • A: 20 and 62.83185307179586
  • B: 20 and NaN
  • C: 20 and 63
  • D: NaN and 63
答案 shape 调用了 diameter 常规函数,所以 this 指向 shape,读的到 radius perimeter 是一个箭头函数,对于该函数的 this 指向的是它的周围作用域,也就是包含箭头函数的常规函数,如果没有,就是 window 很明显此处没有常规函数包装它,于是指向 window,window 上没有这个属性,对于 undefined+数字输出的是 NaN

4 值转换

输出是什么?

1
2
+true;
!"Lydia";
  • A: 1 and false
  • B: false and NaN
  • C: false and false
答案 A 注意+还可以转换 string,相当于`Number()`的效果

5 对象运算优先级

哪一个是无效的?

1
2
3
4
5
6
7
8
const bird = {
size: "small",
};

const mouse = {
name: "Mickey",
small: true,
};
  • A: mouse.bird.size
  • B: mouse[bird.size]
  • C: mouse[bird[“size”]]
  • D: All of them are valid
答案 A 先计算括号里面的,如果没有括号链式计算,显然 A 是没有 bird 的

6 对象相等时地址相同

输出是什么

1
2
3
4
5
6
let c = { greeting: "Hey!" };
let d;

d = c;
c.greeting = "Hello";
console.log(d.greeting);
  • A: Hello
  • B: undefined
  • C: ReferenceError
  • D: TypeError
答案 A 此时内存中的地址相同

7 =====以及 new 对象

输出是什么?

1
2
3
4
5
6
7
let a = 3;
let b = new Number(3);
let c = 3;

console.log(a == b);
console.log(a === b);
console.log(b === c);
  • A: true false true
  • B: false false true
  • C: true false false
  • D: false true true
答案 C new Number()是新建了一个对象 ==的时候比较值 所以相同 ===的时候比较值和类型,所以对象不同于 number

8 静态方法的调用

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
class Chameleon {
static colorChange(newColor) {
this.newColor = newColor;
return this.newColor;
}

constructor({ newColor = "green" } = {}) {
this.newColor = newColor;
}
}

const freddie = new Chameleon({ newColor: "purple" });
freddie.colorChange("orange");
  • A: orange
  • B: purple
  • C: green
  • D: TypeError
答案 静态方法只能被类调用,不能被实例调用

9 不声明变量直接赋值

输出是什么?

1
2
3
let greeting;
greetign = {}; // Typo!
console.log(greetign);
  • A: {}
  • B: ReferenceError: greetign is not defined
  • C: undefined
答案 A 可以使用`use Strict`确保声明变量的时候必须赋值

10 给函数添加属性

当我们这么做时,会发生什么?

1
2
3
4
5
function bark() {
console.log("Woof!");
}

bark.animal = "dog";
  • A: 正常运行!
  • B: SyntaxError. 你不能通过这种方式给函数增加属性。
  • C: undefined
  • D: ReferenceError
答案 A js 一切皆对象

11 构造函数添加方法

输出是什么

1
2
3
4
5
6
7
8
9
10
11
function Person(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}

const member = new Person("Lydia", "Hallie");
Person.getFullName = function () {
return `${this.firstName} ${this.lastName}`;
};

console.log(member.getFullName());
  • A: TypeError
  • B: SyntaxError
  • C: Lydia Hallie
  • D: undefined undefined
答案 A 不能像常规对象一样给构造函数添加属性,要想添加属性必须这样写
1
2
3
Person.prototype.getFullName = function () {
return `${this.firstName} ${this.lastName}`;
};
这样才能给所有的实例添加对应的属性。 原因是:如果我们可以直接添加方法到构造函数中,那么所有的 Person 实例上都拥有这个方法,对于不需要这个方法的实例,会浪费大量的空间内存。如果添加到原型上面,实例只有在需要这个方法的时候,才会去原型上面找,不占据自身的空间。只在原型中占一个位置,但所有实例都可以访问。

12 new 和不 new

输出是什么

1
2
3
4
5
6
7
8
9
10
function Person(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}

const lydia = new Person("Lydia", "Hallie");
const sarah = Person("Sarah", "Smith");

console.log(lydia);
console.log(sarah);
  • A: Person {firstName: “Lydia”, lastName: “Hallie”} and undefined
  • B: Person {firstName: “Lydia”, lastName: “Hallie”} and Person {firstName: “Sarah”, lastName: “Smith”}
  • C: Person {firstName: “Lydia”, lastName: “Hallie”} and {}
  • D: Person {firstName: “Lydia”, lastName: “Hallie”} and ReferenceError
答案 new 的时候 this 默认引用我们创建的空对象 不 new 的时候 this 默认引用 window,也就是实际上 `window.firstName = Sarah`,但 sarah 还是 undefined

13 事件传播的三个阶段是什么?

  • A: Target > Capturing > Bubbling
  • B: Bubbling > Target > Capturing
  • C: Target > Bubbling > Capturing
  • D: Capturing > Target > Bubbling
答案 D 在捕获阶段中,事件从祖先元素向下传播到目标元素。当事件到达目标后,冒泡才开始

14 所有对象都有原型?

  • A: true
  • B: false
答案 B 除了基本对象(base object),所有对象都有原型。基本对象可以访问一些方法和属性,比如 .toString。这就是为什么你可以使用内置的 JavaScript 方法!所有这些方法在原型上都是可用的。虽然 JavaScript 不能直接在对象上找到这些方法,但 JavaScript 会沿着原型链找到它们,以便于你使用。

15 隐式类型转换

输出是什么

1
2
3
4
5
function sum(a, b) {
return a + b;
}

sum(1, "2");
  • A: NaN
  • B: TypeError
  • C: “12”
  • D: 3
答案 C 隐式类型转换"12"

16 运算符

输出是什么?

1
2
3
4
let number = 0;
console.log(number++);
console.log(++number);
console.log(number);
  • A: 1 1 2
  • B: 1 2 2
  • C: 0 2 2
  • D: 0 1 2
    答案

C

</details>

17 标记模板字面量

输出是什么?

1
2
3
4
5
6
7
8
9
10
function getPersonInfo(one, two, three) {
console.log(one);
console.log(two);
console.log(three);
}

const person = "Lydia";
const age = 21;

getPersonInfo`${person} is ${age} years old`;
  • A: “Lydia” 21 [“”, “ is “, “ years old”]
  • B: [“”, “ is “, “ years old”] “Lydia” 21
  • C: “Lydia” [“”, “ is “, “ years old”] 21
答案 B 当函数调用的时候提供标记模板字面量,那么优先将模板的数组传入,随之传入的是其中的变量

18 比较对象

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
function checkAge(data) {
if (data === { age: 18 }) {
console.log("You are an adult!");
} else if (data == { age: 18 }) {
console.log("You are still an adult.");
} else {
console.log(`Hmm.. You don't have an age I guess`);
}
}

checkAge({ age: 18 });
  • A: You are an adult!
  • B: You are still an adult.
  • C: Hmm.. You don’t have an age I guess
答案 C 对象不能直接比较相等性,需要对每层对象递归比较才行

19 拓展运算符

1
2
3
4
5
function getAge(...args) {
console.log(typeof args);
}

getAge(21);
  • A: “number”
  • B: “array”
  • C: “object”
  • D: “NaN”
答案 C 拓展运算符返回的是实参组成的数组,因此结果是object

20 use strict

输出是什么?

1
2
3
4
5
6
7
function getAge() {
"use strict";
age = 21;
console.log(age);
}

getAge();

A: 21
B: undefined
C: ReferenceError
D: TypeError

答案 C use strict表明下面的变量必须在声明之后赋值,否则抛出指向异常

21 eval

输出是什么

1
const sum = eval("10*10+5");

A: 105
B: “105”
C: TypeError
D: “10*10+5”

答案 A 代码以字符串的形式传递进来,eval对其求值,如果它是一个表达式,就对表达式求值,返回结果number的105

22 sessionStorage

cool_secret 可访问多长时间?

1
sessionStorage.setItem("cool_secret", 123);

A: 永远,数据不会丢失。
B: 当用户关掉标签页时。
C: 当用户关掉整个浏览器,而不只是关掉标签页。
D: 当用户关闭电脑时。

答案 B

23 var

输出是什么?

1
2
3
4
var num = 8;
var num = 10;

console.log(num);

A: 8
B: 10
C: SyntaxError
D: ReferenceError

答案 B 新值覆盖旧值 但const let不行

24 对象键和set集合

输出是什么?

1
2
3
4
5
6
7
const obj = { 1: "a", 2: "b", 3: "c" };
const set = new Set([1, 2, 3, 4, 5]);

obj.hasOwnProperty("1");
obj.hasOwnProperty(1);
set.has("1");
set.has(1);

A: false true false true
B: false true true true
C: true true false true
D: true true true true

答案 C 对象的键始终是字符串。set集合是根据输入的参数决定

25 同名的键

输出是什么

1
2
const obj = { a: "one", b: "two", a: "three" };
console.log(obj);

A: { a: “one”, b: “two” }
B: { b: “two”, a: “three” }
C: { a: “three”, b: “two” }
D: SyntaxError

答案 C 如果有两个同名的键,新值会替换旧值,但是键还是在原来的位置

26 全局执行上下文

JavaScript 全局执行上下文为你做了两件事:全局对象和 this 关键字。

A: true
B: false
C: it depends

答案 A

27 continue

输出是什么

1
2
3
4
for (let i = 1; i < 5; i++) {
if (i === 3) continue;
console.log(i);
}

A: 1 2
B: 1 2 3
C: 1 2 4
D: 1 3 4

答案 C continue跳过本次迭代

28 访问原型添加的方法

输出是什么

1
2
3
4
5
6
7
String.prototype.giveLydiaPizza = () => {
return "Just give Lydia pizza already!";
};

const name = "Lydia";

name.giveLydiaPizza();

A: “Just give Lydia pizza already!”
B: TypeError: not a function
C: SyntaxError
D: undefined

答案 A 我们向String的原型添加了一个方法,所以下面所属的string对象都可以访问该方法

29 对象转字符串

输出是什么

1
2
3
4
5
6
7
8
const a = {};
const b = { key: "b" };
const c = { key: "c" };

a[b] = 123;
a[c] = 456;

console.log(a[b]);

A: 123
B: 456
C: undefined
D: ReferenceError

答案 B a在使用b这个键的时候,把b自动转为了字符串,也就是`[object object]`且这个值对应为123 第二次转为456 输出的时候 也就是456了 考察的是对象转字符串

30 事件循环

输出是什么

1
2
3
4
5
6
7
const foo = () => console.log("First");
const bar = () => setTimeout(() => console.log("Second"));
const baz = () => console.log("Third");

bar();
foo();
baz();

A: First Second Third
B: First Third Second
C: Second First Third
D: Second Third First

答案 B 事件循环

31 事件target

当点击按钮时,event.target 是什么?

1
2
3
4
5
<div onclick="console.log('first div')">
<div onclick="console.log('second div')">
<button onclick="console.log('button')">Click!</button>
</div>
</div>

A: Outer div
B: Inner div
C: button
D: 一个包含所有嵌套元素的数组。

答案 C 导致事件的最深嵌套元素是事件的target。可以通过`event.stopPropagation`来停止冒泡

32 事件执行

当您单击该段落时,日志输出是什么?

1
2
3
<div onclick="console.log('div')">
<p onclick="console.log('p')">Click here!</p>
</div>

A: p div
B: div p
C: p
D: div

答案 A 捕获 目标 冒泡 默认情况下事件将在冒泡阶段执行 除非设置`useCapture:true`

33 call 和 bind

输出是什么

1
2
3
4
5
6
7
8
const person = { name: "Lydia" };

function sayHi(age) {
console.log(`${this.name} is ${age}`);
}

sayHi.call(person, 21);
sayHi.bind(person, 21);

A: undefined is 21 Lydia is 21
B: function function
C: Lydia is 21 Lydia is 21
D: Lydia is 21 function

答案 C `.call`绑定的是立刻执行的 `bind`返回的是一个函数 需要去执行该函数才可以

34 typeof IIFE

输出是什么

1
2
3
4
5
function sayHi() {
return (() => 0)();
}

typeof sayHi();

A: “object”
B: “number”
C: “function”
D: “undefined”

答案 B sayHi返回的是IIFE的返回值 具体是0 所以是number

35 falsy

下面哪些值是 falsy?

1
2
3
4
5
6
0;
new Number(0)
("")
(" ");
new Boolean(false);
undefined;

A: 0, ‘’, undefined
B: 0, new Number(0), ‘’, new Boolean(false), undefined
C: 0, ‘’, new Boolean(false), undefined
D: All of them are falsy

答案 A new xxx是对象 是truthy,非空字符串也是truthy

36 typeof typeof

输出是什么

1
2
3
4
5
6
console.log(typeof typeof 1);

A: "number";
B: "string";
C: "object";
D: "undefined";
答案 B

37 设置数组值超过数组长度

输出是什么

1
2
3
4
5
6
7
8
const numbers = [1, 2, 3]
numbers[10] = 11
console.log(numbers)

A: [1, 2, 3, 7 x null, 11]
B: [1, 2, 3, 11]
C: [1, 2, 3, 7 x empty, 11]
D: SyntaxError
答案 C 当设置的数组值超过数组长度的时候,会自动生成一系列的undefined 这里也就是显示了七个空

38 catch接收

输出是什么

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
(() => {
let x, y
try {
throw new Error()
} catch (x) {
(x = 1), (y = 2)
console.log(x)
}
console.log(x)
console.log(y)
})()


A: 1 undefined 2
B: undefined undefined undefined
C: 1 1 2
D: 1 undefined undefined
答案 catch接收的参数x不是实际的x。这个x是属于catch块级作用域的,然后把块级作用域的变量赋为1,同时也设置了y的值 所以输出1 然后下面的x没有赋值是undefined 然后是2

39 JavaScript 中的一切都是?

JavaScript 中的一切都是?
A: 基本类型与对象
B: 函数与对象
C: 只有对象
D: 数字与对象

答案 A

40 reduce

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
[
[0, 1],
[2, 3],
].reduce(
(acc, cur) => {
return acc.concat(cur);
},
[1, 2]
);

A: [0, 1, 2, 3, 1, 2];
B: [6, 1, 2];
C: [1, 2, 0, 1, 2, 3];
D: [1, 2, 6];
答案 C

41 !!

输出是什么?

1
2
3
4
5
6
7
8
!!null
!!''
!!1

A: false true false
B: false false true
C: false true true
D: true true false
答案 B

42 setInterval

setInterval
方法的返回值是什么?

1
2
3
4
5
6
setInterval(() => console.log("Hi"), 1000);

A: 一个唯一的id;
B: 该方法指定的毫秒数;
C: 传递的函数;
D: undefined;
答案 A

43 拓展运算符

输出是什么?

1
2
3
4
5
6
[..."Lydia"];

A: ["L", "y", "d", "i", "a"];
B: ["Lydia"];
C: [[], "Lydia"];
D: [["L", "y", "d", "i", "a"]];
答案 A string是可迭代的

44 generator

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function* generator(i) {
yield i;
yield i * 2;
}

const gen = generator(10);

console.log(gen.next().value);
console.log(gen.next().value);



A: [0, 10], [10, 20]
B: 20, 20
C: 10, 20
D: 0, 10 and 10, 20
答案 C generator会停下,直到调用下一个next

45 Promise.race

返回值是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
const firstPromise = new Promise((res, rej) => {
setTimeout(res, 500, "one");
});

const secondPromise = new Promise((res, rej) => {
setTimeout(res, 100, "two");
});

Promise.race([firstPromise, secondPromise]).then(res => console.log(res));



A: "one"
B: "two"
C: "two" "one"
D: "one" "two"
答案 race中有一个状态优先改变就输出改变的那一个 这里是two 因为他只用100ms 另外any 是其中一个变成fulfilled就返回成功,全部都失败才返回失败 all是全部成功才返回成功,一个失败就返回失败,相当于any的相反 allSettled会等全部执行完,不会因为失败终止

46 引用交互

输出是什么?

1
2
3
4
5
6
7
8
9
10
let person = { name: "Lydia" };
const members = [person];
person = null;

console.log(members);

A: null;
B: [null];
C: [{}];
D: [{ name: "Lydia" }];
答案 D members的第一个元素拷贝了person,但并不是保持着引用,所以最后即使person变了它还是不会变 注意只有对象和对象之间才有引用交互

47 forin

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
const person = {
name: "Lydia",
age: 21
};

for (const item in person) {
console.log(item);
}

A: { name: "Lydia" }, { age: 21 }
B: "name", "age"
C: "Lydia", 21
D: ["name", "Lydia"], ["age", 21]
答案 B

48 运算

输出是什么?

1
2
3
4
5
6
console.log(3 + 4 + "5");

A: "345";
B: "75";
C: 12;
D: "12";
答案 B

49 parseInt

num 是什么?

1
2
3
4
5
6
const num = parseInt("7*6", 10);

A: 42;
B: "42";
C: 7;
D: NaN;
答案 parseInt两个参数,一个是解析的参数,另外一个是进制。这里设置了十进制。然后解析7*6由于*不合法,直接解析出7

50 map

输出是什么?

1
2
3
4
5
6
7
8
9
[1, 2, 3].map(num => {
if (typeof num === "number") return;
return num * 2;
});

A: []
B: [null, null, null]
C: [undefined, undefined, undefined]
D: [ 3 x empty ]
答案 map创建新的值返回给数组,由于数组全是数字所以第一个if永远成立,所以返回undefined

51 值与引用

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function getInfo(member, year) {
member.name = "Lydia";
year = "1998";
}

const person = { name: "Sarah" };
const birthYear = "1997";

getInfo(person, birthYear);

console.log(person, birthYear);



A: { name: "Lydia" }, "1997"
B: { name: "Sarah" }, "1998"
C: { name: "Lydia" }, "1998"
D: { name: "Sarah" }, "1997"
答案 A 对象传递是引用传递,普通参数都是值传递。值传递是一份拷贝 birthYear是一个值,所以函数内部的形参怎么变都不会影响到外部的birthYear person是一个对象,传递了引用关系,函数内部改变了它的引用,所以person也变化了

52 throw

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function greeting() {
throw "Hello world!";
}

function sayHi() {
try {
const data = greeting();
console.log("It worked!", data);
} catch (e) {
console.log("Oh no an error!", e);
}
}

sayHi();

A: "It worked! Hello world!"
B: "Oh no an error: undefined
C: SyntaxError: can only throw Error objects
D: "Oh no an error: Hello world!
答案 D throw可以自定义错误,异常可以是一个字符串,一个数字,一个布尔类型,或者是一个对象。本例子中是`Hello world`

53 构造函数中的返回值

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
function Car() {
this.make = "Lamborghini";
return { make: "Maserati" };
}

const myCar = new Car();
console.log(myCar.make);

A: "Lamborghini";
B: "Maserati";
C: ReferenceError;
D: TypeError;
答案 B

54 表达式执行顺序

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
(() => {
let x = (y = 10);
})();

console.log(typeof x);
console.log(typeof y);

A: "undefined", "number";
B: "number", "number";
C: "object", "number";
D: "number", "undefined";
答案 A

55 删除原型上的方法

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
class Dog {
constructor(name) {
this.name = name;
}
}

Dog.prototype.bark = function () {
console.log(`Woof I am ${this.name}`);
};

const pet = new Dog("Mara");

pet.bark();

delete Dog.prototype.bark;

pet.bark();

A: "Woof I am Mara", TypeError;
B: "Woof I am Mara", "Woof I am Mara";
C: "Woof I am Mara", undefined;
D: TypeError, TypeError;
答案 A 当调用一个不存在的函数会抛出TypeError异常

56 set返回值

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
const set = new Set([1, 1, 2, 3, 4]);

console.log(set);

A: [1, 1, 2, 3, 4];
B: [1, 2, 3, 4];
C: {
1, 1, 2, 3, 4;
}
D: {
1, 2, 3, 4;
}
答案 D 返回Set(4) { 1, 2, 3, 4 }

57 读取模块

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// counter.js
let counter = 10;
export default counter;

// index.js
import myCounter from "./counter";

myCounter += 1;

console.log(myCounter);

A: 10;
B: 11;
C: Error;
D: NaN;
答案 C 引入的模块是只读的。只有导出它们的模块才能修改其值

58 delete

输出是什么?

1
2
3
4
5
6
7
8
9
10
const name = "Lydia";
age = 21;

console.log(delete name);
console.log(delete age);

A: false, true;
B: "Lydia", 21;
C: true, true;
D: undefined, undefined;
答案 A delete返回一个布尔值,true成功fals而失败,只能删除对象的值,所以第一个抛出false,第二个值挂载到了window上, 所以是true

59 解构赋值

输出是什么?

1
2
3
4
5
6
7
8
9
const numbers = [1, 2, 3, 4, 5];
const [y] = numbers;

console.log(y);

A: [[1, 2, 3, 4, 5]];
B: [1, 2, 3, 4, 5];
C: 1;
D: [1];
答案 C 数组的解构赋值按顺序赋值 所以是1

60 拓展运算符组合对象

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
const user = { name: "Lydia", age: 21 };
const admin = { admin: true, ...user };

console.log(admin);



A: { admin: true, user: { name: "Lydia", age: 21 } }
B: { admin: true, name: "Lydia", age: 21 }
C: { admin: true, user: ["Lydia", 21] }
D: { admin: true }
答案 B

61 Object.defineProperty

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
const person = { name: "Lydia" };

Object.defineProperty(person, "age", { value: 21 });

console.log(person);
console.log(Object.keys(person));



A: { name: "Lydia", age: 21 }, ["name", "age"]
B: { name: "Lydia", age: 21 }, ["name"]
C: { name: "Lydia"}, ["name", "age"]
D: { name: "Lydia"}, ["age"]
答案 B `Object.defineProperty`给对象添加了一个属性,但是默认不可枚举不可修改。所以不会通过`Object.keys`显示出来

62 JSON.stringfy

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
const settings = {
username: "lydiahallie",
level: 19,
health: 90
};

const data = JSON.stringify(settings, ["level", "health"]);
console.log(data);

A: "{"level":19, "health":90}"
B: "{"username": "lydiahallie"}"
C: "["level", "health"]"
D: "{"username": "lydiahallie", "level":19, "health":90}"
答案 A `JSON.stringfy`的第二个参数是replacer 它可以是一个数组也可以是一个函数 如果是一个数组,那么 只取到数组中的属性 如果是一个函数,那么会遍历全部的值,函数的返回值会成为这个属性的值

63 ++操作

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
let num = 10;

const increaseNumber = () => num++;
const increasePassedNumber = (number) => number++;

const num1 = increaseNumber();
const num2 = increasePassedNumber(num1);

console.log(num1);
console.log(num2);

A: 10, 10;
B: 10, 11;
C: 11, 11;
D: 11, 12;
答案 A

64 对象默认值与传递

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const value = { number: 10 };

const multiply = (x = { ...value }) => {
console.log((x.number *= 2));
};

multiply();
multiply();
multiply(value);
multiply(value);

A: 20, 40, 80, 160;
B: 20, 40, 20, 40;
C: 20, 20, 20, 40;
D: NaN, NaN, 20, 40;
答案 C 前面两次是形参默认值且解构,所以每次都是一样的`{number:10}` 因此都是20 后面两次传递的是value 因为对象传递是引用 所以第一次20 第二次在第一次的基础上改 变40

65 reduce

输出是什么?

1
2
3
4
5
6
7
8
[1, 2, 3, 4].reduce((x, y) => console.log(x, y));



A: 1 2 and 3 3 and 6 4
B: 1 2 and 2 3 and 3 4
C: 1 undefined and 2 undefined and 3 undefined and 4 undefined
D: 1 2 and undefined 3 and undefined 4
答案 reduce有四个参数 * acc 累加器 * cur 当前值 * idx 当前索引 * src 源数组 此时1是累加器 2是当前值 此时打印是console 所以默认返回undefined 下一次累加器则是undefined 所以 第二次 undefined 3 第三次 undefined 4 结束

66 继承

使用哪个构造函数可以成功继承 Dog 类?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
class Dog {
constructor(name) {
this.name = name;
}
};

class Labrador extends Dog {
// 1
constructor(name, size) {
this.size = size;
}
// 2
constructor(name, size) {
super(name);
this.size = size;
}
// 3
constructor(size) {
super(name);
this.size = size;
}
// 4
constructor(name, size) {
this.name = name;
this.size = size;
}

};



A: 1
B: 2
C: 3
D: 4
答案 B super在使用之前不能访问this关键字 否则抛出ReferenceError错误。 使用super 需要构造函数传递相应的参数给super。这里传递name

67 import

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// index.js
console.log('running index.js');
import { sum } from './sum.js';
console.log(sum(1, 2));

// sum.js
console.log('running sum.js');
export const sum = (a, b) => a + b;



A: running index.js, running sum.js, 3
B: running sum.js, running index.js, 3
C: running sum.js, 3, running index.js
D: running index.js, undefined, running sum.js
答案 B import会在编译的阶段执行,意味着被导入的模块会先运行,导入模块的文件会后运行。 和 require不同 require是在运行时执行的 所以它可以根据需要加载依赖

68 Symbol

输出是什么?

1
2
3
4
5
6
7
8
console.log(Number(2) === Number(2));
console.log(Boolean(false) === Boolean(false));
console.log(Symbol("foo") === Symbol("foo"));

A: true, true, false;
B: false, true, false;
C: true, false, true;
D: true, true, true;
答案 A

69 padStart

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
const name = "Lydia Hallie";
console.log(name.padStart(13));
console.log(name.padStart(2));

A: "Lydia Hallie", "Lydia Hallie";
B: " Lydia Hallie",
" Lydia Hallie"(
"[13x whitespace]Lydia Hallie",
"[2x whitespace]Lydia Hallie"
);
C: " Lydia Hallie",
"Lydia Hallie"("[1x whitespace]Lydia Hallie", "Lydia Hallie");
D: "Lydia Hallie", "Lyd";
答案 C padStart api给字符串的前面添加空格,这个字符串的长度是12 现在输入13则添加一个空格 如果输入的小于它的长度则不添加

70 emoji

输出是什么?

1
2
3
4
5
6
7
8
console.log("🥑" + "💻");



A: "🥑💻"
B: 257548
C: A string containing their code points
D: Error
答案 A

71 generator

如何能打印出
console.log
语句后注释掉的值?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function* startGame() {
const answer = yield "Do you love JavaScript?";
if (answer !== "Yes") {
return "Oh wow... Guess we're gone here";
}
return "JavaScript loves you back ❤️";
}

const game = startGame();
console.log(/* 1 */); // Do you love JavaScript?
console.log(/* 2 */); // JavaScript loves you back ❤️



A: game.next("Yes").value and game.next().value
B: game.next.value("Yes") and game.next.value()
C: game.next().value and game.next("Yes").value
D: game.next.value() and game.next.value("Yes")
答案 C

72 String.raw

输出是什么?

1
2
3
4
5
6
7
8
console.log(String.raw`Hello\nworld`);

A: Hello world!
B: Hello
world
C: Hello\nworld
D: Hello\n
world
答案 `String.raw`函数用来获取模板字符串的原始字符串,它返回一个字符串忽略了转义符,不过反斜杠可能有问题
1
2
3
const path = `C:\Documents\Projects\table.html`
String.raw`${path}`

这将导致: `"C:DocumentsProjects able.html"` 直接使用`String.raw`
1
String.raw`C:\Documents\Projects\table.html`
它会忽略转义字符并打印:`C:\Documents\Projects\table.html`

73 Promise

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
async function getData() {
return await Promise.resolve("I made it!");
}

const data = getData();
console.log(data);



A: "I made it!"
B: Promise {<resolved>: "I made it!"}
C: Promise {<pending>}
D: undefined
答案 C 异步函数始终返回一个promise 要想获取值 使用`data.then((res)=>console.log(res))`

74 push

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
function addToList(item, list) {
return list.push(item);
}

const result = addToList("apple", ["banana"]);
console.log(result);

A: ["apple", "banana"];
B: 2;
C: true;
D: undefined;
答案 B push方法返回新数组的长度

75 Object.freeze

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
const box = { x: 10, y: 20 };

Object.freeze(box);

const shape = box;
shape.x = 100;
console.log(shape)

A: { x: 100, y: 20 }
B: { x: 10, y: 20 }
C: { x: 100 }
D: ReferenceError
答案 B 声明一个冻结对象,shape赋值的时候,也指向的是那个冻结对象,所以也是没办法改变值的 `Object.isFrozen`判断一个对象是否冻结

76 变量重命名

输出是什么?

1
2
3
4
5
6
7
8
const { name: myName } = { name: "Lydia" };

console.log(name);

A: "Lydia";
B: "myName";
C: undefined;
D: ReferenceError;
答案 D 此时已经重命名为myName了,也就是原先的变量不存在了

77 纯函数

以下是个纯函数么?

1
2
3
4
5
6
function sum(a, b) {
return a + b;
}

A: Yes;
B: No;
答案 A 没有副作用

78 记忆函数

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
const add = () => {
const cache = {};
return num => {
if (num in cache) {
return `From cache! ${cache[num]}`;
} else {
const result = num + 10;
cache[num] = result;
return `Calculated! ${result}`;
}
};
};

const addFunction = add();
console.log(addFunction(10));
console.log(addFunction(10));
console.log(addFunction(5 * 2));

A: Calculated! 20 Calculated! 20 Calculated! 20
B: Calculated! 20 From cache! 20 Calculated! 20
C: Calculated! 20 From cache! 20 From cache! 20
D: Calculated! 20 From cache! 20 Error
答案 C 记忆化缓存

79 forin

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
const myLifeSummedUp = ["☕", "💻", "🍷", "🍫"]

for (let item in myLifeSummedUp) {
console.log(item)
}

for (let item of myLifeSummedUp) {
console.log(item)
}



A: 0 1 2 3 and "☕" "💻" "🍷" "🍫"
B: "☕" "💻" "🍷" "🍫" and "☕" "💻" "🍷" "🍫"
C: "☕" "💻" "🍷" "🍫" and 0 1 2 3
D: 0 1 2 3 and {0: "☕", 1: "💻", 2: "🍷", 3: "🍫"}
答案 A forin我们可以遍历一个对象自有的、继承的、可枚举的、非Symbol的属性 遍历数组取到的是数组的键也就是索引

80 数组元素

输出是什么?

1
2
3
4
5
6
7
const list = [1 + 2, 1 * 2, 1 / 2];
console.log(list);

A: ["1 + 2", "1 * 2", "1 / 2"];
B: ["12", 2, 0.5];
C: [3, 2, 0.5];
D: [1, 1, 1];
答案 C 数组里面可以放表达式 但是最后返回的结果是解析吼的结果

81 不传形参

输出是什么?

1
2
3
4
5
6
7
8
9
10
function sayHi(name) {
return `Hi there, ${name}`
}

console.log(sayHi())

A: Hi there,
B: Hi there, undefined
C: Hi there, null
D: ReferenceError
答案 B

82 this

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
var status = "😎"

setTimeout(() => {
const status = "😍"

const data = {
status: "🥑",
getStatus() {
return this.status
}
}

console.log(data.getStatus())
console.log(data.getStatus.call(this))
}, 0)



A: "🥑" and "😍"
B: "🥑" and "😎"
C: "😍" and "😎"
D: "😎" and "😎"
答案 B 第一个this来自于调用者data 第二个的this来自于window

83 修改不存在的对象属性

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
const person = {
name: "Lydia",
age: 21
}

let city = person.city
city = "Amsterdam"

console.log(person)

A: { name: "Lydia", age: 21 }
B: { name: "Lydia", age: 21, city: "Amsterdam" }
C: { name: "Lydia", age: 21, city: undefined }
D: "Amsterdam"
答案 A 一开始是person上面没有city 此时赋值给的是undefined,后面修改city 因为先前给的不是person的引用,只是对象中的属性,所以person不变

84 块级作用域外使用声明的const/let变量

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function checkAge(age) {
if (age < 18) {
const message = "Sorry, you're too young.";
} else {
const message = "Yay! You're old enough!";
}

return message;
}

console.log(checkAge(21));

A: "Sorry, you're too young.";
B: "Yay! You're old enough!";
C: ReferenceError;
D: undefined;
答案 C 在块级作用域外面使用const或者let声明的变量抛出异常ReferenceError

85 promise链式调用

输出是什么?

1
2
3
4
5
6
7
8
9
10
fetch('https://www.website.com/api/user/1')
.then(res => res.json())
.then(res => console.log(res))



A: fetch方法的结果
B: 第二次调用fetch方法的结果
C: 前一个.then()中回调方法返回的结果
D: 总是undefined
答案 C

86 !!

哪个选项是将hasName设置为true的方法,前提是不能将true作为参数传递?

1
2
3
4
5
6
7
8
function getName(name) {
const hasName = //
}

A: !!name
B: name
C: new Boolean(name)
D: name.length
答案 A

87 数组可迭代

输出是什么?

1
2
3
4
5
6
console.log("I want pizza"[0])

A: """
B: "I"
C: SyntaxError
D: undefined

答案 B

88 默认参数

输出是什么?

1
2
3
4
5
6
7
8
9
10
function sum(num1, num2 = num1) {
console.log(num1 + num2);
}

sum(10);

A: NaN;
B: 20;
C: ReferenceError;
D: undefined;
答案 B 交换则不行

89 import * as xxx from xxx

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// module.js
export default () => "Hello world"
export const name = "Lydia"

// index.js
import * as data from "./module"

console.log(data)



A: { default: function default(), name: "Lydia" }
B: { default: function default() }
C: { default: "Hello world", name: "Lydia" }
D: Global object of module.js
答案 A 使用`import *`得到默认导出和具名导出,其中默认导出是一个函数

90 类和构造函数

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
class Person {
constructor(name) {
this.name = name;
}
}

const member = new Person("John");
console.log(typeof member);

A: "class";
B: "function";
C: "object";
D: "string";
答案 C 实例就是一个对象

91 push

输出是什么?

1
2
3
4
5
6
7
8
let newList = [1, 2, 3].push(4);

console.log(newList.push(5));

A: [1, 2, 3, 4, 5];
B: [1, 2, 3, 5];
C: [1, 2, 3, 4];
D: Error;
答案 D push返回数组长度 此时newList是4 不能对string使用push

92 箭头函数和原型对象

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function giveLydiaPizza() {
return "Here is pizza!"
}

const giveLydiaChocolate = () => "Here's chocolate... now go hit the gym already."

console.log(giveLydiaPizza.prototype)
console.log(giveLydiaChocolate.prototype)



A: { constructor: ...} { constructor: ...}
B: {} { constructor: ...}
C: { constructor: ...} {}
D: { constructor: ...} undefined
答案 D 箭头函数没有原型对象

93 Object.entries

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const person = {
name: "Lydia",
age: 21
}

for (const [x, y] of Object.entries(person)) {
console.log(x, y)
}



A: name Lydia and age 21
B: ["name", "Lydia"] and ["age", 21]
C: ["name", "age"] and undefined
D: Error
答案 A `Object.entries`返回一个键值对构成的数组 如:`[['name','Lydia'],['age',21]]`

94 剩余参数的位置

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
function getItems(fruitList, ...args, favoriteFruit) {
return [...fruitList, ...args, favoriteFruit]
}

getItems(["banana", "apple"], "pear", "orange")



A: ["banana", "apple", "pear", "orange"]
B: [["banana", "apple"], "pear", "orange"]
C: ["banana", "apple", ["pear"], "orange"]
D: SyntaxError
答案 D `...args`只能放在参数的最后面,否则抛出语法错误`SyntaxError`

95 return后新行

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function nums(a, b) {
if
(a > b)
console.log('a is bigger')
else
console.log('b is bigger')
return
a + b
}

console.log(nums(4, 2))
console.log(nums(1, 2))



A: a is bigger, 6 and b is bigger, 3
B: a is bigger, undefined and b is bigger, undefined
C: undefined and undefined
D: SyntaxError
答案 B 此时的return js无法判断它下一个值是否是需要的值,自动加了分号,所以结束了

96 类

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
class Person {
constructor() {
this.name = "Lydia"
}
}

Person = class AnotherPerson {
constructor() {
this.name = "Sarah"
}
}

const member = new Person()
console.log(member.name)



A: "Lydia"
B: "Sarah"
C: Error: cannot redeclare Person
D: SyntaxError
答案 B 我们可以将类设置为等于其他类/函数构造函数。 在这种情况下,我们将Person设置为AnotherPerson。 这个构造函数的名字是Sarah,所以新的Person实例member上的name属性是Sarah。

97 Symbol

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
const info = {
[Symbol('a')]: 'b'
}

console.log(info)
console.log(Object.keys(info))



A: {Symbol('a'): 'b'} and ["{Symbol('a')"]
B: {} and []
C: { a: "b" } and ["a"]
D: {Symbol('a'): 'b'} and []
答案 D symbol类型不可枚举,所以`Object.keys`的时候没有返回

98 剩余参数和箭头函数返回对象

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const getList = ([x, ...y]) => [x, y]
const getUser = user => ({ name: user.name, age: user.age })

const list = [1, 2, 3, 4]
const user = { name: "Lydia", age: 21 }

console.log(getList(list))
console.log(getUser(user))



A: [1, [2, 3, 4]] and undefined
B: [1, [2, 3, 4]] and { name: "Lydia", age: 21 }
C: [1, 2, 3, 4] and { name: "Lydia", age: 21 }
D: Error and { name: "Lydia", age: 21 }
答案 B `...y` 此时y是一个数组包含剩余参数, 对于箭头函数 如果要返回一个对象,需要使用圆括号包裹

99 抛出错误

输出是什么?

1
2
3
4
5
6
7
8
const name = "Lydia";

console.log(name());

A: SyntaxError;
B: ReferenceError;
C: TypeError;
D: undefined;
答案 C 当值不是预期类型时,会抛出TypeErrors。 JavaScript期望name是一个函数,因为我们试图调用它。 但它是一个字符串,因此抛出TypeError:name is not a function 当你编写了一些非有效的JavaScript时,会抛出语法错误,例如当你把return这个词写成retrun时。 当JavaScript无法找到您尝试访问的值的引用时,抛出ReferenceErrors。

100 &&

输出是什么?

1
2
3
4
5
6
7
8
9
10
11
// 🎉✨ This is my 100th question! ✨🎉

const output = `${[] && 'Im'}possible!
You should${'' && `n't`} see a therapist after so much JavaScript lol`



A: possible! You should see a therapist after so much JavaScript lol
B: Impossible! You should see a therapist after so much JavaScript lol
C: possible! You shouldn't see a therapist after so much JavaScript lol
D: Impossible! You shouldn't see a therapist after so much JavaScript lol
答案 B `[]`是一个真值 在`&&`中会返回后面那个值 `''`是一个假值 直接不返回了

101 判断真假

输出是什么

1
2
3
4
5
6
7
8
9
10
const one = (false || {} || null)
const two = (null || false || "")
const three = ([] || 0 || true)

console.log(one, two, three)

A: false null []
B: null "" true
C: {} "" []
D: null null true
答案 C