随笔分类 - 前端学习
摘要：继承方法：原型链、借用构造函数、组合继承、原型式继承、寄生式继承和寄生组合式继承。 1⃣️.原型链 特点：实例可继承的属性有：实例的构造函数的属性+父类构造函数属性+父类prototype的属性。 缺点：新实例无法向父类构造函数传参|单一继承｜所有新实例都会共享父类prototype上的属性。 fu
阅读全文
摘要：OSI模型是基于每一层功能的通用模型，TCP/IP模型是一种面向协议的标准 OSI模型区分了三个概念，即服务、接口和协议。TCP/IP在这三者之间没有明确的区别 OSI 模型提供了有关如何进行通信的指南，而 TCP/IP 协议则制定了 Internet 开发的标准。因此，TCP/IP 是一种更实用的
阅读全文
摘要：对象类型转换时，会调用内置的[@@toPrimitive]函数。 1⃣️如果期望或得一个string或default，则[@@toPrimitive]会先调用toString。如果toString属性不存在，则会嗲用valueOf。如果也不存在则会抛出一个TypeError 2⃣️如果期望获得num
阅读全文
摘要：const所创建的引用类型，其内部的变量仍能进行改变（引用类型中存储的是地址，更改内部的变量，引用类型的地址确实没变） const a = [1, 2, 3]; a.push(102); //仍然能够进行更改，我们不希望是这样 因此就有readonly诞生惹 //使数组中的元素值也无法被更改 let
阅读全文
摘要：创建两个promise const fn1 = () => { return new Promise((resolve,reject)=>{ setTimeout(()=>{ resolve(new Date()) },2000) }) } const fn2 = () => { return ne
阅读全文
摘要：数组扁平化 //1 const flat1 = (arr)=>{ return arr.reduce((pre,cur)=>{ return pre.concat(Array.isArray(cur)?flat1(cur):cur) },[]) } //2 toSting/split const f
阅读全文
摘要：从url中获取参数 const getParamFromUrl = (url)=>{ let params = url.split('?')[1] let param = params.split('&') return param.reduce((pre,cur)=>{ let key = cur
阅读全文
摘要：CSS常用布局 1⃣️流体布局 网页缩小和放大时网页布局也会随着浏览器的大小而改变 优点：页面布局的宽度都是百分数，页面的放大缩小都不会出现滚动条 缺点，窗口宽度较小时，行会变得很窄，不方便阅读其中的内容 2⃣️圣杯布局 三列布局；中间主体内容前置，且高度自适应；两边内容定宽 优点：重要的内容（中间
阅读全文
摘要：手写Promise.all Promise.all = (promises)=>{ return new Promise((resolve,reject)=>{ const result = [] let index = 0 if(promises.length==0){ resolve(resul
阅读全文
摘要：Promise.all处理同步请求 由于Promise.all的原理，其中一个promise出错，就直接暂停其他promise的执行。 使用async函数包裹，async函数必定返回resolve状态。 const resolvePadding = async (p)=>{ try{ const r
阅读全文
摘要：const promiseAjax = (url,data)=>{ return new Promise((resolve,reject)=>{ const xhr = new XMLHttpRequest(); xhr.open(POST,url); xhr.setRequestHeader('C
阅读全文
摘要：1⃣️.typeof 运算符号 缺点：typeof检测null的时候也会返回Object 2⃣️.instanceof运算符 优点：弥补了typeof不能具体检测属于哪个对象的局限性 缺点：不能用来检测和处理字面量方式创建出来的基本数据类型，即原始数据类型 function checkIsInsta
阅读全文
摘要：基础概念 主线程：js引擎执行的线程，执行初始化代码（页面渲染、函数处理等） 工作线程：也称幕后线程，这个线程可能存在于浏览器或js引擎内，与主线程是分开的，处理文件读取、网络请求等异步事件。 Event Loop（事件循环）：同步任务会直接在主线程中进行执行，而异步任务由工作线程进行处理，然后放入
阅读全文
摘要：虚拟DOM是一个能够代表DOM树的对象，在某些情况下虚拟DOM会比真实DOM快，情况如下： 1.减少DOM的操作(添加多个节点过程中，虚拟DOM可以将多次操作合并成一次操作｜借助DOM diff算法，可以省去多余操作，仅操作新增，或者改变的节点) 2.能跨平台渲染（虚拟DOM不仅可以变成DOM，还可
阅读全文
摘要：函数签名： function useState<S>(initialState: S | (() => S)): [S, Dispatch<SetStateAction<S>>]; 添加函数只是惰性渲染。initialState 参数只会在组件的初始渲染中起作用，后续渲染时会被忽略。如果初始 sta
阅读全文
摘要：首先React不同于传统的diff算法，制定了三大策略，使得将时间复杂度O(n^3)转化为O(n) tree diff优化： 对于DOM节点跨层级的移动操作少到忽略不计策略，提出tree diff优化，对DOM树进行分层对比，只会对比同一层次的节点。并且仅只有删除和创建两种操作。（为了保持良好的性能
阅读全文
摘要：BFC-块级格式化上下文 每一个BFC区域只包括其子元素，不包括其子元素的子元素 每一个BFC区域都是独立隔绝的，互不影响 触发BFC的条件： 1.body根元素 2.position不是static或者relative 3.display值为table｜table-cell｜inline-box1
阅读全文
摘要：NPM命令 查看npm版本 npm -v 使用npm安装模块 npm install <module name> 全局安装模块 npm install <module name> -g 查看所有全局安装模块 npm list -g 查看某个模块的版本号 npm list <module name>
阅读全文
摘要：npm切换淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org
阅读全文
摘要：Webpack整合TS npm init -y生成package.json文件 cnpm i -D webpack webpack-cli typescript ts-loader(可以安装淘宝镜像npm install -g cnpm --registry=https://registry.npm
阅读全文
浙公网安备 33010602011771号