![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
【前端】JS相关知识
文章平均质量分 84
溜溜的阿溜
一个进击的前端小菜鸟
展开
-
常见JS手写代码系列总结2
JS手写系列2JS常见手写代码题(一)JS常见手写代码题(二)32个手写JS_单眼皮的小熊-CSDN博客promise、promise.all、promise.raceinstanceof手写一个ajax闭包cache浅拷贝、深拷贝字符串转驼峰图片懒加载滚动加载一、手写一个Promise完整解析:https://zhuanlan.zhihu.com/p/103651968function Promise(executor) {let self = thisthis.st原创 2021-07-08 10:52:59 · 394 阅读 · 0 评论 -
常见JS手写代码系列总结1
JS手写系列1参考文章:JS常见手写代码题(一)【javascript】手写call,apply,bind函数以下为一些常见的js手写代码系列callapplybindnew数组扁平化数组去重原型继承一、JS实现一个call方法或函数fun.call(obj, 参数1,参数2,…),第一个值是改变this指向到obj,后面是参数队列,调用call立即执行方法funcall的定义和用法// call方法第一个参数指的是this的指向;接受一个参数列表;方法立即执行// Fu原创 2021-07-08 10:51:37 · 577 阅读 · 0 评论 -
JS基础知识点总结2(深浅拷贝、set\map、内存泄露)
JS小知识点2(深浅拷贝、set\map、内存等)这里总结了一些JS中的基础概念深拷贝、浅拷贝Set 和 Map 数据结构内层泄露一、深拷贝、浅拷贝js浅拷贝与深拷贝的区别和实现方式简单理解:JS中,基础数据类型存放在栈中,引用数据类型存放在堆中,而栈中存放的只是指向堆中的值的指针;如果我们复制一个引用数据类型,只是复制了指针,其实指向的是同一个值,那么通过一个指针改变值,另一个也会跟着改变。深拷贝与浅拷贝,简单点来说,就是假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟原创 2021-07-08 10:49:58 · 941 阅读 · 0 评论 -
JS基础知识点总结1(闭包、冒泡、call、for in、变量函数提升)
JS小知识点1(闭包、冒泡、call、for in、变量函数提升)这里总结了一些JS中的基础概念,包括闭包、冒泡等等,面试常常问到的闭包与作用域事件冒泡call、apply、bindfor in和for of的区别和用法变量声明提升、函数提升一、闭包与作用域1、说明:在js作用域环境中访问变量的权利是由内向外的,在外层作用域下无法获取内层作用域下的变量闭包有3个特性:①函数嵌套函数②函数内部可以引用函数外部的参数和变量③参数和变量不会被垃圾回收机制回收好处①保护原创 2021-07-08 10:47:21 · 182 阅读 · 0 评论 -
正则基本用法总结
正则正则表达式(Regular Expression)是一种文本模式,包括普通字符元字符,用于字符串操作,比如查找、匹配等基础用法、各符号的意义,不再赘述,看文章即可:正则 · 语雀一、表达形式://构造函数var reg = new RegExp('along','img')console.log(reg) --> /along/gim//字面量方式var reg = /a/ console.log(reg) --> /along/gim//工厂模式var原创 2021-07-08 10:43:43 · 238 阅读 · 0 评论 -
事件循环(栈与堆、宏任务、微任务)
事件循环(栈与堆、宏任务、微任务)参考资料:44.理解事件循环一(浅析) · Issue #47 · ccforward/cc45.理解事件循环二(macrotask和microtask) · Issue #48 · ccforward/cc一、理解事件循环1、栈stack与当我们调用一个函数,它的地址、参数、局部变量都会压入到一个 stack 中2、heap(堆)当函数执行完毕后本地变量会从 stack 中弹出,这只有在使用 numbers string boolean 这种基本数据类型时转载 2021-07-08 10:40:20 · 310 阅读 · 0 评论 -
js函数节流与防抖
一、节流(throttle)与防抖(debounce)的含义节流:指连续触发事件但是在 n 秒中只执行一次函数。即 2n 秒内执行 2 次,3n秒内执行3次… 。节流如字面意思,会稀释函数的执行频率。使用场景:dom元素拖拽,搜索联想等等防抖:连续的事件响应我们在n秒内只执行一次回调。如n秒内触发6次,只在最后一次再执行回调。使用场景:文本输入验证二、简单实现节流:function throttle(fn,wait){ // 首先获取调用throttle时的一个时间戳作为触发时时间,实现原创 2020-12-21 18:32:54 · 326 阅读 · 0 评论 -
lodash中的get方法
lodash中使用频率最高的,应该就是_.get()方法去根据路径获取对象的值了。他的使用方式非常简单:_.get(object, path, [defaultValue])// 根据 object对象的path路径获取值。 如果解析 value 是 undefined 会以 defaultValue 取代。这样我们可以使用如:.get(object, ‘a[0].c’, ‘default’); 获取对象n级路径下的值,如果中间路径值为空,返回默认值,以免直接使用a[0].c时因a[0]为und.原创 2020-12-18 16:40:59 · 20379 阅读 · 1 评论 -
[译]JavaScript 的面向切面编程
原文地址:Aspect-Oriented Programming in JavaScript原文作者:Fernando Doglio译文出自:掘金翻译计划本文永久链接:https://github.com/xitu/gold-miner/blob/master/article/2020/aspect-oriented-programming-in-javascript.md译者:Liusq-Cindy校对者:Chorer、nia3yJavaScript 的面向切面编程我们都知道面向对..翻译 2020-12-09 11:34:50 · 250 阅读 · 0 评论 -
Browser 对象实用基础
学习JS时,大家通常会对dom对象投入更多的精力,而容易忽略browser对象。确实Broswer对象的使用频率不高,但了解一些实用的基础是非常有必要的。window对象 —— 表示浏览器中打开的窗口navigator对象 —— 包含有关浏览器的信息screen对象 —— 包含有关客户端显示屏幕的信息history对象 —— 包含用户(在浏览器窗口中)访问过的 URLlocation对象 —— 包含有关当前 URL 的信息存储对象 —— sessionStorage、localStorage原创 2020-12-01 18:04:19 · 815 阅读 · 0 评论 -
阻止滚动穿透:弹窗显示时,让背景页面禁止滚动
问题描述在显示弹窗时,如果底部页面可滚动,可能在弹窗显示时,滚动鼠标,会发生滚动穿透,让底部页面也一起滚动了。这种用户体验是不太好的,怎么能阻止滚动穿透呢?解决思路让弹窗显示时,阻止背景的滚动事件,弹窗关闭时,重新恢复背景的滚动示例(vue)<div>原背景页面</div>// 假设如下是一个简略的弹窗元素<div v-if="showDialog"...原创 2020-04-13 14:41:19 · 3018 阅读 · 1 评论 -
离开页面时,让浏览器提示指定的信息onbeforeunload
想要在离开页面时,让浏览器弹窗提醒提示信息,可以加上window.onbeforeunload事件// onbeforeunload事件window.onbeforeunload = function (e) { e = e || window.event; if (e) { e.returnValue = '离开页面,答案不会保存'; ...原创 2020-04-10 16:45:54 · 3204 阅读 · 0 评论 -
正则校验:去除带整数和小数的数字前后多余的0和多余小数点
对于用户输入的 0003.4000这种数字,其实我们需要的就是3.4,多余的0不仅视觉上不好看,在存储时也很不方便。怎么让我们在用户完成输入后,清除掉这些无用的0数字呢?此外,对于输入了2.3.3多个小数点这种错误字符,value为空,但输入框未清空,需要手动清空方案:在@blur鼠标失焦事件中,触发正则校验,将输入的内容和过滤掉这些多余的数字0,方法如下:<el-input...原创 2020-04-02 20:03:24 · 3366 阅读 · 0 评论 -
多个输入框联动校验:怎么让一个输入框改动,触发另一个校验?
在项目的表单输入中,可能会遇到这种情况,我们需要限制一个最大最小值的范围。如文本可范围:最小值:【】- 最大值:【】这两个分别绑定了两个字段,拥有自己的校验方式,当最小值大于最大值时,两个都会报错。怎么让我们修改其中一项,就能够让两个表单都校验,而不需要我们再手动触发一下再校验呢?解决方案如下<el-form ref="limitCommit" :rules="number...原创 2020-04-02 19:49:36 · 5630 阅读 · 5 评论 -
input设置了type为number,但是还能输入e等符号,怎么处理?
在vue项目中我们发现,给input标签设置了type=number之后,输入框还是可以输入±以及e的情况,这是由于这些符号都属于数字范围,e指的是指数。如果项目有特殊需求,禁止输入这些符号,我们可以怎么做呢第一个想到的方法:普通正则处理在v-model中绑定元素,通过正则判断,在输入失焦时替换调这些元素。这种方法网上随便找找就行,但是这样很不直观,对用户来说是多了一步。那么怎么在根源上...原创 2020-04-02 19:33:14 · 3892 阅读 · 1 评论 -
基于el-upload实现上传下载excel文件
基于el-upload组件实现上传下载excel文件在vue项目中,使用了element组件,要基于其中的下载组件el-upload实现上传和下载excel的功能,发现element官网上的说明说的很不清楚,找了很多资料和实践后,总结了以下的用法。element官网中el-upload: el-upload说明主要实现两部分,一是上传文件,基于el-upload;二是下载文件,这个根据具体...原创 2019-11-22 16:00:32 · 5377 阅读 · 1 评论 -
数组有关API及知识点
(懒得在这边重新布局了,可直接看分享的链接http://note.youdao.com/noteshare?id=c2cc91874bbaab02b873b03712c07af6&sub=A7D6B08931BA429E8BFF2FADC6D98731)前言:工作中涉及了很多数组的操作,以下一一罗列出常用的操作API及一些知识点,以供熟悉和查询,提高效率。更全面的数组API及Array...原创 2019-02-22 23:07:20 · 255 阅读 · 0 评论 -
字符串、对象有关API及知识点
带排版可见分享链接:http://note.youdao.com/noteshare?id=c371d11b9c2847f2dd987eef7f0f988a&sub=51D1397F61B54866B91EA038693E620F字符串API前言:字符串的操作也尤为重要。以下简单列出了一些常用的字符串操作API,具体的解释可见http://louiszhai.github.io/2...原创 2019-02-22 23:42:57 · 176 阅读 · 0 评论 -
ES6最基础和常用的知识点
原创 2019-02-23 00:15:32 · 140 阅读 · 0 评论 -
事件冒泡及阻止冒泡
事件冒泡: 当一个元素上的事件被触发的时候,如果它的父集元素也绑定了同样的事件,(比如说鼠标点击一个按钮),那么所有父集元素的事件将会一个个被触发,这一过程被称为事件冒泡(这个事件从原始元素开始一直冒泡到DOM树的最上层。)在实际运用中,如果我们只想触发子元素的事件,并不想触发其父元素的同名事件时,就需要阻止冒泡,即取消这种机制 w3c的方法是:(火...原创 2018-07-11 22:25:33 · 500 阅读 · 0 评论 -
输入框input、textarea有关零碎知识点
前言:在日常使用过程中,经常会与输入框打交道,里面涉及了很多零碎的知识点,没掌握好可能会花很多的时间在调输入框的样式、绑定输入框值、过滤等问题上。以下不详细讲表单<form>,(可查W3手册),而是具体罗列了<input>标签和<textarea>标签的相关零碎知识点以供记忆和查询。 一、<input>输入框1、标签属性H5...原创 2019-02-22 22:57:21 · 3003 阅读 · 0 评论