首页
学习
活动
专区
圈层
工具
发布

快10年的老前端了,我还分不清 slice 和 splice,这到底是谁的锅

不传参数时,默认到数组的最后截止 传入数字字符串等能被隐式转成数字的,就被直接当成数字处理 传入 1a 这种,通过 parseInt 能变成数字的,被当成是 1 传入完全不能隐式转换成数字的,例如 1A...从目的上来考虑这两种参数方式,我们会发现,其实本质是一样的,都是为了定位起点和终点。然后再进行切割。 可是为什么相似的场景,要使用两种不同的方式?...推断结果就是,这是两个人分别写的 api,因此出现了分歧。而一直使用至今。 除此之外,对于第二个参数值为 undefined 时的处理逻辑不一样。这也从侧面印证了我的猜测。...如果没有传入,则走原 slice 的逻辑。如果传入了,则走原splice 的逻辑。 唯一的一点小瑕疵,就是当我们要走 splice 逻辑时,start end 就成为了必传参数。小瑕疵,忽略不计。...我们常用的工具函数库 lodash,就扩展了许多数组方法,但是是把这些数组方法,挂在 lodash 对象上的,而不是直接在 Array 对象中新增。 其实就是担心使用者乱搞。

56020

【每日精选时刻】毕业三年,月薪30K,我想跟你聊聊;为什么不推荐在对称加密中使用CBC工作模式;线上业务优化之案例实战

点此一键订阅【每日精选时刻】专栏,吃瓜新鲜作品不迷路!...【密码学】为什么不推荐在对称加密中使用CBC工作模式这篇文章是我在公司内部分享中一部分内容的详细版本,如标题所言,我会通过文字、代码示例、带你完整的搞懂为什么我们不建议你使用cbc加密模式,用了会导致什么安全问题...线上业务优化之案例实战 线上后台项目有一个消息推送的功能,运营新建一条通知消息时,需要一起上传一列包含用户 id 的文件,来给文件中包含的指定用户推送系统消息。...很多读者私信问我,自己工作三年多了,随着工作年限的不断增长,感觉自己的技术水平与自己的工作年限严重不符。想跳槽出去换个新环境吧,又感觉自己的能力达不到心仪公司的标准,即使投了简历也没人来通知自己面试。...专注于后端领域,擅长使用 Go 语言,同时也涉略过 Java 和前端技术。在未来,我计划在腾讯云开发者社区分享更多的技术干货,包括我的技术学习心得和在项目开发中的实战技巧。

