一次前端笔试总结

1.有一个长度未知的数组a,如果它的长度为0就把数字1添加到数组里面,否则按照先进先出的队列规则让第一个元素出队。

分析:这道题主要是考核了数组的队列方法和栈方法。另外,原题还有字数限制的,只有在字数小于30并且结果正确时才可以满分。所以,我们可以使用三目运算符(: ?)来减少字数。代码如下:

a.length === 0 ? a.push(1) : a.shift();

我当时忘记了出队是shift还是unshift,结果竟然误用了unshift,晕死了!

2.下面代码会输出什么:

var test = (function(a) {this.a = a;return function(b) {return this.a + b;}
} (function(a, b) {return a;
}(1, 2))); 
console.log(test(4)); //输出什么????

分析:这道题考了与函数有关的的两个非常重要的概念:自执行函数和闭包。但是不难,答案应该是5。

3.请把<ul><li>第1行</li><li>第2行</li>...</ul>(ul之间有10个li元素)插入body里面,注意:需要考虑到性能问题。
分析:这题主要考察了dom操作。插入节点操作的可以使用insertBefore和appendChild方法,随便用一个都行。但是,题目要求要考虑性能问题,这才是关键,因为,JavaScript操作dom的开销是很大的!提高性能就要减少dom操作。因此,我当时使用了下面的方法,只操作一次dom就够的了:

var lis = "",
ul = document.createElement("ul");//把li以字符串形式生成
for(var i = 1; i <= 10; i++) {lis += "<li>第" + i + "行</li>";
}// 最后通过innerHTML插入ul里面
ul.innerHTML = lis;//这里才操作dom,把ul插入到body
document.body.appendChild(ul);

4.不使用loop循环,创建一个长度为100的数组,并且每个元素的值等于它的下标。
分析:当时看到题目要求不使用loop循环时,“聪明过头”的我马上就想到了使用间歇性定时器setInterval,代码如下:

var a = [],i = 0;
var interval = setInterval(function() {i < 100 ? a.push(i++) : clearInterval(interval);
}, 0);

确实没有使用loop循环,我当时还对自己的聪明感到欣欣自喜呢!但是后来,跟朋友讨论了一下,才知道这道题的目的是在考察我们对数组的熟练程度,而不是考察定时器!况且用这种方法来创建数组性能也不见得有多高!他的做法是先创建一个长度为100的数组,然后再使用数组的实例方法Array.prototype.map来重新赋值,代码如下:

var a = new Array(100);a = a.map(function(item, index) {return index;
});

使用了map方法真是高端大气上档期啊!一开始,我也以为他的答案是正确的了,但是,后来我在控制台打印了一下,却发现也是不对的啊,因为,最终打出来的数组是一个长度为100的空的数组,如下:

前端学习交流群:461593224

好奇怪!这么好用的方法竟然输出的结果也不正确,心好累啊!
后来,查了API,才知道, JavaScript数组是稀疏数组,比如,通过new Array(100)创建一个新的数组的,虽然他的长度是100,但是实际上他是一个空数组,也就是说没有真实存在的元素。所以使用map方法,根本不会去遍历这个数组100次的。后来,它知乎上问了一下,才学到了一个新的可行的方法,如下:

var a = Array(100).join(",").split(",").map(function(item, index) {return index;
});

这个解法充满了曲折啊!先是创建一个数组,然后,通过join方法把它转成字符串,然后,再通过split方法把字符串转成数组,这时候,它就拥有100个值为空的元素了,然后,再通过map函数,改变这些元素的值即可。

5.实现对数组进行乱序
这道题考察了数组的sort方法,因为是乱序,所以,还需要用到Math.random()产生随机数,打乱排序规律!代码如下:

