那些年,几道”老生常错“的前端面试题(三)

共 3058字,需浏览 7分钟

 ·

2021-01-17 19:24

  • 以下两个函数是否等价

  • NaN是什么?它是什么类型?如何检测一个变量是不是NaN?

  • this&对象&数组 1)下面程序输出是什么

  • 算法/思路相关

    • 1. 讨论实现判断变量是否是整数的函数isInter(x)的实现

    • 3) 使用递归的方法,将obj变为obj2的格式


以下两个函数是否等价

function foo1()
{
  return {
      bar"hello"
  };
}

function foo2()
{
  return
  {
      bar"hello"
  };
}

答案:不等价!!

注意,第二个函数返回的是undefined

console.log(foo1()); // {bar : "hellp"}
console.log(foo2()); // undefined

这也是为什么函数返回对象时,或写大括号时,把{写在一边,因为第二个函数js会默认return后面返回的东西(是空),等价于

return undefined
{xxx}
//后面当然,当然是写了也白写

NaN是什么?它是什么类型?如何检测一个变量是不是NaN?

答案:NaN即Not A Number,但实际上它是Number类型

typeof NaN 将会返回Number。

这个东西比较厉害,因为

NaN === NaN  //false

你会发现,它自己都不等于它自己,因此判断变量是否是它,不能使用===。

可以使用isNaN方法

//检查变量是否是nan
isNaN(bar);
Object.is(bar,NaN); //ES6方法,这个方法会修正JS中的一些小bug

Object.is()方法,要求严格相等,且Object.is(NaN,NaN)会返回true

this&对象&数组 1)下面程序输出是什么

var myObject = {
    foo"bar",
    funcfunction({
        var self = this;
        console.log("outer func:  this.foo = " + this.foo);
        console.log("outer func:  self.foo = " + self.foo);
        (function({
            console.log(this);
            console.log("inner func:  this.foo = " + this.foo);
            console.log("inner func:  self.foo = " + self.foo);
        }());
    }
};
myObject.func();

//答案

outer func: this.foo = bar
outer func: serl.foo = bar
inner func: this.foo = undefined
inner func: self.foo = bar

分析:搞清楚this的指向。记住以下几种规则

  • 谁调用,this指向谁 xxx.fun()
  • new一个对象,this指向实例本身var c = new fun()
  • 使用call/apply/bind修改this指向。

看题目,outer func显然是第一种情况,谁调用,this指向谁,这个时候都是myOjbect。而在立即执行函数中,在这里this是没有进行绑定指向的,自然从属于window,所以这里this.foo是undefied

补充关于箭头函数的this

function a({
    return () => {
        return () => {
         console.log(this)
        }
    }
}
console.log(a()()())

注意:箭头函数其实是没有 this 的,这个函数中的 this 只取决于他外面的第一个不是箭头函数的函数的 this。在这个例子中,因为调用 a 符合前面代码中的第一个情况,所以 this 是 window。并且 this 一旦绑定了上下文,就不会被任何代码改变。

算法/思路相关

1. 讨论实现判断变量是否是整数的函数isInter(x)的实现

答案:在ES6中,是有现成的方法Number.isInteger可以使用的。如果自己实现,思路是什么呢

//1 异或运算
function isInter(x{
    return x ^ 0 === x
}

//2 取整
return Math.round(x) === x  //同样可以用floor ceil

//取余
return (typeof x === 'number')&&(x % 1 === 0)
  1. 写一个sum方法,可以实现以下两种调用方式
console.log(sum(2,3)) //5
console.log(sum(2)(3)) //5
答案:

//方法1
var sum = function(x,y) {
    if(y === undefined) {
        return function(y) {
            return x + y;
        }
    }else {
        return x + y;
    }
}

//方法2
var sum = function(x){
    if( arguments.length === 1) {
        return function (y) {
            return x + y;
        }
    } else {
        console.log('here');
        return arguments[0] + arguments[1];
    }
}

3) 使用递归的方法,将obj变为obj2的格式

obj = [
    {id:1,parent:null},
    {id:2,parent:1},
    {id:3,parent:2}
]

obj2 = {
    obj:{
        id: 1,
        parent: null,
        child: {
            id: 2,
            parent: 1,
            child: {
                id: ,3,
                parent: 2
            }
        }
    }
}

这一题答案留给小伙伴们思考啦,因为笔者在考试时没有写出很漂亮的程序,就等之后整理后再贴上来,欢迎小伙伴评论区讨论

原文:https://juejin.cn/post/6844903641837649928

结束语

如果你对我的解释有疑问,请给我留言,欢迎大家一起讨论这些JS难题。


本文完~

喜欢本文的朋友,欢迎关注公众号 前端阳光,收看更多精彩内容

点个[在看],是对我最大的支持!


如果觉得这篇文章还不错,来个【分享、点赞、在看】三连吧,让更多的人也看到~


浏览 8
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报