程式學習: js面試考題

https://juejin.im/post/5d0644976fb9a07ed064b0ca

new 建構子的部分全忘了！

沒了解過undefined, referenceError, typeerror出現的時機及其對應的原因

4. 下面代码的输出是什么?

+true;
!"Lydia";

A: 1 and false
B: false and NaN
C: false and false

答案

答案: A
一元加号会尝试将boolean类型转换为数字类型。 true被转换为1，false被转换为0。
字符串'Lydia'是一个真值。我们实际上要问的是“这个真值是假的吗？”。这会返回false。

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
在JavaScript中，当设置它们彼此相等时，所有对象都通过引用进行交互。
首先，变量c为对象保存一个值。之后，我们将d指定为c与对象相同的引用。

更改一个对象时，可以更改所有对象。

第六題其實是by value和by reference那個~

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（）是一个内置的函数构造函数。虽然它看起来像一个数字，但它并不是一个真正的数字：它有一堆额外的功能，是一个对象。
当我们使用==运算符时，它只检查它是否具有相同的值。他们都有3的值，所以它返回true。

译者注：==会引发隐式类型转换，右侧的对象类型会自动拆箱为Number类型。

然而，当我们使用===操作符时，类型和值都需要相等，new Number()不是一个数字，是一个对象类型。两者都返回 false。

8. 下面代码的输出是什么?

