前端经典面试题 不经典不要star!

前言

(以下内容为一个朋友所述)今天我想跟大家分享几个前端经典的面试题,为什么我突然想写这么一篇文章呢?今天我应公司要求去面试了下几位招聘者,然后又现场整不出几个难题,就搜了一下前端变态面试题! HAHA,前提我并不是一个变态,欺负人的面试官.只是我希望看看对方的逻辑能力!

从而又拿这些面试题进行了自我检测,发现还是有一些坑的~~~
接下与大家进行几道题的分析 分享 互勉!

正文

先把我挑选的几道,不一定最经典.但是会让你有学习的进步!列举一下

//第1题 ["1", "2", "3"].map(parseInt) //第2题 [ [3,2,1].reduce(Math.pow), [].reduce(Math.pow) ] //第3题 var ary = [0,1,2]; ary[10] = 10; ary.filter(function(x) { return x === undefined;}); //第4题 [typeof null, null instanceof Object] //第5题 function sidEffecting(ary) { ary[0] = ary[2]; } function bar(a,b,c) { c = 10 sidEffecting(arguments); return a b c; } bar(1,1,1) //第六题 var END = Math.pow(2, 53); var START = END - 100; var count = 0; for (var i = START; i <= END; i ) { count ; } console.log(count); 

读者思考时间

大家努力思考,努力!==============================================

接下来一道一道咱们去慢慢解析

第一题:

["1", "2", "3"].map(parseInt) 

这道题知识点包括:

  1. Array/map
  2. Number/parseInt
  3. JavaScript parseInt

按照上面知识点来串一下这道题!

首先, map接受两个参数, 一个回调函数 callback, 一个回调函数的this值 其中回调函数接受三个参数 currentValue, index, arrary; 而题目中, map只传入了回调函数--parseInt. 其次, parseInt 只接受两个两个参数 string, radix(基数). 本题理解来说也就是key与 index 所以本题即问 parseInt('1', 0); parseInt('2', 1); parseInt('3', 2); 首先后两者参数不合法. 所以答案是 [1, NaN, NaN] 如果研究理解了 parseInt(3, 8) parseInt(3, 2) //下方评论该题答案 别作弊哦! parseInt(3, 0) 

第二题:

[ [3,2,1].reduce(Math.pow), [].reduce(Math.pow) ]

这道题知识点:

  • Array/Reduce

穿插知识点来一次这道题!

arr.reduce(callback[, initialValue])reduce接受两个参数, 一个回调, 一个初始值.回调函数接受四个参数 previousValue, currentValue, currentIndex, array 需要注意的是 If the array is empty and no initialValue was provided, TypeError would be thrown. 所以第二个表达式会报异常. 第一个表达式等价于 Math.pow(3, 2) => 9; Math.pow(9, 1) =>9 

答案 

an
 
error

第三题:

var ary = [0,1,2]; ary[10] = 10; ary.filter(function(x) { return x === undefined;}); 答案是 []

知识点是:

  • 稀疏数组

我们来看一下 Array.prototype.filter 的 polyfill:

if (!Array.prototype.filter) { Array.prototype.filter = function(fun/*, thisArg*/) {  'use strict'; if (this === void 0 || this === null) { throw new TypeError(); } var t = Object(this); var len = t.length >>> 0; if (typeof fun !== 'function') { throw new TypeError(); } var res = []; var thisArg = arguments.length >= 2 ? arguments[1] : void 0; for (var i = 0; i < len; i ) { if (i in t) { // 注意这里!!! var val = t[i]; if (fun.call(thisArg, val, i, t)) { res.push(val); } } } return res; }; }

我们看到在迭代这个数组的时候, 首先检查了这个索引值是不是数组的一个属性, 那么我们测试一下.

0 in ary; => true 3 in ary; => false 10 in ary; => true

也就是说 从 3 - 9 都是没有初始化的

bug 
!, 这些索引并不存在与数组中. 在 array 的函数调用的时候是会跳过这些坑的.

第四题:

[typeof null, null instanceof Object]

知识点:

  1. Operators/typeof
  2. Operators/instanceof

typeof 返回一个表示类型的字符串.

instanceof 运算符用来检测 constructor.prototype 是否存在于参数 object 的原型链上.

这个题可以直接看链接... 因为 typeof null === 'object' 自语言之初就是这样....

typeof 的结果请看下表:

type         result
Undefined   "undefined" Null "object" Boolean "boolean" Number "number" String "string" Symbol "symbol" Host object Implementation-dependent Function "function" Object "object" 

所以答案 [object, false]

第五题:

function sidEffecting(ary) { ary[0] = ary[2]; } function bar(a,b,c) { c = 10 sidEffecting(arguments); return a b c; } bar(1,1,1) 

知识点:

  • Functions/arguments

首先 The arguments object is an Array-like object corresponding to the arguments passed to a function.

也就是说 arguments 是一个 object, c 就是 arguments[2], 所以对于 c 的修改就是对 arguments[2] 的修改.

所以答案是 21.

但是!!!!

当函数参数涉及到 any rest parameters, any default parameters or any destructured parameters 的时候, 这个 arguments 就不在是一个 mapped arguments object 了.....

请看:

function sidEffecting(ary) { ary[0] = ary[2]; } function bar(a,b,c=3) { c = 10 sidEffecting(arguments); return a b c; } bar(1,1,1)

答案是 12 !!!!

请慢慢体会!!

第六题:

咳咳咳!
细心的小伙伴发现了我第

6
题不是第
6
题而是第

其实这个是给你们留下一个思考的题 如果有疑问或者探讨请留言!

【我有一个前端学习交流QQ群:328058344 如果你在学习前端的过程中遇到什么问题,欢迎来我的QQ群提问,群里每天还会更新一些学习资源。禁止闲聊,非喜勿进。】

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

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

相关文章

CSS的常见问题

1.css的编码风格 多行式&#xff1a;可读性越强&#xff0c;但是CSS文件的行数过多&#xff0c;影响开发速度&#xff0c;增大CSS文件的大小 一行式&#xff1a;可读性稍差&#xff0c;有效减少CSS文件的行数&#xff0c;有利于提高开发速度&#xff0c;减小CSS文件的大小 2.id…

linux 磁盘科隆,Linux中ln命令用法详解(硬链接)

硬连接指向的是节点(inode),是已存在文件的另一个名字,修改其中一个,与其连接的文件同时被修改;对硬链接文件进行读写和删除操作时候&#xff0c;效果和符号链接相同。但如果我们删除硬链接文件的源文件&#xff0c;硬链接文件仍然存在&#xff0c;而且保留了原有的内容。这时&…

Web前端开发学习误区,你掉进去了没?

从接触网站开发以来到现在&#xff0c;已经有五个年头了吧&#xff0c;今天偶然整理电脑资料看到当时为参加系里面一个比赛而做的第一个网站时&#xff0c;勾起了在这网站开发道路上的一串串回忆&#xff0c;成功与喜悦、烦恼与纠结都历历在目&#xff0c;感慨颇多。 先从大家学…

Oracle Database 11g DBA手册pdf

下载地址&#xff1a;网盘下载内容简介编辑《Oracle Database 11g DBA手册》所提供的专业知识可以帮助读者管理灵活的、高可用性的Oracle数据库。《Oracle Database 11g DBA手册》对上一版本进行了全面的修订&#xff0c;涵盖了每个新特性和实用工具&#xff0c;展示了如何实施…

link-cut-tree 简单介绍

目录 概念辨析辅助树轻边和重边操作介绍accessmake_rootfind_rootsplitlinkcut细节问题代码前言:这个算法似乎机房全都会,就我不会了TAT...强行搞了很久,勉强照着别人代码抄了一遍qwq 这个本人看论文实在看不懂,太菜了啊!!! 只好直接看如何实现...可是实现也看不太懂... 但直到…

linux svn 看不到文件,SVN更新时不能打开新文件svn-base系统找不到指定的文件

svn服务器架设在linux系统上&#xff0c;svn客户端在windows上&#xff0c;在update的时候可能会出现“Can’t open file.XXXX/tmp/text-base/XX.svn-base 系统找不到指定的文件”的错误。这是由于Linux服务器上的目标文件中存在两个相同文件名的文件。因为linux系统的文件名区…

C++primer 13.2.1节练习

练习13.23 1 #include <iostream>2 #include <string>3 #include <memory>4 5 using namespace std;6 7 8 class HasPtr {9 friend ostream &print(ostream &os, HasPtr &h); 10 public: 11 HasPtr(const string &s string()) : ps…

编年史与微云

总览 我面临的一个常见问题是&#xff1a; 如果是单个作者&#xff0c;多个读者&#xff0c;您如何扩展基于Chronicle的系统。 尽管有解决此问题的方法&#xff0c;但很有可能根本不会出现问题。 微云 这是我用来描述单个线程来完成当前由多个服务器完成的工作的术语。 &#…

去除IE10自带的清除按钮

最近在工作中碰到了一个问题&#xff0c;原本在IE8&#xff0c;IE9下正常的input表单&#xff0c;在IE10下会出现清除按钮&#xff0c;即表单右侧会出现一个可以清除该表单内容的小叉。由于之前一直没有兼容过IE10&#xff0c;所以我专门搜了下原因。发现&#xff0c;该功能是微…

Linux/CentOS7install PackageError: Loaded plugins: fastestmirror

Centons7 其大概意思是fastestmirror不能使用&#xff0c;fastestmirror是yum的一个加速插件&#xff0c;具体我也没有仔细了解过&#xff0c;可能是系统不支持或者缺少组件导致的。 处理办法就是禁用这个插件&#xff0c;方法如下&#xff1a; [rootlocalhost ~]# vim /etc/yu…

不要仅仅依靠单元测试

当您构建一个复杂的系统时&#xff0c;仅仅测试组件是不够的。 这很关键&#xff0c;但还不够。 想象一下一家汽车厂生产并进口最高质量的零件&#xff0c;但组装好之后再也不会启动发动机了。 如果您的测试用例套件几乎不包含单元测试&#xff0c;则您将永远无法确保系统整体正…

spring mvc的工作原理

该文转载自&#xff1a;http://blog.csdn.net/u012191627/article/details/41943393 SpringMVC框架介绍 1) spring MVC属于SpringFrameWork的后续产品&#xff0c;已经融合在Spring Web Flow里面。 Spring 框架提供了构建 Web 应用程序的全功能 MVC 模块。使用 Spring 可插入的…

oracle快速插入大量数据

方法一&#xff1a;循环 declare -- Local variables here m integer; begin -- Test statements here--输出开始时间 dbms_output.put_line(start:||sysdate); m:0;--循环插入的数据量 for i in 1..4000 loop m:m1; --插入语句&#xff0c;其中admintest||m, 为admintest后面…

春天遇见Apache Hadoop

SpringSource 刚刚宣布了适用于Apache Hadoop的Spring的第一个GA版本 。 该项目的目的是简化基于Hadoop的应用程序的开发。 您可以下载该项目在这里 &#xff0c;并检查了Maven的文物在这里 。 Apache Hadoop的Spring诞生是为了解决Hadoop应用程序构建不良的问题&#xff0c;…

linux 模拟时序,stm32GPIO模拟时序读写nandflash(K9F1G08U0B)问题

我使用的STM32F103VBT6这款芯片,K9F1G08U0B和 STM32F103VBT6连接接口有如下对应关系:ALE——PA1WE——PA2WP——PA3R\B——PC0RE——PC1CE——PC2CLE——PC38位IO口对应PE0——PE7下面4个函数&#xff0c;对应的是读取设备的ID&#xff0c;我在main函数里调用函数Nand_Flash_Re…

pat 甲级 1072. Gas Station (30)

1072. Gas Station (30) 时间限制200 ms内存限制65536 kB代码长度限制16000 B判题程序Standard作者CHEN, YueA gas station has to be built at such a location that the minimum distance between the station and any of the residential housing is as far away as possibl…

骑士周游问题

骑士周游问题 问题&#xff1a;在一个 8*8 的棋盘上&#xff0c;马按照“日”字走&#xff0c;给定一个起点&#xff0c;打印出马不重复的走完棋盘64个格子的路径。 解答&#xff1a;递归 回溯 &#xff08;对于任一步&#xff0c;马能走的下一步有8个方向&#xff0c;但是需要…

那些容易遗忘的web前端问题

背景&#xff1a; 年底将至&#xff0c;本人这只才出门的前端菜鸟&#xff0c;终于有空闲的时间来整理一下最近投简历时出现的问题。有的是经常使用但是没有仔细留意造成的&#xff1b;有的是个人认为根本没人使用而忽略的。为了下次不出现这种错误&#xff0c;进行一下总结。…

使用IntelliJ IDEA的原因

介绍 我经常遇到一个问题&#xff0c;为什么我使用Intellij来支持另一个IDE&#xff08;在本例中为Eclipse&#xff09;。 大多数时候&#xff0c;我会通过演示IntelliJ的某些功能并展示一切的集成程度来回答这个问题。 这让我开始思考使用它的真正原因是什么。 这篇文章将试图…

linux光标美化包,使用 [ powerlevel10k ] 美化你的WSL (Linux)

使用 [ powerlevel10k ] 美化你的WSL (Linux)使用 [ powerlevel10k ] 美化你的WSL (Linux)前言关于linux终端的美化&#xff0c;网上的教程有很多&#xff0c;但对于国内的用户来说&#xff0c;效果往往是这样的&#xff1a;教程中通过以下命令安装 oh-my-zshsh -c "$(cur…