code学习

前端面试题每日3题——2022-09-06

每日3题

22 以下代码执行后,控制台中的输出内容为?

var a = [1, 2, 3];
a.join = a.shift;
console.log(a == 1 && a == 2 && a == 3);
           

23 以下代码执行后,控制台中的输出内容为?

var arr = [0, 1];
arr[5] = 5;
var newArr = arr.filter((x) => {
  return x === undefined;
});

console.log(newArr.length);
           

24 以下代码执行后,控制台中的输出内容为?

const value = 'value is' + !!Number(['0']) ? 'aaa' : 'bbb';
console.log(value);
           
公众号【今天也要写bug】获取更多前端面试题

答案与解析

22

// 答案:true
// 考察强制类型转换
// == 操作会进行强制类型转换
// 如果操作数之一是对象,另一个是数字或字符串,
// 会尝试使用对象的valueOf()和toString()方法将对象转换为原始值。
// 如果 valueOf 返回基本类型,就按该值进行转换,否则按 toString 的返回值转换
// 数组的 valueOf 返回它本身,所以按 toString 的返回值进行转换
// 对于数组对象,toString 方法在内部调用 join() 方法
var a = [1, 2, 3];
a.join = a.shift; // 在数组 a 上定义了一个 join 方法,并且该方法是 shift 的功能
console.log(a == 1 && a == 2 && a == 3);
// a == 1,触发类型转换
// 触发 a.toString() 内部调用 a.join(),即 a.shift() 返回 1,同时 a 变为 [2, 3]
// 所以 a == 1 为 true
// 同理 a == 2 和 a == 3 都为 true
           

23

// 答案:0
// 考察数组的 filter 方法
// filter() 方法创建一个新数组,其包含通过所提供函数实现的测试的所有元素。
// filter 为数组中的每个元素调用一次传入的回调函数,
// 并利用所有使得回调函数返回 true 或等价于 true 的值的元素创建一个新数组。
// 回调函数只会在已经赋值的索引上被调用,对于那些已经被删除或者从未被赋值的索引不会被调用。

var arr = [0, 1];
arr[5] = 5; // 直接为索引 5 的元素赋值为 5,跳过的几个元素均为 'empty',这些索引不会触发回调函数
var newArr = arr.filter((x) => {
  return x === undefined;
}); // 所以这里没有元素等于 undefined
console.log(newArr.length); // 输出 0
           

24

// 答案:aaa
// 考察运算符优先级和强制类型转换
// 优先级:函数调用 > ! > + > 三元运算符
//
const value = "value is" + !!Number(["0"]) ? "aaa" : "bbb";
console.log(value);

// Number('0') => 0
// !0 触发类型转换 => true,这些值会被转换成 false:null、NaN、0、空字符串 ("" or '' or ``)、undefined
// !true => false
// 'value is' + false => 'value isfalse'
// 条件运算符触发类型转换 => 'value isfalse' 转换为 true
// 最终输出 aaa