class Chameleon {
  static colorChange(newColor) {
    this.newColor = newColor;
  }

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

const freddie = new Chameleon({ newColor: "purple" });
freddie.colorChange("orange");

A: orange
B: purple
C: green
D: TypeError

答案

答案: D
colorChange方法是静态的。静态方法仅在创建它们的构造函数中存在，并且不能传递给任何子级。由于freddie是一个子级对象，函数不会传递，所以在freddie实例上不存在freddie方法：抛出TypeError。

9. 下面代码的输出是什么?

let greeting;
greetign = {}; // Typo!
console.log(greetign);

A: {}
B: ReferenceError: greetign is not defined
C: undefined

答案

答案: A
控制台会输出空对象，因为我们刚刚在全局对象上创建了一个空对象！当我们错误地将greeting输入为greetign时，JS解释器实际上在浏览器中将其视为global.greetign = {}（或window.greetign = {}）。
为了避免这种情况，我们可以使用“use strict”。这可以确保在将变量赋值之前必须声明变量。

10. 当我们这样做时会发生什么?

function bark() {
  console.log("Woof!");
}

bark.animal = "dog";

A: Nothing, this is totally fine!
B: SyntaxError. You cannot add properties to a function this way.
C: undefined
D: ReferenceError

答案

答案: A
这在JavaScript中是可能的，因为函数也是对象！（原始类型之外的所有东西都是对象）
函数是一种特殊类型的对象。您自己编写的代码并不是实际的函数。该函数是具有属性的对象，此属性是可调用的。

11. 下面代码的输出是什么?

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

const member = new Person("Lydia", "Hallie");
Person.getFullName = () => this.firstName + this.lastName;

console.log(member.getFullName());

A: TypeError
B: SyntaxError
C: Lydia Hallie
D: undefined undefined

答案

答案: A
您不能像使用常规对象那样向构造函数添加属性。如果要一次向所有对象添加功能，则必须使用原型。所以在这种情况下应该这样写：

Person.prototype.getFullName = function () {
  return `${this.firstName} ${this.lastName}`;
}

这样会使member.getFullName()是可用的，为什么样做是对的？假设我们将此方法添加到构造函数本身。也许不是每个Person实例都需要这种方法。这会浪费大量内存空间，因为它们仍然具有该属性，这占用了每个实例的内存空间。相反，如果我们只将它添加到原型中，我们只需将它放在内存中的一个位置，但它们都可以访问它！

12. 下面代码的输出是什么?

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

答案

答案: A
对于sarah，我们没有使用new关键字。使用new时，它指的是我们创建的新空对象。但是，如果你不添加new它指的是全局对象！
我们指定了this.firstName等于'Sarah和this.lastName等于Smith。我们实际做的是定义global.firstName ='Sarah'和global.lastName ='Smith。 sarah本身的返回值是undefined。

12. 事件传播的三个阶段是什么？?

A: 目标 > 捕获 > 冒泡
B: 冒泡 > 目标 > 捕获
C: 目标 > 冒泡 > 捕获
D: 捕获 > 目标 > 冒泡

答案

答案: D
在捕获阶段，事件通过父元素向下传递到目标元素。然后它到达目标元素，冒泡开始。

13. 所有对象都有原型.

A: 对
B: 错误

答案

答案: B
除基础对象外，所有对象都有原型。基础对象可以访问某些方法和属性，例如.toString。这就是您可以使用内置JavaScript方法的原因！所有这些方法都可以在原型上找到。虽然JavaScript无法直接在您的对象上找到它，但它会沿着原型链向下寻找并在那里找到它，这使您可以访问它。
译者注：基础对象指原型链终点的对象。基础对象的原型是null。

15. 下面代码的输出是什么?

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
后缀一元运算符++：

返回值（返回0）
增加值（数字现在是1）

前缀一元运算符++：

增加值（数字现在是2）
返回值（返回2）

所以返回0 2 2。

16. 下面代码的输出是什么?

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
如果使用标记的模板字符串，则第一个参数的值始终是字符串值的数组。其余参数获取传递到模板字符串中的表达式的值！

17. 下面代码的输出是什么?

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
在比较相等性，原始类型通过它们的值进行比较，而对象通过它们的引用进行比较。JavaScript检查对象是否具有对内存中相同位置的引用。
我们作为参数传递的对象和我们用于检查相等性的对象在内存中位于不同位置，所以它们的引用是不同的。
这就是为什么{ age: 18 } === { age: 18 }和 { age: 18 } == { age: 18 } 返回 false的原因。

20. 下面代码的输出是什么?

function getAge() {
  "use strict";
  age = 21;
  console.log(age);
}

getAge();

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

答案

答案: C
使用“use strict”，可以确保不会意外地声明全局变量。我们从未声明变量age，因为我们使用``use strict'，它会引发一个ReferenceError。如果我们不使用“use strict”，它就会起作用，因为属性age`会被添加到全局对象中。

21. 下面代码的输出是什么?

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

A: 105
B: "105"
C: TypeError
D: "10*10+5"

答案

答案: A
eval会为字符串传递的代码求值。如果它是一个表达式，就像在这种情况下一样，它会计算表达式。表达式为10 * 10 + 5计算得到105。

22. cool_secret可以访问多长时间?

sessionStorage.setItem("cool_secret", 123);

A：永远，数据不会丢失。
B：用户关闭选项卡时。
C：当用户关闭整个浏览器时，不仅是选项卡。
D：用户关闭计算机时。

答案

答案: B
关闭选项卡后，将删除存储在sessionStorage中的数据。
如果使用localStorage，数据将永远存在，除非例如调用localStorage.clear()。

25. 下面代码的输出是什么?

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
如果对象有两个具有相同名称的键，则将替前面的键。它仍将处于第一个位置，但具有最后指定的值。

29. 下面代码的输出是什么?

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的键，其值为123。
但是，当对象自动转换为字符串化时，它变成了[Object object]。所以我们在这里说的是a["Object object"] = 123。然后，我们可以尝试再次做同样的事情。 c对象同样会发生隐式类型转换。那么，a["Object object"] = 456。
然后，我们打印a[b]，它实际上是a["Object object"]。我们将其设置为456，因此返回456。

30. 下面代码的输出是什么?

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
我们有一个setTimeout函数并首先调用它。然而却最后打印了它。
这是因为在浏览器中，我们不只有运行时引擎，我们还有一个叫做WebAPI的东西。WebAPI为我们提供了setTimeout函数，例如DOM。
将callback推送到WebAPI后，setTimeout函数本身（但不是回调！）从堆栈中弹出。

33. 下面代码的输出是什么?

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

答案

答案: D
使用两者，我们可以传递我们想要this关键字引用的对象。但是，.call方法会立即执行！
.bind方法会返回函数的拷贝值，但带有绑定的上下文！它不会立即执行。

34. 下面代码的输出是什么?

function sayHi() {
  return (() => 0)();
}

typeof sayHi();
复制代码

A: "object"
B: "number"
C: "function"
D: "undefined"

答案

答案: B
sayHi函数返回立即调用的函数（IIFE, Immediately Invoked Functions Expressions, 立刻處發函式）的返回值。该函数返回0，类型为数字。
仅供参考：只有7种内置类型：null，undefined，boolean，number，string，object和symbol。 function不是一个类型，因为函数是对象，它的类型是object。
相關閱讀 https://ithelp.ithome.com.tw/articles/10193313

35. 下面这些值哪些是假值?

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: 所有都是假值

答案

答案: A
JavaScript中只有6个假值：

undefined
null
NaN
0
'' (empty string)
false

函数构造函数，如new Number和new Boolean都是真值。

37. 下面代码的输出是什么?

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
当你为数组中的元素设置一个超过数组长度的值时，JavaScript会创建一个名为“空插槽”的东西。这些位置的值实际上是undefined，但你会看到类似的东西：
[1, 2, 3, 7 x empty, 11]
这取决于你运行它的位置（每个浏览器有可能不同）。

38. 下面代码的输出是什么?

(() => {
  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

答案

答案: A
catch块接收参数x。当我们传递参数时，这与变量的x不同。这个变量x是属于catch作用域的。
之后，我们将这个块级作用域的变量设置为1，并设置变量y的值。现在，我们打印块级作用域的变量x，它等于1。
在catch块之外，x仍然是undefined，而y是2。当我们想在catch块之外的console.log(x)时，它返回undefined，而y返回2。

程式學習

文章加密

2019年6月17日星期一

js面試考題

4. 下面代码的输出是什么?

6. 下面代码的输出是什么?

第六題其實是by value和by reference那個~

7. 下面代码的输出是什么?

8. 下面代码的输出是什么?

9. 下面代码的输出是什么?

10. 当我们这样做时会发生什么?

11. 下面代码的输出是什么?

12. 下面代码的输出是什么?

12. 事件传播的三个阶段是什么？?

13. 所有对象都有原型.

15. 下面代码的输出是什么?

16. 下面代码的输出是什么?

17. 下面代码的输出是什么?

20. 下面代码的输出是什么?

21. 下面代码的输出是什么?

22. cool_secret可以访问多长时间?

25. 下面代码的输出是什么?

29. 下面代码的输出是什么?

30. 下面代码的输出是什么?

33. 下面代码的输出是什么?

34. 下面代码的输出是什么?

35. 下面这些值哪些是假值?

37. 下面代码的输出是什么?

38. 下面代码的输出是什么?

沒有留言:

張貼留言

文章加密

2019年6月17日 星期一

js面試考題

4. 下面代码的输出是什么?

6. 下面代码的输出是什么?

第六題其實是by value和by reference那個~

7. 下面代码的输出是什么?

8. 下面代码的输出是什么?

9. 下面代码的输出是什么?

10. 当我们这样做时会发生什么?

11. 下面代码的输出是什么?

12. 下面代码的输出是什么?

12. 事件传播的三个阶段是什么？?

13. 所有对象都有原型.

15. 下面代码的输出是什么?

16. 下面代码的输出是什么?

17. 下面代码的输出是什么?

20. 下面代码的输出是什么?

21. 下面代码的输出是什么?

22. cool_secret可以访问多长时间?

25. 下面代码的输出是什么?

29. 下面代码的输出是什么?

30. 下面代码的输出是什么?

33. 下面代码的输出是什么?

34. 下面代码的输出是什么?

35. 下面这些值哪些是假值?

37. 下面代码的输出是什么?

38. 下面代码的输出是什么?

沒有留言:

張貼留言

2019年6月17日星期一