
JavaScript
十里顾情欢
这个作者很懒,什么都没留下…
展开
-
节流函数(throttle)
学习笔记原创 2023-02-24 17:51:33 · 438 阅读 · 0 评论 -
发抖函数(debounce)
学习笔记原创 2023-02-24 17:41:18 · 186 阅读 · 0 评论 -
手写Array.prototype.reduce
通过手写reduce更好理解运行机制原创 2023-02-23 17:42:30 · 180 阅读 · 0 评论 -
async和await的基础语法
async 和 await 是 Promise的语法糖async是对函数的一个修饰:使一个函数返回Promise实例await是等待一个Promise实例成功后执行函数中想要使用await,需要把方法基于async修饰才可以await只有当前实例状态为成功,才会去执行其后面的代码(代码为失败,后面的代码则不会执行)async function func(){ return 10}console.log(func());// 控制台的返回结果 在下面Promise {<resol原创 2020-06-10 09:17:07 · 332 阅读 · 0 评论 -
ES3、5和ES6中的变量提升区别
现在最新版本的浏览器–> 向前兼容 ES3、5 规范1.判断体和函数体等不存在块级上下文,上下文只有全局和私有2.不论条件是否成立,带function的都要提前声明+定义–> 向后兼容 ES6 规范1.存在块级作用域,大括号中出现let、const、function…都会被认为是块级作用域2.不论条件是否成立,带function的只提前声明,不会提前赋值了块级作用域没有自己的this,用的是上下文中的 this (和箭头函数类似) 也没有arguments 更不会进行形参赋值只有原创 2020-05-31 17:27:27 · 195 阅读 · 0 评论 -
mouseover和mouseenter的本质区别
<div id="outer"> <div id="inner"> <div id="center"></div> </div></div><script> center.onmouseenter = function () { console.log("center enter"); } center.onmouseleave = function () { console.log("center原创 2020-05-10 21:01:23 · 174 阅读 · 0 评论 -
阻止默认行为
<!-- A标签的默认行为1: 页面跳转 A标签的默认行为2: 锚点定位--><!-- 锚点定位 --><a href="http://www.zhufengpeixun.cn/#free_course">珠峰培训</a><!-- target="_black" 新打开一个标签页显示 --><a href="https://www.baidu.com/" target="_black">百度</a>原创 2020-05-10 17:47:37 · 126 阅读 · 0 评论 -
事件的传播机制
事件的传播机制1、捕获阶段:从最外层向最里层事件源依次进行查找(目的:是为冒泡阶段事先计算好传播的层级路径) =>CAPTURING_PHASE:12、目标阶段:当前元素的相关事件行为触发 =>AT_TARGET:23、冒泡传播:触发当前元素的某一个事件行为,不仅它的这个行为被触发了,而且它所有的祖先元素(一直到window)相关的事件行为都会被依次触发(从内到外的顺序) =>BUBBLING_PHASE:3 (Event.prototype)<div id="out原创 2020-05-10 20:34:05 · 361 阅读 · 0 评论 -
面向对象练习题
原创 2020-05-06 16:16:28 · 131 阅读 · 0 评论 -
堆/栈内存练习题
原创 2020-05-06 16:16:19 · 274 阅读 · 0 评论 -
面向对象的深层应用:内置类原型扩展方法和方法借用
Array.prototype.slice.call("清欢",0)(2) ["清", "欢"] 0: "清" 1: "欢" length: 2 __proto__: Array(0)原创 2020-05-06 16:16:04 · 120 阅读 · 0 评论 -
字符串的方法
indexOf()/lastIndexOf()查找字符串中的字符返回文本在字符串中首次或者最后一次出现的索引,没有找到返回-1search()搜索字符,并返回匹配到的位置三种截取部分字符串的方法slice(start, end)截取字符串的某个部分并在新字符串中返回被截取的部分两个参数:起始索引(开始位置),终止索引(结束位置)如果省略第二个参数,则该方法将截取字符串的剩余部分...原创 2020-04-04 23:12:50 · 150 阅读 · 0 评论 -
浏览器底层渲染机制
原创 2020-05-06 16:15:31 · 225 阅读 · 0 评论 -
JS中的四大继承方案
类的多态:重载和重写JAVA中重载:函数名相同,但是传参类型、数量不同或者返回值不一样,这相当与把一个函数重载了 (JS中没有类似于后台语言中的重载机制:JS中的重载只的是同一个方法,根据传参不同,实现不同的业务逻辑)重写:子类重写父类上的方法继承:子类继承父类中的属性和方法(JS中的继承机制和其它后台语言是不一样的,有自己的独特处理方式)一、原型继承 (B子类 => A父类)...原创 2020-05-06 16:15:16 · 363 阅读 · 0 评论 -
JS中THIS的五种情况
事件绑定/** THIS1:给元素的某个事件行为绑定方法,事件触发,方法执行,此时方法中的THIS一般都是当前元素本身*///=>DOM0 btn.onclick = function anonymous() { console.log(this); //=>元素 };//=>DOM2 btn.addEventListener('click', functio...原创 2020-05-06 16:15:06 · 450 阅读 · 0 评论 -
面向对象编程概述和NEW的实现原理
对象:万物皆对象类:对象的细分实例:类中具体的事物JS也是面向对象编程:类、实例1 ->Number‘A’ ->Stringtrue ->Booleannull ->Null ->Objectundefined ->Undefined[] ->Array/^$/ ->RegExpfunction(){} ->F...原创 2020-05-06 16:14:55 · 332 阅读 · 1 评论 -
JS高阶编程技巧
惰性函数和单例设计模式单例设计模式(最原始的模块化思想)let weatherModule = (function () { let _default = 'beijing'; let queryWeather = function () { //... }; let setCity = function () { //... }; return { //ES6写法 名...原创 2020-05-06 16:14:43 · 221 阅读 · 0 评论 -
原型prototype和原型链__proto__
每一个类(函数)都具备prototype,并且属性值是一个对象对象上天生具备一个属性:constructor,指向类本身每一个对象(普通对象、prototype、实例、函数等)都具备:proto,属性值是当前实例所属类的原型...原创 2020-05-06 16:14:33 · 110 阅读 · 0 评论 -
JS中数据类型检测的四种方案
1、typeof /* * 检测数据类型1:typeof * 返回结果都是字符串 * 字符串中包含了对应的数据类型 "number"/"string"/"boolean"/"undefined"/"symbol"/"object"/"function" * * 【局限性】 * typeof null => "object...原创 2020-05-06 16:14:14 · 342 阅读 · 0 评论 -
数据类型
基本数据类型(值类型)number string boolean null undefined引用数据类型object: {} [] /^$/ Math 日期对象 实例对象 。。。functionES6中新增Symbol 唯一值NaNtypeof 检测数据类型console.log(typeof NaN) =>“number” 不是一个有效数字,但是属...原创 2020-04-26 11:22:53 · 130 阅读 · 0 评论 -
事件对象
1.什么是事件? 浏览器赋予元素天生默认的一些行为,不论是否绑定相关的方法,只要行为操作进行了,那么一定会触发相关的事件行为2.什么是事件绑定? 给元素的某一个事件行为绑定方法,目的是行为触发后可以做点自己想做的事情3.事件绑定 DOM0事件绑定/DOM2事件绑定【DOM0事件绑定】元素.onxxx=function(){}元素.onxxx=null; 原理:给DOM元...原创 2020-05-06 16:13:49 · 140 阅读 · 0 评论 -
堆栈内存
编译器(把代码解析成为浏览器看的懂的结构)词法解析AST抽象语法树构建出浏览器能够执行的代码webpack babel引擎(V8 / weblit内核)变量提升作用域 / 闭包变量内存堆栈内存GO/VO/AO/EC/ECStack…a = null 空对象指针让一个变量指向一个空的指针,让它达到对原有被占用被指针指向的占用内存的释放跟回收0、undefined...原创 2020-05-04 10:33:54 · 278 阅读 · 0 评论 -
彻底掌握 parseInt
let arr = [1,2,3,4]arr = arr.map(parseInt)console.log(arr)parseInt([value]): 把value转换为数字,要求value是字符串(不是字符串先默认转换为字符串) ,从字符串左边开始查找,找到有效数字字符转换为数字(遇到一个非有效的数字字符,则停止查找)16进制1,2,3,4,5,6,7,8,9,A(10),B(11...原创 2020-05-04 14:38:44 · 457 阅读 · 0 评论 -
let、var、const的区别
在当前执行上下文代码执行之前,首先会把所有带var或者function关键字的声明或者定义(带var的只是提前声明,带function会提前的声明+定义)全局变量对象VO(G)中声明的变量(用var声明的),也会给全局对象GO中增加一个对应的属性;但是用let声明的变量不存在这个特点;var x = 12;console.log(window.x); //=>12let x = 1...原创 2020-05-04 17:14:51 · 213 阅读 · 0 评论 -
数组的方法
push( )1、作用:在数组的末尾添加一项2、返回值:新增项目后数组的长度3、参数:要新加的项pop( )1、作用:在数组的末尾删除一项2、返回值:被删除的那一项3、参数:没有参数shift( )1、作用:在数组的开头删除第一项2、返回值:被删除的那一项3、参数:没有参数unshift( )1、作用:在数组的开头添加一项2、返回值:新增项目后数组的长度3、参数:要新...原创 2020-04-04 18:51:59 · 237 阅读 · 0 评论