写代码的一些收获和思考

二维数组创建的疑惑

js或者ts创建一个二维数组有很多方法,相信很多刷leetcode的伙伴都遇到过,可是我最近碰到了一些令人烦恼的问题。

最长重复子数组中,我尝试用动态规划解决这个问题,dp数组需要初始化,写的代码类似于

const arr1 = new Array(3).fill(new Array(4).fill(0))

可是后面测试的时候,我傻了眼,只要是某个数据修改了,最后返回值就对不上。很奇怪,在 ts playground 测试的时候才发现了问题所在

 const arr1 = new Array(3).fill(new Array(4).fill(0))
 const arr2 = Array(3).fill(null).map(item => Array(4).fill(0))

 arr1[0][2] = 5
 arr2[0][2] = 6

 console.log(arr1, arr2)

输出结果是:

写代码的一些收获和思考

前两行log的内容是两个数组初始化的值,第三行是修改后的值,问题就在于 Array.prototype.fill() – JavaScript | MDN (mozilla.org) 上面,感兴趣的同学可点击去看看这个api,其中有这样一个测试用例

// 一个简单的对象,被数组的每个空槽所引用
const arr = Array(3).fill({}); // [{}, {}, {}]
arr[0].hi = "hi"; // [{ hi: "hi" }, { hi: "hi" }, { hi: "hi" }]

直接fill引用类型的数据,会导致一处修改,多处变动的问题。解决方式也很简单,可使用map或者Array.from,例如

const arr = Array.from(new Array(m), () => Array(n).fill(0))

正则表达式

正则表达式这个源自于我的一个需求,我需要高亮一些数据,但是后端返回了整体内容和需要高亮的数组,我需要自行切片,然后设置高亮的颜色,举个例子,我想把vue3替换为Angular

写代码的一些收获和思考

数据正常替换了,可是如果我是从后端接收的数据,直接这样替换就会失败,比如

写代码的一些收获和思考

解决的方式是声明一个 (RegExp(正则表达式) – JavaScript | MDN (mozilla.org)

写代码的一些收获和思考

数组随机抽取固定数量的不重复数据

关于这个问题,我最先想到的思路是范围内随机生成数字,然后数组进行删除操作,重复这一动作,直到达到获取数量,返回抽取的内容

function randomSelect<T>(arr: T[], n: number): T[]{
   const res: T[] = []
   
   while(res.length < n){
     const index = Math.floor(Math.random() * arr.length)
     res.push(arr[index])
     arr = arr.filter((_item,i) => i !== index)
   }

   return res
}

写代码的一些收获和思考

后面被导师review代码之后,指出这个代码效率很低,而且会修改原数组,除非刚开始进行了深拷贝,不过数据量比较小可能问题不太大,如果数据量达到了上万条,进行一次深拷贝花费的时间就不能轻视了,尤其是数据还是那种复杂对象。导师给了新的思路,通过Set解决这个问题,随机生成数字,set没有就添加,直至达到要求输出的数量。

function randomSelect<T>(arr: T[], n: number): T[]{
    const set = new Set<number>()

    while(n !== set.size){
        const num = Math.floor(Math.random() * arr.length)
        if(!set.has(num)){
           set.add(num)
        }
    }

    return arr.filter((_item,index) => set.has(index))
}

写代码的一些收获和思考

Event Stream

这个是最近写需求的时候发现的内容,返回值的content-typetext/event-stream

写代码的一些收获和思考

这就让我感觉有点摸不着头脑了,本身这个后端接口可一次查询多个相关数据,但是写angular的时候,我post请求正常传值却控制台报错

去网上查了资料才知道,这时候要修改返回值的类型了(一般为string

写代码的一些收获和思考

感兴趣的同学可以去看下 这篇文章

原文链接:https://juejin.cn/post/7218379300504420389 作者:笨笨狗吞噬者

(0)
上一篇 2023年4月5日 下午4:05
下一篇 2023年4月5日 下午4:15

相关推荐

发表评论

登录后才能评论