JavaScript
文章平均质量分 90
js基础+js高级+es6+一些问题
DantinZhang
学习只是一种习惯
展开
-
axios:基本使用、常用配置项、create方法、请求和响应拦截器、取消请求
一般来说,我们都会省略then的失败回调,所有的错误都在响应拦截器中捕获,做法就是在响应拦截器失败的回调中进行错误提示,并返回一个pending状态的Promise,这样的话我们使用async/await就不用包try-catch了,then也就不用指定失败的回调了。当请求结束后,如果请求成功,就会走第一个回调,然后再走then中成功的回调,所以这里的返回值就是Promise成功的值;是得到响应之后执行的一组回调函数,若请求成功,对成功的数据(成功Promise的结果值)进行处理;一般来说只有一个回调。原创 2023-01-05 21:48:22 · 4499 阅读 · 1 评论 -
Promise:工作流程、常见API、使用方法、手撕Promise、async/await
Promise指定回调函数的方式更加灵活,且支持链式调用,可以解决回调地狱的问题。回调地狱:回调函数嵌套调用,外部回调执行结果是内部函数执行的条件,不便于阅读且不便于异常处理,解决方式就是promise(或async/await)原创 2022-12-28 18:13:00 · 1907 阅读 · 0 评论 -
JS高级(四):正则表达式、常见的特殊字符、案例、预定义类、正则替换
中括号:字符集合,匹配方括号中的任意字符大括号:量词符,里面表示重复的次数或范围只有abccc返回 true var reg = / ^[a-zA-Z0-9_-]{3,7}$ /;小括号:表示优先级只有abcabcabc返回 true预定义类就是某些常见模式的语法糖罢了案例:座机号码验证:010-12345678或0530-1234567正则中的或用 | 来表示,不能有空格。有^$时,[0-9]是多选一,长度为3,没有^$就是只要是数字就行,就没有长度限制了。原创 2022-11-18 16:09:34 · 827 阅读 · 0 评论 -
JS高级(三):严格模式、闭包、递归、深拷贝和浅拷贝
全局变量、局部变量和作用域链闭包:能够访问另一个函数作用域中变量的函数。原理:作用域链,当前作用域可以访问上级作用域中的变量产生闭包的条件:1、函数套函数2、内部函数访问外部函数局部变量,必须要访问了变量才会产生闭包闭包就是将函数内部和函数外部连接起来的一座桥梁。什么意思呢?函数inside访问了函数outside的作用域,那么inside函数就是一个闭包 function outside() {原创 2022-11-17 18:17:42 · 902 阅读 · 0 评论 -
JS高级(二):继承、数组的一些api、Object.defineProperty()、call、apply、bind
就可以,这是一个深拷贝,这样的话子的原型对象就可以通过父的实例指向父的原型对象,解决上面的问题。当数组元素为简单数据类型时(操作el不会变,操作arr[index]就会变,奇怪),而复杂数据类型如果修改了里面的属性,原数组就会改变。查找数组中有没有满足条件的元素,如果找到第一个,就不再往后执行,这也导致some的效率比其他的更高一些,找到了直接。这是一个浅拷贝,这样的话子和父原型对象地址一样,如果子添加自有方法,父也会添加,不合理。,类的本质就是一个函数),那么子构造函数如何继承父构造函数的属性呢?原创 2022-11-16 17:47:07 · 668 阅读 · 0 评论 -
JS高级(一):类、原生tab栏切换、原型和原型链
对象的原型(__ proto__)和构造函数的原型对象(prototype)里都有一个属性constructor,我们成为构造函数,因为它指向构造函数本身(无限套娃,原型对象里有constructor,constructor里是构造函数,构造函数又有原型对象,原型对象又有constructor……如果子类继承父类,子类和父类中有同名方法,那么子类中的实例调用时优先调用子类中的方法,如果子类没有该方法,才去调用父类的该方法。4、所有子类继承的父类的属性都写到super里,子类独有的要在super后添加。原创 2022-11-16 10:40:45 · 1078 阅读 · 4 评论 -
JavaScript中的空数组和空对象布尔值是true还是false?
2.空数组和空对象转化为不一样对象转化为Number都是NaN,数组视情况而定3.作为if语句的判断条件由于空数组和空对象都是类型,因此用判断的时候,都为其实本来二者转化为布尔值就是true:4.和布尔值比较却不是true这是因为任何值和布尔值比较时,两边都会转化为Number类型5.只有以下几个类型布尔值为false、、、 、或者7.关于null和undefined和0比较undefined 只与 null 相等,不会与其他值相等但是相等性检查 == 和普通比较符 > < >=原创 2022-11-10 15:00:29 · 2850 阅读 · 0 评论 -
ES6(三):Iterator、Generator、async、类的用法、类的继承
遍历器(Iterator)是一种接口,为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署Iterator接口,就可以完成遍历操作,其实遍历器就是一个用于遍历数据结构的指针。一个数据结构只要具有属性,就说明有interator接口,就可以被for...of遍历。原生具备Iterator接口的数据结构如下。Array、Map、Set、String、TypedArray、函数的arguments对象、NodeList对象利用属性创建一个新的迭代器。.........原创 2022-07-27 22:33:35 · 795 阅读 · 3 评论 -
ES6(二):解构赋值、Symbol、Map和Set、数组的扩展方法
比如这里有个对象,在ES5中获取对象里的值我们都这么干但是现在,我们用解构赋值就可以直接这么干非常简便。原创 2022-07-22 21:49:01 · 1042 阅读 · 4 评论 -
ES6(一):let和const、模板字符串、函数默认值、剩余参数、扩展运算符、箭头函数
下面这样会报错,而var就不会。原创 2022-07-20 17:02:53 · 1062 阅读 · 3 评论 -
PC特效:offset和拖动模态框
如果没有父亲或者父亲没有定位,则以body为准注意获取的是不带单位的数值!!!!!在网页中实现框框的拖拽效果思路:代码:原创 2022-07-10 20:47:04 · 282 阅读 · 0 评论 -
BOM(二):同步和异步、location对象、navigator对象、history对象
下面这段程序运行的结果竟然是123诶,这是为啥捏?简单来说,异步任务里面放的是回调函数1.先执行执行栈中的同步任务2.异步任务放入任务队列中3.执行栈中的所有同步任务执行完毕后,系统就会按次序读取任务队列中的异步任务,然后开始执行异步任务4.系统读取异步任务的时候,先看下你这个异步是个什么玩儿应,如果是个点击,那我就等着你点击,如果是倒计时,那我就等时间到。当事件触发的时候,就把回调函数扔到异步任务里,然后等主执行栈跑完,就按顺序执行异步任务5.事件循环就是说异步任务执行完之后,系统还会回到任务原创 2022-07-07 22:27:16 · 333 阅读 · 0 评论 -
BOM(一):window对象的常见事件(页面加载、调整窗口大小)、定时器
BOM(Browser Object Model):浏览器对象模型,主要是和浏览器窗口交互BOM包含了DOM使用window.load添加页面加载事件,这样即使标签在script代码的下面也是可以执行的,也就是load会等页面内容加载完毕后(包括DOM,图片,flash,css等)再去走window.load里面的代码。但是这个不能重复添加,重复添加会被覆盖,这个之前讲过(2)使用方法监听注册事件(3)DOMContentLoaded加载完DOM就显示DOMContentLoaded是DOM加原创 2022-07-07 15:14:42 · 1034 阅读 · 0 评论 -
DOM(四):注册和删除事件、DOM事件流、事件对象、事件委托
第一种:传统注册事件也就是我们之前常用的第二种:方法监听注册事件语法是下面这样,注意事件类型onclick一定要去掉on二者的区别:传统方法同一个元素只能添加一个监听器,如果添加多个会被覆盖;第二种方法同一个元素,同一个事件可以添加多个监听器(function里面的东西就叫监听器)比如有两个div第一种:传统注册事件删除事件用this.onclick = null;第二种:方法监听注册事件删除事件用this.removeEventListener(‘click’, fn);其中fn是函数的名字,原创 2022-07-06 17:06:33 · 1017 阅读 · 0 评论 -
DOM(三):节点操作——获取父子兄节点(查)、添加和删除元素节点
节点主要 有父子兄关系语法:子节点.parentNode,得到的是一个元素不是集合比如我选了一个类名叫zzy的元素那么要获取zzy 的父节点,只需要zzy.parentNode注意,得到的时离该元素最近的父节点(亲爹),如果找不到父节点,就返回null这个得到的是所有的子节点,除了我们想要的元素节点,还有换行、空格等文本节点,所以要想拿到元素,就要循环遍历,因为元素节点nodeType是1,属性2,文本3。这个真的是麻烦的一塌糊涂这个只返回子元素节点,其他的都滚蛋,不错父节点.firstChild和原创 2022-07-05 14:47:21 · 5251 阅读 · 1 评论 -
DOM(二):几个NB案例、属性操作(自定义属性)、tab栏切换(重难点)
这里用到排他思想的算法,也就是点击一个按钮,先把所有的按钮变成原来的颜色,然后再把当前点击的按钮变成亮色。这里用到两个for循环,要好好体会一下。案例2:浏览器换肤效果思路:点击某个图片,把该图片的地址赋给body这里的几个注意点:1.body元素和html元素的获取方法,要多复习复习2.给多个相同元素添加事件可以用for循环3.修改样式,赋值要加引号,如果其中有变量,要单独拿出来,用+拼接就欧了案例3:表格隔行变色其实这个效果类似css的hover1.用到的事件:鼠标经过onmouse原创 2022-07-03 17:24:05 · 701 阅读 · 0 评论 -
DOM(一):获取元素(查)、事件基础、操作元素(改)
DOM:Document Object Model (文档对象模型)DOM把下面这些东西都当作对象。获取元素有很多种方式1.根据ID获取2.根据标签名获取3.通过html5新增的方法获取4.特殊元素获取如果多个标签id相同,默认选第一个,但是如果多个标签class相同,都会选出来,详见4这里面有这么几个注意点,第一捏就是文档页面是从上往下读的,所以script标签要写到下面第二就是参数id大小写一定要一致,第三呢就是返回的timer是一个元素对象2、根据标签名获取获取元素返回的是带有指原创 2022-07-01 22:16:25 · 1099 阅读 · 0 评论 -
JavaScript(五):简单数据类型和复杂数据类型(栈和堆)
特例:简单数据类型null,返回的是一个空的对象所以说如果有个变量打算存储对象,但是没想好放啥,就放个null就行实际上JavaScript中没有堆栈,但是可以帮我们理解理解简单数据类型存放到栈里面,存放的是值复杂数据类型放到堆里面,存放的是地址,然后地址指向堆里面的数据这里要清楚,栈里存数据,堆里存的是地址,所以复杂数据类型传参的话,如果函数里对数据进行了改变,那么因为实参和形参指的是同一个地址,实参就会随之改变答案是1刘德华2刘德华3 张学友4张学友注:这部分内容应该是面试高频,后面再原创 2022-06-30 14:22:22 · 423 阅读 · 2 评论 -
JavaScript(四):内置对象--Math对象、日期对象、数组对象、字符串对象
可以使用MDN文档来查询JS的一些内置对象,网址:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects内置对象实际上就是一些已经设定好的方法什么的,我们可以直接拿过来用Math对象不是一个构造函数,所以我们不需要new来调用,直接使用里面的属性和方法即可。2. 取绝对值abs3. 向下取整floor4. 向上取整ceil5. 四舍五入round这里有一个需要注意的地方,如果遇到.5原创 2022-06-28 22:28:55 · 726 阅读 · 1 评论 -
JavaScript(三):作用域、预解析、对象
全局作用域:在整个script标签下或者在一个单独的js文件中局部作用域:在函数内部就是局部作用域,这个代码的名字只在函数内部起作用全局变量:局部变量:全局变量和局部变量的区别:作用域链:内部函数访问外部函数的变量,采取的是链式查找的方式来决定取哪个值。总结来说就是:一层一层往外找,采用就近原则。这个还是比较简单的。二、预解析1.理论举例1:如果先输出,再声明,那么默认会把变量声明提升到最前,但是不赋值举例2:这里虽然是声明函数,但是是变量提升,也就是先声明fun变量,再给fun原创 2022-06-26 17:24:25 · 528 阅读 · 0 评论 -
JavaScript(二):数组、函数
数组就是一组数据的集合注意Array首字母要大写才行。1.2 利用数组字面量来创建数组数组里可以存放任意的数据类型,用逗号隔开。数组元素:存放在数组里面的数据。2.获取数组里的元素使用数组名[n]来获取,注意n从0开始,arr[0]代表第一个元素借助for循环实现数组的遍历当然啊,这里可以自动获取数组的长度,数组名.length4.新增数组元素4.1 方法一:修改length长度新增的地方会显示:undefined4.2 方法二:修改length长度注意,如果直接赋值给数组,那么原创 2022-06-22 22:45:33 · 1161 阅读 · 0 评论 -
JavaScript(一):数据类型、运算符、流程控制语句
交换两个变量的值:找个中间变量一、数据类型简单数据类型:数字前加0表示八进制,如010表示十进制的8,012表示十进制的10数字前加0x表示十六进制,如0xa表示十进制的10数值的最大值:alert(Number.MAX_VALUE);数值的最小值:alert(Number.MIN_VALUE);无穷大:alert(Infinity);无穷小:alert(-Infinity);非数值:alert(NaN); Not a NumberisNaN方法:判断是否是非数字,如果是数字那么返回原创 2022-06-20 22:31:09 · 971 阅读 · 0 评论