JavaScript面试中遇到的几个问题详解(一)

前言:

前些天,我一个朋友去面试前端,回来以后给我几个面试的js题目让我看看,猛的一看还真不是很会。激发了我的兴趣。
心想好歹咱也是干过前段的是吧,总不能啥都不会吧。于是经过学习,终于搞定。
(前两个月2017年7,8月我们公司外包了一个前段的项目,我出差了两个月,学习一阵前段知识)

说明:本文中说的自执行函数指的是形似(function(){})() 这样的函数,其特点是自动执行,不用手动调用;

题目一:

window.number = 2; 
var obj = {
    "number":4,
    "tbl":(function(){
        this.number *= 2 
        return function(){
            this.number *= 2; 
        }
    })()
}
var tbl  = obj.tbl;
tbl();
obj.tbl();

求:
    window.number = ? 
    obj.number = ? 
考点分析:
1.本题考查面试者对this关键字的理解
2.考查对自执行函数的理解
结果分析:
1.首先要明白,当js解释器执行完obj变量的时候,其属性tbl的自执行函数已经被解释器执行,又因为执行obj的tbl自执行函数的的环境是window,
所以此时window.number = 4 了;此时obj变量的定义为:
var obj = {
    "number":4,
    "tbl":function(){
            this.number *= 2; 
        }

}
以为:执行完自执行函数返回的结果为一个函数
2.执行var tbl  = obj.tbl; //返回函数 funcion(){this.number *= 2 ; }
  执行 tbl(); //调用返回函数,因为实在window环境,所以这里this == window,则 此时window.number = 8 ; 

3.执行obj.tbl(); // obj条用tbl返回的函数,此时执行环境是obj,那么this == obj ,所以obj中的number变量的结果为8,即 obj.number  = 8 ; 

4.说了怎么多了,让我们来验证一下
验证:编写验证代码执行
window.number = 2; 
var obj = {
    "number":4,
    "tbl":(function(){
        this.number *= 2 
        console.log("this == window ?"+ (this == window ));
        return function(){
            console.log("返回函数:this == window ?"+ (this == window ) + "this == obj ? "+ (this == obj));
            this.number *= 2; 
        }
    })()
}
var tbl  = obj.tbl;
tbl();
obj.tbl();
console.log(window.number);
console.log(obj.number);

执行结果如下:
这里写图片描述

验证分析:
1.当js解释器加载obj完成的时候,obj的tbl的自执行函数自动调用,此时的执行环境是window,输入 this == window ? true
2.当执行 tbl();输出 返回函数:this == window ? true this==obj ? false;因为此时的执行环境是window
3.当执行 obj.tbl();输出: 返回函数:this == window ? falsethis==obj ? true;因为此时的执行环境是obj

4.最后的结果都是 8 和我们结果分析相同,所以验证了我们的分析是正确的;

总结:

javascrip是一门前端非常重要的变成语言,我们必须系统的学习;在这里给大家推荐几本本人学习JavaScript的书籍:
《JavaScript高级程序设计第三版》 ---这本书都是讲的ES5的知识,但是很系统,值得一看

《ES6标准入门 第二版》 ---阮一峰写的非常的不错,将的ES6的知识点,重点说一下,这本书是开源的。非常感谢作者阮一峰的开源精神,这是我们开源软件一直发展下去的动力;
如果大家觉得不错的话,可以在网上购买。

《ES6标准入门 第二版》 在线电子书:http://es6.ruanyifeng.com/

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值