js基础
文章平均质量分 63
js基础巩固
bug丸
写文章主要是想记录下自己的学习,帮助自己梳理知识,可以如果有错误的地方欢迎指出。如果觉得有收获,可以让我满足下我的的虚荣心,点个赞
展开
-
从数据类型到变量、作用域、执行上下文
数据类型与检测数据类型的方法;什么是深克隆与浅克隆,怎么实现深浅克隆,JSON克隆的弊端,手写深克隆;预编译规则、变量声明与存储,var、let、const声明变量的特点与区别;什么是执行上下文、作用域及作用域链原创 2024-08-18 18:36:00 · 671 阅读 · 0 评论 -
原型与原型链与继承
构造函数创建实例的过程1.创建一个新对象2.将空对象的__proto__指向构造函数的原型3.修改构造函数中this指向,将构造函数中的this指向实例对象,执行构造函数中的代码,给这个新对象添加属性和方法(通过call/apply)4.返回新对象(实例对象)原创 2024-08-14 22:59:41 · 1130 阅读 · 0 评论 -
defineProperty、seal、freeze的使用与联系
不同于 Object.freeze() 的是,通过 Object.seal() 密封的对象可以更改其现有属性,只要它们是可写的。不能添加新属性、不能删除现有属性或更改其可枚举性和可配置性、不能重新分配其原型。只要现有属性的值是可写的,它们仍然可以更改。原理上:阻止对象的扩展,然后将现有的属性描述符更改为configurable: false。非对象参数将按原样返回,不会有任何错误,因为根据定义,基本类型已经是不可变的。只能对现有属性进行读取和需修改,不能添加新属性也不能删除已有属性。简单模拟freeze。原创 2023-09-02 21:55:01 · 180 阅读 · 0 评论 -
break、continue、return的使用与区别
break和continue都是用来控制循环结构的,主要作用是停止循环它俩的区别:1》break是跳出整个循环,continue是跳出当前循环,继续进行下一个循环2》continue语句只用在for、while、do-while等循环体中, 常与if条件语句一起使用, 用来加速循环;break还可以在switch分支语句中使用,遇到break,就会跳出switch语句函数中使用,函数遇到return就会立即停止执行并退出;后面可以跟函数的返回值,如果不跟就返回undefined;原创 2022-11-17 22:49:24 · 5052 阅读 · 1 评论 -
浏览器缓存--cookie、sessionStorage、localStorage、indexedDB
cookie、sessionStorage、localStorage的特点及基本使用,它们之间的区别原创 2022-11-14 22:51:55 · 1603 阅读 · 0 评论 -
3种实现文本复制功能的方法
navigator.clipboard.writeText()将指定字符串写入剪切板中,返回一个promise对象。如果是input的话可以用,普通的元素不能用,而且select会选中内容,有选中的效果。只有在用户事先授予网站或应用对剪切板的访问许可之后,才能使用异步剪切板读写方法。本地没问题,但是当嵌入到iframe中,复制直接报错了;往输入框内输入内容后点击复制,就可以复制了。给iframe添加allow属性。这种方法不建议使用,已过时。......原创 2022-07-28 22:42:23 · 1003 阅读 · 0 评论 -
前端下载文件流
这种方式不能在下载时名命文件,需要后端设置文件名二、a标签下载a标签的download属性,ie浏览器是不支持的请求的时候记得加responseType为blob,不然下载后点开是空白文件前端可以对文件名命如果我们要使用后端返回的文件名(一般都在content-disposition中)blob、MIME相关补充基本语法blob表示二进制大对象(binary larget object),是js对不可修改的二进制数据的封装类型,主要用于存储二进制大对象,例如可以存储图片,音视频等文件;它的数据可以原创 2022-06-26 11:23:53 · 7003 阅读 · 0 评论 -
变量、作用域与内存
变量、作用域与内存数据类型基本数据类型(原始值)1》undefined2》null3》booleantrue、false4》string字符串不可变:想要修改某个变量中字符串的值,就必须销毁原来字符串,然后将新值保存到该变量5》number6》symbol复杂数据类型Object----对象我们的变量可能存储的时基本数据类型,基本类型存储在栈中,此时的变量类型就是原始值,也有可能存的是复杂数据类型,复杂数据类型存放在堆中,此时变量名存的是对应复杂数据的引用地址深克隆与浅克隆:原创 2022-05-04 19:17:01 · 208 阅读 · 0 评论 -
this指向问题
this的指向全局作用域中的this指向它本身函数中的this函数中this的指向,实在函数被调用的时候确定的函数被调用时,会产生一个执行上下文,执行上下文被创建的时候会做几件事情:创建变量对象;确定作用域链,确定this指向在函数执行过程中,this一旦被确定,就不可更改了 var name = "kaka"; var obj = { name: "lulu" }; function test1() { this=obj // 报错 Unc原创 2022-04-28 22:22:56 · 200 阅读 · 0 评论 -
event事件知识整理
事件事件流事件冒泡从最具体的元素(文档树中最深的节点)开始触发,然后上传播事件捕获从最不具体的节点最先接收到事件,最具体的节点最后收到事件dom事件流事件流分为三个阶段:事件捕获=》到达目标事件=》事件冒泡事件的目标在捕获阶段捕获接收到事件,因为到达目标元素前就结束捕获了事件处理程序 <style> .dad { background-color: aqua; width: 200px; height: 200原创 2022-04-16 21:48:16 · 1280 阅读 · 0 评论 -
数据类型及深拷贝、浅拷贝
数据与变量数据类型类型分类简单数据类型(基本类型)1)布尔值Boolean: true / false2)数值型Number: 所有数字3)字符串String: 带引号4)Undefined5)Null复杂数据类型(引用类型)对象 Object数组 Array函数 Function数据类型检测typeOf返回相关数据类型的字符串可以检测 Boolean Number String Undefined Function不能检测 Null ,返回Objectinst原创 2021-06-10 21:32:56 · 562 阅读 · 0 评论 -
正则表达式
正则表达式作用1.用途:匹配字符串的字符组合(可进一步对字符串增删改查)2.使用场景匹配:验证表单过滤:过滤敏感关键词提取:截取字符串创建正则表达式1.利用构造函数Regexp创建var exp1=new RegExp(/表达式/)2.利用字面量创建var exp2=/表达式/正则表达式的方法**test():**检测一个字符串是否匹配某个正则表达式,如果匹配成功,返回true,否则返回false;返回一个布尔值,作用有点类似域includesregexpObj.test(原创 2022-04-15 22:24:43 · 261 阅读 · 0 评论 -
数组基础知识整理
创建数组使用Array构造函数let arr=new Array("健康","暴富") // ["健康","暴富"]let arr=new Array(3,4) // [3,4]let arr=new Array(3) // 长度为3的空数组,arr.length:4;arr[1]:undefined使用字面量let arr=[1,2,3] ES6中Array.from()将类数组转为数组 ;Array.of() 将一组参数转换为数组实例原创 2022-04-10 20:53:52 · 348 阅读 · 0 评论 -
数组去重、过滤处理
数组去重、过滤都是基本数据类型方法1:filter() + indexOf()indexOf 返回第一个符合要求的元素索引;找到第一个全等于传入值的元素后,就会结束查找,返回索引;所以可以达到去重的效果 const arr = [1, 1, "apple", 2, "apple", "banana", "banana"]; const newArr = arr.filter((item, index, array) => { return array.indexO原创 2022-04-09 21:35:44 · 963 阅读 · 0 评论 -
实现页面跳转的方法
实现页面跳转的方法1 前端路由(真实跳转)router-view主要用来构建单页面应用,使用url中的hash来匹配路由地址,根据匹配到不同的路由,显示不同页面(组件)可以有多个子路由router-link跳转到About点击了页面中 ”跳转到about“这几个字后,就会跳转到 to 对应的路由地址 “/about”router.push() 或者 router.replace()2 对话框(假跳转)通过对话框实现跳转效果的话,需要将对话框布满整个屏幕,遮住原来页面,达到假跳转可以原创 2021-05-26 22:33:00 · 2791 阅读 · 0 评论 -
常用的数字处理方法
数字处理toFixed()语法:number.toFixed(需要保留几位小数)作用:四舍五入,保留几位小数参数:需要保留几位小数,就传入数字几;如果不传的话就是取整了返回值:字符串不会改变原来的数字,四舍五入返回一个字符串,最后一位可能为0正负号不受影响,依旧保留 let a = 5.248674; let b = 0; console.log(a.toFixed(2)); // 5.25 console.log(a); // 5.248674原创 2021-07-09 22:38:55 · 559 阅读 · 0 评论 -
节流与防抖
节流与防抖input, keyup,mousemove,resize,scroll 等短时内频繁触发的事件,我们并不需要如此频繁的执行,就可以使用到节流和防抖了防抖debounce特定时间内,多次触发只执行最后一次vue中做防抖处理// 2s内出触多次,只会执行最后一次<input type="text" @input="deboundeInput" /> dealInput() { console.log(666); }, deboundeI原创 2022-01-16 16:17:04 · 253 阅读 · 0 评论 -
正则表达式的基本使用
正则表达式作用1.用途:匹配字符串的字符组合(可进一步对字符串增删改查)2.使用场景匹配:验证表单过滤:过滤敏感关键词提取:截取字符串创建正则表达式1.利用构造函数Regexp创建var exp1=new Regexp(/表达式/2.利用字面量创建var exp2=/表达式/检测正则表达式test()regexpObj.test(string)正则表达式中的特殊字符边界符符号意义更多说明^以什么开始边界符$以什么结尾边界符[]包含原创 2021-09-16 21:42:18 · 92 阅读 · 0 评论 -
url参数处理
url参数处理获取urllocation.href : 获取整个urllocation.search : 获取url参数,从问好开始截取eg: console.log(location.href); // “http://www.localhost.8080?name=shuaige&age=20&sex=man” console.log(location.serach); // “?name=shuaige&age=20&sex=m原创 2021-08-15 17:58:06 · 151 阅读 · 0 评论 -
replace的使用
replace的用法String.prototype.replace(参数1,参数2)返回新的字符串,原来的字符串不会发生改变 const str = "我想你"; const result = str.replace("想", "爱"); console.log(str, result); // 我想你 我爱你第一个参数为匹配模式:模式可以是一个字符串或者正则表达式第二个参数为替换值:替换值可以是一个字符串或者一个每次匹配都要调用的回调函数replace搭原创 2022-01-19 23:05:46 · 10205 阅读 · 0 评论 -
JS高级
JS高级JS哪些操作会造成内存泄露意外的全局变量引起的内存泄露闭包引起的内存泄露没有及时清理的计时器或回调函数闭包的产生、作用、应用功能场景、缺点及解决闭包的产生:当嵌套的内部函数引用了外部函数的变量时就产生了闭包 1 嵌套函数 2内部函数引用了外部函数的变量 3执行外部函数闭包作用:延长局部变量的生命周期让函数外部能操作内部的局部变量理解:因为我们使用一个全局变量接收返回来的函数,(局部变量在函数执行完后就被回收)全局变量只有指原创 2021-04-03 22:55:53 · 110 阅读 · 0 评论 -
原生js的dom操作
dom操作获取dom标签名获取doucment.getElementByTagName("div")document.querySelector("div")className获取document.getElementByClassName("class")document.querySelectorAll(".class")document.querySelector(".class")前两个获取的是所有含有"class"这个类名的dom,返回一个类数组最后一个是获取第一个含原创 2021-09-16 21:39:12 · 635 阅读 · 0 评论 -
错误处理:try/catch与throw
错误处理正常情况下js代码遇到错误后我们的浏览器会报错,后面的代码无法继续执行,浏览器控制台会出现错误提示try/catchtry{// 可能出错的代码}catch(error){// 错误处理console.log(error.message)}finally{ console.log("不管怎样我都会执行")}try捕获错误,遇到错误时catch做出一些处理try/catch与finally不管怎么样finally中的代码一定会执行1》如果没有错误,执行完try中的代原创 2021-08-29 16:53:52 · 1487 阅读 · 0 评论