每日20道面试题带解析03

转载

wx6332e0803afcf 2022-11-08 16:38:12

文章标签 字符串数组静态方法 文章分类 虚拟化云计算

每日20道面试题带解析03_数组

以下题目，本人验证无误，查阅了相关资料，得出解析部分并做了相关总结，希望对正准备跳槽或找工作的你有帮助！

1、事件传播的三个阶段是什么？

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

A: Target > Capturing > Bubbling
B: Bubbling > Target > Capturing
C: Target > Bubbling > Capturing
D: Capturing > Target > Bubbling

答案及解析

答案 : D 
解析 : 在捕获（capturing）阶段中，事件从祖先元素向下传播到目标元素。当事件达到目标（target）元素后，冒泡（bubbling）才开始。

2、写出执行结果，并解释原因

+true;
!"Lydia";

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

答案及解析

答案 : A
解析 : 一元操作符加号尝试将 boolean 转为 number。true 转换为 number 为 1，false 为 0。
  字符串 'Lydia' 是一个真值，真值取反那么就返回 false。

3、写出执行结果，并解释原因

const bird = {
  size: 'small'
}


const mouse = {
  name: 'Mickey',
  small: true
}

A: mouse.bird.size是无效的
B: mouse[bird.size]是无效的
C: mouse[bird["size"]]是无效的
D: 以上三个选项都是有效的

答案及解析

答案 : A
解析 : 
  1. 所有对象的 keys 都是字符串(在底层总会被转换为字符串)
  2. 使用括号语法时[]，首先看到第一个开始括号 [ 并继续前进直到找到结束括号 ]。
  3. mouse[bird.size]：首先计算 bird.size，得到 small, mouse["small"] 返回 true。
  //使用点语法
  4. mouse 没有 bird 属性，返回 undefined,也就变成了 undefined.size。是无效的，并且会抛出一个错误类似 Cannot read property "size" of undefined。

4、当我们这么做时，会发生什么？

function bark() {
  console.log('Woof!')
}


bark.animal = 'dog'

A: 正常运行!
B: SyntaxError. 你不能通过这种方式给函数增加属性。
C: undefined
D: ReferenceError

答案及解析

答案 : A
解析 : 在JS中是可以的，因为函数是一个特殊的对象（除了基本类型之外其他都是对象）
   函数是一个拥有属性的对象，并且属性也可被调用。
  bark.animal = function(){ console.log(1)}
  bark.animal () // 1

5、写出执行结果，并解释原因

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

答案及解析

答案 : D
解析 : colorChange 是一个静态方法。静态方法只能被创建它们的构造器使用（也就是 Chameleon），
     并且不能传递给实例。因为 freddie 是一个实例，静态方法不能被实例使用，因此抛出了 TypeError 错误。

6、写出执行结果，并解释原因

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
解析 : 不能像常规对象那样，给构造函数添加属性。应该使用原型。
    Person.prototype.getFullName = function () {
      return `${this.firstName} ${this.lastName}`;
  }
这样 member.getFullName() 才起作用。将公共属性和方法添加到原型中，它只存在于内存中的一个位置，所有实例都可以访问它，节省内存空间

7、写出执行结果，并解释原因

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 时，this 指向我们创建的空对象。未使用 new 时，this 指向的是全局对象。上述操作相当于 window.firstName = 'Sarah' 和 window.lastName = 'Smith'。而 sarah 本身是 undefined。

8、写出执行结果，并解释原因

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
解析 : 如果一个对象有两个同名的键，则键会被替换掉。但仍位于该键第一次出现的位置，但是值是最后出现那个值。

9、写出执行结果，并解释原因

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
解析 : 对象的键被自动转换为字符串。
  1. 将对象 b 设置为对象 a 的键，会变成 "[object Object]",相当于a["[object Object]"] = 123。
  2. 再次将对象 c 设置为对象 a 的键,相当于 a["[object Object]"] = 456。
  3. 此时打印 a[b]，也就是 a["[object Object]"]。刚设置为 456，因此返回  456。

10、写出执行结果，并解释原因

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


typeof sayHi()

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

答案及解析

答案 : B
解析 : sayHi 方法返回的是立即执行函数(IIFE)的返回值.此立即执行函数的返回值是 0， 类型是 number

11、写出执行结果，并解释原因

[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 ]

答案及解析