36541
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    这 11 个前端小知识你不一定知道

    我害怕 JavaScript 的原因,主要是因为很难理解为什么它会以这种方式工作。...为什么?这是因为,当我们调用不带参数的 sort 方法时,JavaScript 会将数组的元素转换为字符串,然后按字母顺序排序,疯狂吧?...由于我在 Java 中使用字符串的经验,这让我感到困惑。 06、Push 函数 我在我的代码中经常使用 push 方法。虽然我最近知道我们也可以使用 push 来合并数组。...知道这一点后,我开始在参数上使用 parseInt(),然后,再将它们传递给 isNaN 函数。 08、对象的动态键 有时我不得不根据 API 响应或某些计算为我的对象分配动态键。...但是您对它了解得越多,您就越了解世界第一编程语言的工作原理。 这是我与你分享的秘诀。 基本操作 > 方法 如果您想让您的代码更快,那么,尝试使用原始操作而不是进行方法调用。

    1.1K20

    【offer 收割计划】你知道为什么 reducer 最好是一个纯函数吗?

    为什么最好是一个纯函数?...value 值,你也可以通过下面这种方式来遍历出对象的 key, value 值,但是这样会相对的麻烦一些,因此不推荐 for ... of 来遍历对象 ✅ for...of 更适合遍历数组,并且它只是遍历数组内的元素...,slice 用来截取数组或字符串 splice 会改变原数组,slice 不会改变原数组 三、为什么有了 indexOf 方法,在 ES7 中还要新增 includes 方法呢?...在之前的 indexOf 方法中存在着一些问题,主要是在于 NaN 的判断上,indexOf 没有办法去判断数组中是否存在 NaN 值,当我们需要判断数组中是否存在 NaN 值的时候,我们需要采用 includes...state 总结 通过这几道面试题,我们复习了 JavaScript 中的循环语句,也区分了 splice 和 slice 而又深入理解 redux 中 reducer 的工作原理,这对我自己来说提升还是很大的

    1.2K20

    一篇文章告诉你React里为什么不能用index作为key

    之前在写react的时候,当我们做map循环的时候,当我们没有一个唯一id来标识每一项item的时候,我们可能会选择使用index data.map((item, index) => { return...{item} }) 但是其实当你使用index来作为唯一key的时候,其实是由一个大坑的,什么坑呢?...reverse,此时神奇的事情发生了,input输入框变成了3,2,1,符合我们的预期,控制台此时打印的也是update; 为什么会这样呢?...当我们传入index作为key时,此时的key为0,1,2, 当我们点击reverse重新排序后,index传进去的key还是0,1,2,此时react比较key=0时,发现只需要更新子节点的值就可以...那说了这么多,其实对于index作为key我们是不推荐的,除非你能够保证他们不会发生变化。 参考文献 index as a key is an anti-pattern

    1.3K40

    10个自己遵循的 JavaScript 技巧和实践,赶紧收藏吧!

    1.使用数字分隔符 当我需要处理大的数字时,这是最常用的运算符之一。当在数字中使用分隔符(只有一个_)时,它看起来比没有分隔的数字要好。...如果忘记了,不会被警告,因为在大多数情况下,它将被JavaScript解析器插入,但依赖于自动分号插入(ASI)是不鼓励的。 谷歌,Airbnb和jQuery的JS风格指南,也推荐使用分号终止行。...通常函数中的变量应该是局部的,这样当你执行完函数时它们就会释放。 4. Delete vs Splice 使用splice而不是使用delete从一个数组中删除一个项。...另一方面,map()可以保持这种清洁,因为你只需要在一个作用哉内工作,仍然可以保持不变性。 Cleaner code - 当做相同的事情时,map几乎总是可以用比for更少的代码来写。...已收录,有一线大厂面试完整考点、资料以及我的系列文章。

    37440

    STL:调用empty()而不是检查size()是否为0

    因为不同容器的empty()实现,一定是耗费常数时间,而size()则不一定。 为此,我查看了我工作环境上的几个容器的empty()实现,分别如下(说明,g++ 7.5.0, c++14)。...既然如此,为什么不推荐使用size() == 0呢? 答案是,list的一些实现,size耗费线性时间,即list独有的splice操作。不过这取决于各家的编译器的实现。...我查看了我的编译器版本上的splice的实现: void splice(iterator __position, list& __x, iterator __first, iterator __last...比如splice()函数内部的_S_distance()函数,由链表的本质可以知道,它一定会遍历,从而耗费线性时间。 那么如果splice的实现中,没有去更新两个链表的size信息呢?...Anyway,可以保证的是,empty()函数,一定是常数时间的性能。 所以,如果在开发中遇到需要判断容器是否为空的时候,推荐大家使用empty(),而不是判断size() == 0。

    1.7K20

    番外特别篇之 为什么我不建议你直接使用UIImage传值?--从一个诡异的相册九图连读崩溃bug谈起

    形势,瞬间变得很紧张,这个问题的优先级瞬间被提到了最高!再次尝试了各种可能的情况.图片大小?它是9张1.5M的图,我就用9张3M的图,也是OK的呀!选取时,顺序有问题?...2.确定是相册选取图片内存过高 这个问题,在真机上,并不好确定,因为连续读取9张高像素图时,内存是瞬间飙升的,你几乎没有机会去观察内存占用,给人一种因为某种逻辑判断而导致的Crash的错觉.如果换做模拟器...resultHandler: 替换 requestImageForAsset:targetSize:contentMode:options:resultHandler: 就可以了,前者是直接返回二进制数据,不渲染...对象传递给 UIImageView的 image属性,当UIImageView加载到父视图时,会引起巨额的内存占用.原因初步猜测是 UIImage 对象显示到 UIImageView 会有一个特殊的耗费内存的操作...我真没想到,一个UIImage对象,竟然会二次引起高内存占用.最终的解决方法,就是在前一个页面传递 NSData数组,在赋值处,再使用imageWithData:转换为 UIImage.这样,内存使用基本没什么起伏

    1.9K70

    闲聊vue版本差异和开发中不太容易注意的点(基础篇)

    v-model vue组件中data为什么一定要是一个函数 prop对象和数组的默认值问题 $parent不太建议频繁使用 具名插槽需要注意的三个点 跨级数据传递 setup watchEffect watch...当需要在数据变化时执行异步或开销较大的操作时,这个方式是最有用的,这是官网的一句总结,我个人觉得比较好的应用场景是当我们需要进行执行异步操作的时候,一般使用watch进行是比较合适的,也就是说computed...,这里几个需要注意的点,因为我个人一直习惯使用的是2.0的版本,所以这里我没有很好的项目例子展示给你们,所以就简单的写一下关于setup比较容易忽略的几个知识点 this为什么不可以被使用 回答这个问题其实是和...value值,因为ref定义的一个变量时响应式的,因为ref本身是一个函数,他返回的是一个对象,那么我们操作值的时候其实是操作的变量本身的value值,但是模板语法进行获取的时候其实是会自动解析value...,比如我现在setup最后return的不是一个对象,而是一个渲染函数,这个时候我还希望我可以使用组件中的属性,怎么办呢?

    1.4K10

    JavaScript中常用的数组方法总结

    当我们想要对数组中的每个元素执行相同的操作,并返回一个新的数组时,可以使用map()函数。它会遍历数组中的每个元素,并将每个元素传递给回调函数进行处理,最后将处理后的结果组成一个新的数组返回。...如果没有找到满足条件的元素,则返回undefined。当我们想要在一个数组中查找满足特定条件的第一个元素时,可以使用JavaScript的find()函数。...thisArg(可选):在执行回调函数时,用作this关键字的对象。 find()函数的工作原理是,它会从数组的第一个元素开始依次遍历,当找到第一个满足条件的元素时,就会停止遍历并返回该元素。...thisArg(可选):在执行回调函数时,用作this关键字的对象。 some()函数的工作原理是,它会从数组的第一个元素开始依次遍历,当找到满足条件的元素时,就会停止遍历并返回true。...concat()和join()函数 当我们需要合并数组或将数组元素连接为字符串时,可以使用JavaScript中的concat()和join()函数。

    50130

    12道vue高频原理面试题,你能答出几道?

    运用场景 运用场景: 当我们需要进行数值计算,并且依赖于其它数据时,应该使用 computed,因为可以利用 computed 的缓存特性,避免每次获取值时,都要重新计算。...当我们需要在数据变化时执行异步或开销较大的操作时,应该使用 watch,使用 watch 选项允许我们执行异步操作 ( 访问一个 API ),限制我们执行该操作的频率,并在我们得到最终结果前,设置中间状态...这种在缓冲时去除重复数据对于避免不必要的计算和 DOM 操作是非常重要的。 然后,在下一个的事件循环“tick”中,Vue 刷新队列并执行实际 (已去重的) 工作。...Vue 组件 data 为什么必须是函数 ? new Vue()实例中,data 可以直接是一个对象,为什么在 vue 组件中,data 必须是一个函数呢?...,这个在渲染和执行被包裹组件的钩子函数会用到,这里不细说 LRU 缓存淘汰算法 LRU(Least recently used)算法根据数据的历史访问记录来进行淘汰数据,其核心思想是“如果数据最近被访问过

    1.6K60

    vue属性data的处理规则

    时,视图中对应的内容也会更新。 Vue的data属性有如下几个运行规则: 1. data属性必须是一个函数,返回一个对象。这个函数会在创建Vue实例时执行,每个实例都会有自己的数据对象。...对于对象或数组类型的属性,在Vue 2.x中需要使用特殊的方法来更新其内容,比如Vue.set和Vue.splice。在Vue 3.x中,可以直接使用原生操作符进行修改,Vue会自动进行响应式更新。...总的来说,Vue的data属性是Vue实现数据响应式的核心。在使用Vue时,我们需要遵循data属性的规则,只有这样才能让Vue正常工作并实现数据与视图的双向绑定。 为什么this....当我们访问该属性时,就会调用get方法返回该属性的值;当我们修改该属性时,就会调用set方法,从而进行响应式更新。...这样,当我们在Vue实例中修改了某个属性的值时,Vue会自动检测到并更新相关的视图,从而实现了响应式更新的效果。

    21600

    分享3种可以终止forEach循环的方式

    面试官:你能停止 JavaScript 中的 forEach 循环吗?这是我在面试中曾被问到的一个问题,我当初的回答是:“不,我不能这样做。”...不幸的是,我的回答导致面试官突然结束了面试,对的,是突然结束的! 我对结果感到沮丧,问面试官:“为什么?实际上可以停止 JavaScript 中的 forEach 循环吗?”...在面试官回答之前,我花了一些时间解释我对为什么我们不能直接停止 JavaScript 中的 forEach 循环的理解。 一、序言 这个问题估计会难倒一部分同学。...将数组元素移除 当满足条件时,使用splice方法将数组内元素移除,也能终止forEach循环。...(i + 1, array.length - i) } }) 三、建议 建议使用for和some 在日常工作中,一般是不会出现一种情况是让你终止forEach循环的,如果有终止的情况,可以使用for

    1.3K10

    Vue是怎样监听数组的变化的?

    上周五跟着一个师姐面试一个三年工作经验的前端开发,我在一边谨慎的观摩。想着曾经我也被别人面试过,如今面试别人,感觉其实心情是一样的。前言工作三年的Vue使用者应该懂什么?为何工作几年的基础越来越弱?...}, set(newVal) { text = newVal; }});data.text // 'vue'data.text = 'react' // 'react'当我们访问或设置对象的属性的时候...,都会触发相对应的函数,然后在这个函数里返回或设置属性的值。...我们当然可以在触发函数的时候做我们自己想做的事情,这也就是“劫持”操作。...参考:前端vue面试题详细解答Vue为什么不能检测数组变动并不是说 JS 不能支持响应式数组,其实JS是没有这种限制的。

    52430

    当裸辞遇到面试难,这些面试题你需要了解一下

    方便找工作的小伙伴每日都会有新的收获。本文就是小编将前期的一些比较经典的每日一题进行了梳理,欢迎大家一起来看看。...] } 但是在chrome控制台中输出 [empty × 2, 1, 2, splice: ƒ, push: ƒ] 很奇怪,为什么会输出这样呢?...我们可以用二进制去推理一下: 假设有4只小鼠,分别是甲乙丙丁,使用二进制来表示小鼠喝药的顺序,1代表喝药,0代表不喝药 甲: 1111 1111 0000 0000 乙: 1111 0000 1111...先来解释一下第一个,为什么不是输出18呢,虽然func()是在foo函数里面调用的,但是并没有显式指明作用域,这时候会使用默认作用域window,而对于浏览器来说,在全局通过var声明的变量会自动挂载到...'] // 输出 我是子君 console.log(arr[0]()) 我们通过arr[0]获取到函数,这时候函数的作用域就是这个数组,所以再调用的时候,this就是arr, 所以this[1]就是数组第二项

    35430

    【Vuejs】778- 超全 Vuejs 知识点(基础到进阶)

    : 当我们需要进行数值计算,并且依赖于其它数据时,应该使用 computed,因为可以利用 computed 的缓存特性,避免每次获取值时,都要重新计算; 当我们需要在数据变化时执行异步或开销较大的操作时...为什么 v-for 和 v-if 不建议用在一起 当 v-for 和 v-if 处于同一个节点时,v-for 的优先级比 v-if 更高,这意味着 v-if 将分别重复运行于每个 v-for 循环中。...vm.items.splice(indexOfItem, 1, newValue) 复制代码 第二类问题,可使用 splice: vm.items.splice(newLength) 复制代码 当你利用索引直接设置一个数组项时...更快速:利用 key 的唯一性生成 map 对象来获取对应节点,比遍历方式更快 为什么不建议用index作为key不建议 用index 作为 key,和没写基本上没区别,因为不管你数组的顺序怎么颠倒,index...在 Vue 实例中编写生命周期 hook 或其他 option/properties 时,为什么不使用箭头函数 ? 箭头函数自已没有定义 this 上下文中。

    3.5K51

    Vue是怎样监听数组的变化的?

    上周五跟着一个师姐面试一个三年工作经验的前端开发,我在一边谨慎的观摩。想着曾经我也被别人面试过,如今面试别人,感觉其实心情是一样的。 前言 工作三年的Vue使用者应该懂什么?...为何工作几年的基础越来越弱? 工作如何挤出时间学习? 一道面试题 其实我们并不是要你把答案都记下来,而是把其中的思想学习到。就像你接触一个新的领域react,你也一样可以把基本思想提炼出来。...,都会触发相对应的函数,然后在这个函数里返回或设置属性的值。...我们当然可以在触发函数的时候做我们自己想做的事情,这也就是“劫持”操作。...Vue为什么不能检测数组变动 并不是说 JS 不能支持响应式数组,其实JS是没有这种限制的。 数组在 JS 中常被当作栈,队列,集合等数据结构的实现方式,会有批量的数据以待遍历。

    60620

    比较JavaScript中的数据结构(数组与对象)

    大家都说简历没项目写,我就帮大家找了一个项目,还附赠【搭建教程】。...事实并非如此,让我们看一下使用unshift方法时会发生什么: image.png 在上图中,当我们使用unshift方法时,所有元素的索引应该增加1。这里我们的数组个数比较少,看不出存在的问题。...访问对象中的值的一种方法: student.class 在对象中添加,删除和查找的复杂度为O(1)???那么我们可以得出结论,我们应该每次都使用对象而不是数组吗? 答案是不。...当哈希函数返回一个哈希值,该哈希值转换为多个键的相同地址空间时,就会发生这种情况。 因此,多个 key 被映射到相同的地址空间。...总结一下,当我们想执行诸如添加,删除和访问元素之类的操作时,可以使用对象,但是在使用对象时,我们需要谨慎地遍历对象,因为这可能很耗时。

    6.8K30
    领券