空白字符难看见，写个方法来避免

FuncJin
351 阅读3分钟

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第18天，点击查看活动详情

目录

今日题

  1. 题目
  2. 分析 昨日题
  3. 题目
  4. 答案
  5. 解析 结语

今日题

题目

现在的web也不知怎的input已经成为了必需品。我们通过某种事件拿到用户输入的值以后，这个值通常是不可预测的，比如sql注入等等，所以我们需要对用户的输入进行一番处理，幸好JavaScript自带了一些处理输入的方法，比如字符串的trim方法，而这个方法最主要的功能就是清除字符串两端的空格，既然听起来这么带劲，那干脆今天就来实现String.prototype.trim方法

const str = "   Hello World  "
const res = str.trim()
console.log(str)
console.log(res)

分析

使用原生的trim方法，res的值是"Hello World", 我们能看到trim方法已经帮我们把str前后的空格给清除了，但是通过打印str我们可以发现str本身并没有发生任何改变，这是我们所需要注意的

昨日题

题目

封装自己的函数，用来将数组转换为链表

若无特殊说明，本文章中所有链表均以单向链表为例

答案

无固定答案, 下面仅展示部分写法：

function toLinkedList(arr){
    let linkedList=null
    class Link{
        constructor(value,next=null){
            this.value=value
            this.next=next
        }
    }
    function searchNext(link,value){
        if(link.next==null){
            link.next=new Link(value)
        }else{
            searchNext(link.next,value)
        }
    }
    let Iterator=arr[Symbol.iterator]()
    let pointer=Iterator.next()
    if(arr.length) linkedList=new Link(pointer.value)
    while(!pointer.done){
        pointer=Iterator.next()
        searchNext(linkedList,pointer.value)
    }
    return  linkedList
}

解析

链表是算法和数据结构中最基础也是最重要的一个知识 我们现在就来看一下应该怎么理解它

在toLinkedList中，先定义了一个指向null的linkedList和一个函数以及一个class，我们先不管它们，继续往下看

let Iterator=arr[Symbol.iterator]()
let pointer=Iterator.next()

arr[Symbol.iterator]()的结果是返回一个迭代器，迭代器的next方法上有两个属性value和done，让我们继续向下

if(arr.length) linkedList=new Link(pointer.value)

在传入的arr不为空时，创建一个Link节点赋值给linkedList，Link节点具有两个属性value和next 此时，linkedList的value为arr[0],next为null

while(!pointer.done){
    pointer=Iterator.next() //(1)
    searchNext(linkedList,pointer.value)    //(2)
}

然后，在迭代器pointer.done不为true的情况下，循环内首先更新pointer的值(1) 接着将具有arr[0]的linkedList和pointer.value传入函数searchNext中，下面我们看一下searchNext都做了些什么

function searchNext(link,value){
    if(link.next==null){
        link.next=new Link(value)   //(1)
    }else{
        searchNext(link.next,value) //(2)
    }
}
  • 在searchNext中，首先判断传入的linkedList.next是否为空，在第一次循环的时候link.next是为null的，所以link.next会挂载一个新的Link节点,并且值为传入的value
  • 但是，searchNext中，只有第一次执行时，if才会成立，当第二次循环，重新进入searchNext时，此时linkedList.next已经挂载了一个新的Link节点了
  • 所以执行else部分，也就是(2)，这里产生了一个递归调用，这个递归的出口if成立
  • 函数searchNext最终一定会给link.next挂载一个新的，有值的Link节点,这里不清楚的话，推荐debugger,观察每次执行后，linkedList.next的变化
  • 当循环全部执行完成后，也就到了最后一步
return  linkedList

将已经完成保存了结果的linkedList返回出去

结语

此文章已收录至《JavaScript每日一题》专栏，如果你对本专栏有任何建议，欢迎反馈。如果你对此文章中的题目还有不懂的地方，那么请在评论区留言与大家一起讨论吧。 创作不易，少年，就请留个赞再走吧！

avatar
文章
阅读
粉丝