答案 : C
解析 : num表示当前元素. 都是number类型，因此typeof num === "number"结果都是true.map函数创建了新数组，并且将函数的返回值插入数组。
但并没有任何值返回。当函数没有返回任何值时，即默认返回undefined.对数组中的每一个元素来说，函数块都得到了这个返回值，所以结果中每一个元素都是undefined. 
扩展：
  1. [1, 2, 3].map(num => typeof num === "number" );  // [true, true, true]
  2. [1, 2, 3].map(num => typeof (num === "number")); // ["boolean", "boolean", "boolean"]

12、输出什么?

function getFine(speed, amount) {
  const formattedSpeed = new Intl.NumberFormat({
    'en-US',
    { style: 'unit', unit: 'mile-per-hour' }
  }).format(speed)


  const formattedAmount = new Intl.NumberFormat({
    'en-US',
    { style: 'currency', currency: 'USD' }
  }).format(amount)


  return `The driver drove ${formattedSpeed} and has to pay ${formattedAmount}`
}


console.log(getFine(130, 300))

A: The driver drove 130 and has to pay 300
B: The driver drove 130 mph and has to pay $300.00
C: The driver drove undefined and has to pay undefined
D: The driver drove 130.00 and has to pay 300.00

答案及解析

答案 : B
解析 : Intl.NumberFormat 方法，可以格式化任意区域的数字值。
      mile-per-hour 通过格式化结果为 mph; USD通过格式化结果为 $.

13、写出执行结果，并解释原因

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
解析 : delete关键字删除对象的属性，对原型也适用。删除原型的属性后，该属性在原型链上就不可用。
  执行 delete Dog.prototype.bark 后不可用,尝试调用一个不存在的函数时会抛出异常。
  TypeError: pet.bark is not a function，因为pet.bark是undefined.

14、写出执行结果，并解释原因

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对象是唯一值的集合：也就是说同一个值在其中仅出现一次。。所以结果是 {1, 2, 3, 4}. 
易错 : B, 常见的set用法可用于数组去重，因此大家可能会误以为返回的是唯一值的数组，其实不然，
  var set1 = [...new Set([1, 1, 2, 3, 4])];
  console.log(set1); // 此时返回的才是数组 [1, 2, 3, 4]

15、写出执行结果，并解释原因

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方法可以在字符串的起始位置填充。参数是字符串的总长度（包含填充）。
  字符串Lydia Hallie的长度为12, 因此name.padStart(13)在字符串的开头只会插入1个空格。
  如果传递给 padStart 方法的参数小于字符串的长度，则不会添加填充。

16、写出执行结果，并解释原因

const { name: myName } = { name: "Lydia" };


console.log(name);

A: "Lydia"
B: "myName"
C: undefined
D: ReferenceError

答案及解析

答案 : D
解析 : 对象解构：{name：myName}该语法为获取右侧对象中name属性值，并重命名为myName。
   而name是一个未定义的变量，直接打印会引发ReferenceError: name is not defined。

17、写出执行结果，并解释原因

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。

18、写出执行结果，并解释原因

let name = 'Lydia'
function getName() {
  console.log(name)
  let name = 'Sarah'
}
getName()

A: Lydia
B: Sarah
C: undefined
D: ReferenceError

答案及解析

答案 : D
解析 : let和const声明的变量，与var不同，它不会被初始化。在初始化之前无法访问。称为“暂时性死区”。
    JavaScript会抛出ReferenceError: Cannot access 'name' before initialization。

19、写出执行结果，并解释原因

console.log(`${(x => x)('I love')} to program`)

A: I love to program
B: undefined to program
C: ${(x => x)('I love') to program
D: TypeError

答案及解析

答案 : A
解析 : 带有模板字面量的表达式首先被执行。相当于字符串包含表达式，(x => x)('I love')是一个立即执行函数  
     向箭头函数 x => x 传递 'I love' 作为参数。x 等价于返回的 'I love'。结果就是 I love to program。

20、写出执行结果，并解释原因

const spookyItems = ["👻", "🎃", "🕸"];
({ item: spookyItems[3] } = { item: "💀" });
console.log(spookyItems);

A: ["👻", "🎃", "🕸"]
B: ["👻", "🎃", "🕸", "💀"]
C: ["👻", "🎃", "🕸", { item: "💀" }]
D: ["👻", "🎃", "🕸", "[object Object]"]

答案及解析

答案 : B
解析 : 解构对象，可以从右边对象中拆出值，并将拆出的值分配给左边对象同名的属性。此时将值 "💀" 分配给 spookyItems[3]。
    相当于正在篡改数组 spookyItems，给它添加了值 "💀"。当输出 spookyItems 时，结果为 ["👻", "🎃", "🕸", "💀"]。

每日20道面试题带解析03_静态方法_02