var a = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],sign = 1; 
a.sort(function(a, b) {//因为Math.random产生的数在0-1之间//所以0.5两边的概率是相等的//大于0.5时为升序,小于0.5时为降序sign = (Math.random() > 0.5) ? 1 : -1;return (a - b) * sign;});

6.有一个长度为100的数组,请以优雅的方式求出该数组的前10个元素之和
分析:其实,对于数组求和有很多种方法,也很简单。但是,这题有两个限制条件:优雅的方式、前10个元素。对于“前10个元素”这个限制条件可以使用Array.prototype.slice()方法来截取,对于"优雅的方式",我的理解是应该尽可能使用数组自带的方法,最好可以使用高阶函数!所以我觉得应该是Array.prototype.reduce()方法。代码如下:

var a = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15],
sum = 0;sum = a.slice(0, 10).reduce(function(pre, current) {return pre + current;
});console.log(sum); //55

这样看起开会比使用for循环优雅了不少哈!

后面的都是主观题,答案不唯一

7.JavaScript实现继承的常用方法有哪些?你推荐的是哪一种?

8.在项目开发完成之后,根据雅虎性能优化规则,需要对html,JS,CSS,图片需要做出怎样的处理?是否可以借助构建工具实现自动化?

9.当项目的某个模块发生问题了,你是怎么定位错误的?你常用的调试工具是什么?

10.我们在跟后端进行异步请求时,很容易陷入嵌套太深的陷阱?

学习前端的同学注意了!!!
学习过程中遇到什么问题或者想获取学习资源的话,欢迎加入前端学习交流群461593224,我们一起学前端!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/540413.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SSL

今天遇到一位网友要求老蒋将他当前已经在使用的WDCP面板环境&#xff0c;给某个站点添加SSL证书&#xff0c;实现HTTPS网址访问。在过去的几篇文章中&#xff0c;老蒋也有分享过不少在Linux VPS中对应的WEB环境安装SSL证书的经历&#xff0c;其实总体来看都大同小异&#xff0c…

应用宝认领应用

2019独角兽企业重金招聘Python工程师标准>>> 【Android】命令行jarsigner签字和解决找不到证书链错误 1、签名失败 $jarsigner -verbose -keystore /Volumes/Study/resourcesLib/Qunero-achivements/AndroidApp/QuLordy-signed-key -signedjar ./signed_XiaomiVerif…

Squid服务日志分析

Squid服务日志分析 Apache 和 Squid 是两种著名的代理缓存软件&#xff0c;但Squid 较 Apache 而言是专门的代理缓存服务器软件&#xff0c;其代理缓存的功能强大&#xff0c;支持 HTTP/1.1 协议&#xff0c;其缓存对象也较多&#xff1b;并且 Squid 的缓存管理模块和访问控制模…

云时代 揭开性能监测战略的隐秘优势

云时代的性能监测战略 能够对各种变化做出快速响应而不偏离重心和企业发展动力&#xff0c;正逐渐成为各行各业、各种规模企业的奋斗目标。业务敏捷性通常是运营良好&#xff0c;可实现盈利的企业标志。实现这一目标意味着公司已经成功地利用业务关键型技术来提高生产率&#x…

聊聊全站HTTPS带来的技术挑战

日前写的文章里了讨论了数据传输的安全性的问题&#xff0c;最后一部分提到了通过HTTPS解决数据传输安全性的方案。那么一个新问题又来了&#xff0c;实施全站HTTPS的过程中&#xff0c;我们可能会遇到哪些技术问题?所以我今天和大家一起来算一下这个账&#xff0c;将技术成本…

4.3/4.4 磁盘分区

2019独角兽企业重金招聘Python工程师标准>>> 添加虚拟磁盘 第一步&#xff0c;选择虚拟机中的“设置” 第二步&#xff0c;选择“添加硬盘” 第三步&#xff0c;选择_SCSI &#xff08;推荐&#xff09; # 保持默认 第四步&#xff0c;选择“创建新的虚拟磁盘…

RoboMaster 2017:机器人版的「王者农药」,工程师们的竞技时代

8月6日晚&#xff0c;第十六届全国大学生机器人大赛 RoboMaster 2017机甲大师赛在华润深圳湾体育中心“春茧”体育馆举行&#xff0c;关于这个比赛的盛况已经无需赘述&#xff0c;去年雷锋网参加上届比赛时&#xff0c;报道的是「像看了一场演唱会」&#xff0c;如果用演唱会来…

【初学者必读】:前端工程师的知识体系

下图是前端工程师图解&#xff1a; 前端开发的核心是HTML CSS JavaScript。本质上它们构成一个MVC框架&#xff0c;即HTML作为信息模型&#xff08;Model&#xff09;&#xff0c;CSS控制样式&#xff08;View&#xff09;&#xff0c;JavaScript负责调度数据和实现某种展现逻…

使用Prometheus监控Cloudflare的全球网络

Matt Bostock在SRECON 2017欧洲大会的演讲中&#xff0c;介绍了如何使用Prometheus实现对CloudFlare分布于全球的架构和网络的监控。Prometheus是一种基于度量进行监控的工具&#xff0c;CloudFlare是一家CDN、DNS和DDoS防御&#xff08;Mitigation&#xff09;服务提供商。\\基…

开始吧

2019独角兽企业重金招聘Python工程师标准>>> 写C三年有余&#xff0c;在技术方面也算小有所成。准备在这里分享一些C进阶、Python、Golang技术文章。 CSDN博客地址&#xff1a; http://blog.csdn.net/godmaycry 以后博客同步更新。 转载于:https://my.oschina.net/u…

Exchange server 2013(十四)WSUS部署及组策略设置(2)

我们继续上一节未完的博客&#xff0c;继续我们的WSUS设置。[上一章节标题&#xff1a;Exchange server 2013(十四)WSUS部署及组策略设置(1) 网址&#xff1a;http://1183839.blog.51cto.com/blog/1173839/1182366] 首先单击自动审批,来修改审批规则,也就是说当wsus侦测到新的更…

用MATLAB结合四种方法搜寻罗马尼亚度假问题

选修了cs的AI课&#xff0c;开始有点不适应&#xff0c;只能用matlab硬着头皮上了&#xff0c;不过matlab代码全网仅此一份&#xff0c;倒有点小自豪。 一、练习题目 分别用宽度优先、深度优先、贪婪算法和 A*算法求解“罗马利亚度假问题”。具体地图我这里不给出了&#xff0c…

[转]Paul Adams:为社交设计

为社交设计 Strong, Weak, and Temporary Ties by Paul Adams on 2010/04/09 PS&#xff1a;作者Paul Adams Facebook全球品牌体验总监 电话和手机聚集十亿用户用了15年的时间&#xff0c;而Facebook只用了9个月。我们看到越来越多的人开始用在线社交网络&#xff0c;这种网络好…

Android Framework中的Application Framework层介绍

Android的四层架构相比大家都很清楚&#xff0c;老生常谈的说一下分别为&#xff1a; Linux2.6内核层&#xff0c;核心库层&#xff0c;应用框架层&#xff0c;应用层。我今天重点介绍一下应用框架层Framework。 Framework层为我们开发应用程序提供了非常多的API&#xff0c;我…

ORACLE中创建如何创建表,并设置结构和默认值

使用select语句查看EMP表&#xff0c;根据COMM排序 默认情况下&#xff0c;空值会自动排列在尾部。 利用nulls last排序时将空值置底 利用nulls first排序时将空值置顶 例 创建一张出版社表 使用语句 create table 表名&#xff08;列名1 类型&#xff0c;列名2 类型&#xff0…

暴风TV请来中国人工智能first lady冯雁教授任首席科学家

今日下午&#xff0c;暴风AI无屏电视发布会现场&#xff0c;暴风TV宣布邀请号称“中国人工智能first lady”、于香港科技大学任教的冯雁教授&#xff0c;担任暴风TV人工智能首席科学顾问。 冯雁教授于现场表示&#xff0c;选择暴风TV合作的重要原因&#xff0c;一方面在于其个人…

gulp之gulp.watch报错

gulpfile.js如下&#xff1a; 问题&#xff1a; 第一次改动文件&#xff0c;监听正常。再次改动&#xff0c;报错&#xff0c;如下&#xff1a; 解决&#xff1a; 总结&#xff1a; 意思&#xff0c;gulpsequence这玩意儿返回的thunk只能执行一次 转载于:https://www.cnblogs.c…

.NET深入学习笔记(4):深拷贝与浅拷贝(Deep Copy and Shallow Copy)

今天继续利用准备WSE安全开发文章的空闲时间&#xff0c;完善《.NET深入学习笔记》系列&#xff08;基本都是.Net重要的知识点&#xff0c;我都做了详细的总结&#xff0c;是什么、为什么、和怎么实现&#xff09;。想必很多人也接触过这两个概念。做过C的人对深浅拷贝的概念一…

VIM一般模式操作

2019独角兽企业重金招聘Python工程师标准>>> vim介绍 vim和vi几乎是一样的&#xff0c;唯一的区别就是当编辑一个文本时&#xff0c;使用vi不会显示颜色&#xff0c;而使用vim会显示颜色。 vim有三个模式&#xff1a;一般模式&#xff0c;编辑模式&#xff0c;命令模…

stateful set 学习笔记

2019独角兽企业重金招聘Python工程师标准>>> 1、创建pv # cat pv.yaml kind: PersistentVolume apiVersion: v1 metadata:name: task-pv-volumelabels:type: local spec:capacity:storage: 3GiaccessModes:- ReadWriteOncehostPath:path: "/tmp/data" 2、…