`

五个JavaScript基础问题

阅读更多

下面是五个关于前端相关的基础问题,但却很能体现JavaScript的基本功底。

问题1:Scope作用范围

考虑下面的代码: 

(function() {
   var a = b = 5;
})();
console.log(b);

什么会被打印在控制台上? 

回答:

        上面的代码会打印 5。

        这个问题的诀窍是,这里有两个变量声明,但 a 使用关键字var声明的。代表它是一个函数的局部变量。与此相反,b 变成了全局变量。

        这个问题的另一个诀窍是,它没有使用严格模式 ('use strict';) 。如果启用了严格模式,代码就会引发ReferenceError的错误:b没有定义(b is not defined)。请记住,严格模式,则需要明确指定,才能实现全局变量声明。比如,你应该写:

(function() {
   'use strict';
   var a = window.b = 5;
})();
console.log(b);

 

问题2:创建“原生”(native)方法

给字符串对象定义一个repeatify功能。当传入一个整数n时,它会返回重复n次字符串的结果。例如: 

console.log('hello'.repeatify(3));

应打印 hellohellohello。 

回答:

        一个可能的实现如下所示: 

String.prototype.repeatify = String.prototype.repeatify || function(times) {
   var str = '';
   for (var i = 0; i < times; i++) {
      str += this;
   }
   return str;
};

        这个问题测试开发者有关JavaScript继承和prototype的知识点。这也验证了开发者是否知道该如果扩展内置对象(尽管这不应该做的)。 

        这里的另一个要点是,你要知道如何不覆盖可能已经定义的功能。通过测试一下该功能定义之前并不存在: 

String.prototype.repeatify = String.prototype.repeatify || function(times) {/* code here */};

        当你被要求做好JavaScript函数兼容时这种技术特别有用。 

 

问题3:声明提升(Hoisting)

执行这段代码,输出什么结果? 

function test() {
   console.log(a);
   console.log(foo());
   var a = 1;
   function foo() {
      return 2;
   }
}
test();

回答:

        这段代码的结果是 undefined 和 2。 

        变量和函数的声明都被提前了(移到了函数的顶部),但变量不分配任何值。因此,在打印变量的时候,它在函数中存在(它被声明了),但它仍然是 undefined 。表示换句话说,上面的代码等同于以下内容:

function test() {
   var a;
   function foo() {
      return 2;
   }
   console.log(a);
   console.log(foo());
   a = 1;
}
test();

 

问题4:this在JavaScript中如何工作的

下面的代码会输出什么结果?给出你的答案。 

var fullname = 'John Doe';
var obj = {
   fullname: 'Colin Ihrig',
   prop: {
      fullname: 'Aurelio De Rosa',
      getFullname: function() {
         return this.fullname;
      }
   }
};
console.log(obj.prop.getFullname());
var test = obj.prop.getFullname;
console.log(test());

回答 :

        是Aurelio De Rosa和John Doe。

        在一个函数中,this的行为,取决于JavaScript函数的调用方式和定义方式,而不仅仅是看它如何被定义的。 

        在第一个 console.log()调用中,getFullname() 被调用作为obj.prop对象的函数。所以,上下文指的是后者,函数返回该对象的fullname。与此相反,当getFullname()被分配到test变量时,上下文指的是全局对象(window)。这是因为test是被隐式设置为全局对象的属性。出于这个原因,该函数返回window的fullname,即定义在第一行的那个值。 

 

问题5:call() 和 apply()

现在让你解决前一个问题,使最后的console.log() 打印 Aurelio De Rosa。 

回答:

该问题可以通过强制使用 call() 或者 apply() 改变函数上下文。在下面我将使用call(),但在这种情况下,apply()会输出相同的结果: 

console.log(test.call(obj.prop));

 

文章来源:http://tomcat-oracle.iteye.com/blog/2147792

分享到:
评论

相关推荐

    Python项目-自动办公-56 Word_docx_格式套用.zip

    Python课程设计,含有代码注释,新手也可看懂。毕业设计、期末大作业、课程设计、高分必看,下载下来,简单部署,就可以使用。 包含:项目源码、数据库脚本、软件工具等,该项目可以作为毕设、课程设计使用,前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷,具有很高的实际应用价值。

    《松鼠》生态性课堂体验教案.docx

    《松鼠》生态性课堂体验教案

    Java系统源码+智慧图书管理系统

    Java系统源码+智慧图书管理系统 内容概要: 本资源包含了完整的Java前后端源码及说明文档,适用于想要快速搭建并部署Java Web应用程序的开发者、学习者。 技术栈: 后端:Java生态系统,包含Spring Boot、Shiro、MyBatis等,数据库使用Mysql 前端:Vue、Bootstrap、Jquery等 适用场景示例: 1、毕业生希望快速启动一个新的Java Web应用程序。 2、团队寻找一个稳定的模板来加速产品开发周期。 3、教育机构或个人学习者用于教学目的或自学练习。 4、创业公司需要一个可以立即投入使用的MVP(最小可行产品)。

    基于ssm+jsp实现的超市管理系统高级版v2-lw.zip

    项目包含前后台完整源码。 项目都经过严格调试,确保可以运行! 具体项目介绍可查看博主文章或私聊获取 助力学习实践,提升编程技能,快来获取这份宝贵的资源吧!

    《松鼠》教学方案.docx

    《松鼠》教学方案

    基于ssm的计算机课程实验管理系统源代码(完整前后端+mysql+说明文档+LW).zip

    学生角色 学生用户在系统的前台界面可以浏览站内新闻、系统公告等公共的信息,在进行了注册和登录等操作后可以进入个人后台管理界面,对自己的个人信息进行管理,还可以进行实验成绩查看和实验交流等操作。 教师角色 教师用户也可以正常使用本系统的前台功能,但最主要的功能还是在个人后台界面中。在教师的个人后台界面中,首先教师可以管理自己的个人信息,还可以对学生进行实验任务书下达,对学生的实验成果和实验成绩管理等操作。 管理员角色 系统管理员可以管理整个系统的数据,比如可以管理教师和学生的个人资料,对违反了网站及学校实验室规定的同学可以进行删除。除了管理教师和学生的信息外,管理员用户还可以对公告信息及新闻信息等进行管理。 环境说明: 开发语言:Java 框架:ssm,mybatis JDK版本:JDK1.8 数据库:mysql 5.7 数据库工具:Navicat11 开发软件:eclipse/idea Maven包:Maven3.3 服务器:tomcat7

    毕业设计-0-1背包问题动态规划模型Python代码.rar

    1、资源项目源码均已通过严格测试验证,保证能够正常运行; 2、本项目仅用作交流学习参考,请切勿用于商业用途。

    基于ssm的大创项目申报管理系统源代码(完整前后端+mysql+说明文档+LW).zip

    管理员 管理员管理 工作人员管理 用户管理 公告信息管理 往届项目管理 工作人员 个人资料修改 公告查看 项目申报信息管理,发布(项目申报信息、要求、时间节点等信息) 项目模板管理 往届项目查询 用户 个人资料修改 公告查看 项目模板下载 项目申报信息查看 我的项目申报 项目申报结果查看 环境说明: 开发语言:Java 框架:ssm,mybatis JDK版本:JDK1.8 数据库:mysql 5.7 数据库工具:Navicat11 开发软件:eclipse/idea Maven包:Maven3.3 服务器:tomcat7

    福禄寿FloruitShow - 多一个世界 [mqms].ogg

    福禄寿FloruitShow - 多一个世界 [mqms].ogg

    Python项目-自动办公-45 excel处理实例(一维转二维).zip

    Python课程设计,含有代码注释,新手也可看懂。毕业设计、期末大作业、课程设计、高分必看,下载下来,简单部署,就可以使用。 包含:项目源码、数据库脚本、软件工具等,该项目可以作为毕设、课程设计使用,前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷,具有很高的实际应用价值。

    商业企业资本结构与公司价值关系研究 开题报告.docx

    商业企业资本结构与公司价值关系研究 开题报告.docx

    间位芳纶纸全球市场研究报告:2023年市场规模达到约6.31亿美元

    间位芳纶纸全球市场研究报告:2023年市场规模达到约6.31亿美元 在特种纸材料领域,间位芳纶纸以其高强度、耐高温、耐腐蚀、本质阻燃和卓越的电绝缘性能,成为了现代工业不可或缺的关键材料。从电气绝缘到蜂窝结构材料,再到民间用品,间位芳纶纸的广泛应用不仅推动了多个行业的进步,更展现了其巨大的市场潜力。然而。本文将深入探讨间位芳纶纸市场的现状、技术创新、应用领域、竞争格局及未来趋势,并强调用户咨询在引领市场发展中的关键作用。 市场概况 据QYR最新调研,2023年全球间位芳纶纸市场规模达到约6.31亿美元,同比增长12.88%。这一增长主要得益于电气绝缘领域和蜂窝芯材领域的强劲需求。电气绝缘领域作为间位芳纶纸的主要应用领域,2023年占比高达62.76%,而蜂窝芯材领域则紧随其后,占比34.71%。在中国市场,间位芳纶纸的发展同样令人瞩目。尽管起步较晚,但得益于技术进步和政策支持,国内间位芳纶纸市场规模持续走高,从2016年的4.8亿元增长至2023年的10亿元,期间复合年增长率为12.01%。 技术创新与趋势 技术创新是推动间位芳纶纸市场发展的核心动力。随着纳米技术、智能制造等技术的不断发

    毕业设计-BP神经网络模型Python代码.rar

    1、资源项目源码均已通过严格测试验证,保证能够正常运行; 2、本项目仅用作交流学习参考,请切勿用于商业用途。

    Python 批量转换PPT、Excel、Word为PDF文件工具

    Python 批量转换PPT、Excel、Word为PDF文件工具

    四川大学期末考试试题(开卷).pdf

    四川大学期末考试试题(开卷).pdf

    毕业设计-RBF神经网络做回归预测代码.rar

    1、资源项目源码均已通过严格测试验证,保证能够正常运行; 2、本项目仅用作交流学习参考,请切勿用于商业用途。

    springboot-基于JavaScript的在线考试系统.zip

    springboot-基于JavaScript的在线考试系统.zip

    深圳市2005-2024年近20年历史气象数据下载

    深圳市2005-2024年近20年的历史气象数据,每3小时更新一次数据,参数包含气温、气压、降水量、云层、能见度、风向、湿度等,几万条数据

    Python项目-实例-15 屏保计时器.zip

    Python课程设计,含有代码注释,新手也可看懂。毕业设计、期末大作业、课程设计、高分必看,下载下来,简单部署,就可以使用。 包含:项目源码、数据库脚本、软件工具等,该项目可以作为毕设、课程设计使用,前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷,具有很高的实际应用价值。

    2024北邮数电大实验-水位检测与控制系统

    2024北邮数电大实验——实验3:水位检测与控制 全功能代码开源。本人期末复习任务繁重,代码无时间作详细注释。

Global site tag (gtag.js) - Google Analytics