我猜这两题你不会(map-parseInt,memo_add)

引言

这篇文章将为大家带来两个面试热题,希望大家看完有所收获。

map-parseInt

面试官:请问下面这段代码的结果是?

js 复制代码
console.log([1,2,3].map(parseInt));

好好好,代码虽短,却可以让你很懵逼,硬着头皮回答 1,2,3

聪明人都知道,答案肯定不是1,2,3,那么接下来让我们来深度剖析一下。

解题碰到不清楚怎么办?最好的方法就是看文档!这里我推荐(MDN)

我们先来看官方文档的描述:

map

map() 方法是一个迭代方法。它为数组中的每个元素调用一次提供的 callbackFn 函数,并用结果构建一个新数组。

我们已知map()方法是一个迭代方法,所以对于1,2,3中的每一个元素都会调用一次。

再来看语法,我们这里用到的语法是map(callbackFn),对于里面的参数,为数组中的每个元素执行的函数。它的返回值作为一个元素被添加为新数组中。该函数被调用时将传入以下参数:

  • element

  • 数组中当前正在处理的元素。

  • index

  • 正在处理的元素在数组中的索引。

  • array

也就是说,1,2,3在调用map()方法时,会先迭代,将数组中的每一个元素构成一个由[element,index,array]组成的数组,再将这个新数组作为参数传入map()中的parseInt方法中。

parseInt

那我们再来看看parseInt方法,同样,我们在文档中查看parseInt方法

先看语法:

scss 复制代码
parseInt(string, radix);
  • string

  • 要被解析的值。如果参数不是一个字符串,则将其转换为字符串 (使用 ToString抽象操作)。字符串开头的空白符将会被忽略。

  • radix_ 可选_

  • 236 的整数,表示进制的基数。例如指定 16 表示被解析值是十六进制数。如果超出这个范围,将返回 NaN。假如指定 0 或未指定,基数将会根据字符串的值进行推算。注意,推算的结果不会永远是默认值 10!文章后面的描述解释了当参数 radix 不传时该函数的具体行为。

我们将map()返回的数组【1,0,1,2,3】(拿1来举例子)作为参数传入parseInt中,

string = 1

radix=0(默认为十进制)

结果为1,我们再将由2组成的数组【2,1,1,2,3】传入parseInt,

string=2

radix=1

注意,我们这里的进制为2-36 ,超出进制了,所以结果为NaN,最后来看3

string = 3

radix =2

二进制中出现了3,结果当然也是NaN 所以这道题的答案为1,NaN,NaN

memo_add

面试官:请你写一个函数,返回两个数的和


我提笔就狠狠地写你这小题

js 复制代码
function add(a,b){
    return a+b
}

面试官说:你走吧~不用来了... 那我们该怎么写呢?

1.永远不要相信用户的输入

不是吧,阿sir?你怎么不按套路出牌,我明明叫你输入两个数字的...没办法,用户是上帝。所以我们必须添加类型判断和参数个数的判断:

js 复制代码
function add(a, b) {
    //...代表参数
    if (arguments.length != 2) {
        throw new Error('参数错误')
    }
    if(typeof a!= 'number' || typeof b!='number'){
        throw new Error('请传入整数')
    }
    return a + b;
}

做完这步,看向面试官,他还是一脸不屑的表情...

2.记忆函数

我们来想想,要是我们重复调用add(),并且调用同一个(a,b)参数,那么我每次调用add()方法,都要重新计算一次,那么我们能不能把运算过的结果存储起来,在进行调用时,先搜索一下,我们是否计算过,如果计算过,那就直接输出。

直接上代码:

js 复制代码
function memoize(fn){
    if(typeof fn != 'function'){
        throw new Error('请传入函数')
        
    }
    var cache = {}//key:value O(1) 空间换时间
    return function(){
        //唯一性 arguments是伪数组,没有join方法
        var key = arguments.length + Array.prototype.join.call(arguments,',');
        console.log(key);
        if(key in cache){
            return cache[key]
        }else{
            return cache[key] = fn.apply(this,arguments)
        }
        
    }
}

先传入一个函数方法当作参数并进行判断,然后定义一个对象cache,接下来返回一个方法 在方法中,我们要向cache中添加键值对,key有一个固定的格式,如果是(a+b),那key就是2a,b ,我们拿到key,首先在cache中查找是否计算过,如果没有,将keyvalue存入cache。用空间换时间,大大减少时间损耗。

写到这里,再来看看面试官:

结尾

本篇内容全是知识,没有水分,愿陪伴大家一起成长,一起进步...

相关推荐
小林ixn17 分钟前
从 onclick 到 React 合成事件,再到完整应用逻辑:一次前端架构的深度剖析
前端·react.js·前端框架
Csvn1 小时前
🧩「找不到模块」排查全记录——Monorepo 下 TypeScript 路径别名的 5 种「不通」与根治方案
前端
腻害兔1 小时前
【若依项目-产品经理视角】RuoYi-Vue-Pro 源码拆解:字典、短信、邮件、通知——后台系统的“基础设施四件套“!
java·前端·vue.js·产品经理·ai编程
CodexDave1 小时前
MySQL事务隔离级别与MVCC机制解析
前端·数据库·mysql·nginx·性能优化·负载均衡
Ai_easygo2 小时前
AI Agent开发入门——从ReAct到Tool Calling,拆解Agent的底层运行逻辑
前端·人工智能·react.js
研☆香2 小时前
分析制作html页面,如何划分页面结构
前端
腻害兔3 小时前
【若依项目-产品经理视角】RuoYi-Vue-Pro 源码拆解:支付模块 yudao-module-pay,一个让产品经理都看懂的支付中台设计
java·前端·vue.js·产品经理·ai编程
kyriewen3 小时前
我扒了最近的前端面经——2026年面试不背八股文了,考这5样
前端·面试·ai编程
IT_陈寒3 小时前
Redis的持久化配置把我坑惨了:你以为数据安全了?
前端·人工智能·后端
小徐_23333 小时前
uni-app 项目别再从零搭了!3 个 Wot UI 起手模板怎么选?
前端·uni-app