dergfg的博客

说白了，fiber的底层就是链表，时间切片，一帧渲染多少React 16 架构为了解决同步更新长时间占用线程导致页面卡顿的问题，也为了探索运行时优化的更多可能，React开始重构并一直持续至今。重构的目标是实现Concurrent Mode（并发模式）。  从v15到v16，React团队花了两年时间将源码架构中的Stack Reconciler重构为Fiber Reconciler。React16架构可以分为三层：Scheduler（调度器）—— 调度任务的优先级，高优任务优先进入Reconci

/** * 获取数据流 */import React from 'react';import { Button } from 'antd';import 'antd/dist/antd.css';import request from 'umi-request';export default () => { function download() { request('/get-data-stream', { method: 'POST', // 重

一、认识JavaScriptJavaScript的起源,…JS的组成ECMAScript：语法规范BOM：浏览器对象模型：window，也是js的顶层对象alert(“hello”);DOM：文档对象模型：documentdocument.write(“hello”);JS写在哪（参考css写在哪）内联：以html标签的属性存在<div class="box" onclick="alert('hello')"></div>&lt

保持对代码的热爱并保持怀疑态度async(/əˈsɪŋk/),await的概念async和await是用来处理异步的。当你需要异步像同步一样执行，需要异步返回结果之后，再往下依据结果继续执行。async 是“异步”的简写，而 await 可以认为是 async wait 的简写。async 用于申明一个 function 是异步的，而 await 用于等待一个异步方法执行完成。async的写法（a沈克）此乃中文歪读直接声明,表示这个函数是异步的。async function(){}然后里

保持对代码的热爱并保持怀疑态度什么是栈堆，及其区别栈：用来保存变量的名称或地址，稳定，不可更改，空间小堆：用来保存数据或值，空间大，可被修改关系：一对一，多对一，不能一对多什么是值传递，什么是引用传递（基本数据）值传递：内有地址和值之分，值就是地址，地址就是值– 字符，数据，布尔，undefind（复杂数据）引用传递：有地址和值，地址是地址，存在栈中，值是值，存在堆中，被栈中的地址指向– 对象深浅拷贝的区别，如何实现深拷贝浅拷贝：只拷贝地址深拷贝：拷贝值实现深拷贝

保持对代码的热爱并保持怀疑态度异步同步概念异步：多个程序同时执行同步：每个程序不同时执行程序：功能进程：一个功能的开始执行到执行结束的过程线程：一个功能在执行过程中的每一个分支，多线程异步执行，线程越多执行速度越快，但需要消耗大量性能同步现象就比如这个 看实例： alert(1); alert(2); alert(3); alert(4); alert(5)alert弹出会阻塞程序执行，当你不点击确认的时候，他便不会执行后面的代码，当你点击后才

保持对代码的热爱并保持怀疑态度昨天写了一篇js防抖和节流的理解用到了闭包，刚刚好我也忘的差不多了，只知道闭包长什么，原理什么的早就忘到九霄云外了，所以准备重新梳理了一下闭包。闭包的概念及原理闭包是指有权访问另外一个函数作用域中的变量的函数。也可以这么说，这样可能更能理解，也就是闭包的原理：通过作用域的嵌套，触发计算机的垃圾回收机制（硬盘），将原本的局部变量进化成私有变量的环境，叫闭包计算机的垃圾回收机制硬盘：需要删除的数据，不直接删除，而是再是保存在一个临时区域，如果需要继续使用，可以从临

保持对代码的热爱并保持怀疑态度文中fn皆表示函数的意思 function（）{}this指向默认绑定：没有明确隶属对象的函数直接执行，window事件绑定：事件处理函数中的this，事件源隐式绑定：对象的方法中的this，对象显示绑定：使用函数的call或apply或bind改变this，函数方法的第一个参数new绑定：new关键字执行函数，new出来的对象this是一个关键字，一般存在于函数中，表示所在函数的执行对象this不是所在的函数，是所在函数的执行对象t

保持对代码的热爱，并保存怀疑态度在说防抖和节流之前我们先说一下闭包什么是闭包？通过作用域的嵌套，触发计算机的垃圾回收机制（硬盘），将原本的局部变量进化成私有变量的环境，叫闭包 function fn(){ var a = 10; return function(){ a ++ ; console.log(a); } } var f = fn(); f();什么是防抖？首先先看一个例子

保持对代码的热爱并保持怀疑态度什么是pormise？Promise 对象代表了未来将要发生的事件，用来传递异步操作的消息。自身存在三个状态：正在进行时，已完成，已失败优化了异步程序的回调地狱问题。什么是回调地狱？看代码 ajax("",function(res1){ ajax("",function(res2){ ajax("",function(res3){ ajax("",function(res4){

保持对代码的热爱并保存怀疑态度在这里先祝大家新年快乐，纪念一手。源码地址：点击跳转烟花实现的原理 OOA：烟花，点击页面位置，出现元素运动，运动到终点，删除，创建好多元素，运动到指定随机位置，到终点，删除 主体烟花 创建元素，设置位置，设置颜色，插入页面 开始运动，到终点 删除元素 小烟花 创建多个元素，设置位置，设置颜色，插入页面 开始运动，到终点 删除元素以上为分析，因为用

保持对代码的热爱并保持怀疑态度事件源：绑定事件的元素事件目标：触发事件的元素事件分类：鼠标类键盘类表单类浏览器类 location href scroll load事件的绑定方式方式DOM0级（赋值式）绑定 元素.on事件名 = 函数删除 obtn.onclick = nullvar obtn=document.getElementById("btn"); obtn.onclick=function(){ console.log

保持对代码的热爱并保持怀疑态度localStorage永久级本地存储sessionStorage：会话级本地存储特点：HTML5版本中新增的技术不会随着HTTP发往服务器，是一种真正的本地存储不用必须运行在服务器环境只能存文本大小：5M不允许跨域传入对象的时候也是需要用JSON.stringify转为字符型在哪查看f12调出控制台，跟cookie的位置一个栏目里面语法localStorage和sessionStorage语法是一样的localStorage.setI

保持对代码的热爱并保持怀疑态度什么是cookie？Cookie 是一些数据, 存储于你电脑上的文本文件中。当 web 服务器向浏览器发送 web 页面时，在连接关闭后，服务端不会记录用户的信息。Cookie 的作用就是用于解决 “如何记录客户端的用户信息”:当用户访问 web 页面时，他的名字可以记录在 cookie 中。在用户下一次访问该页面时，可以在 cookie 中读取用户访问记录。cookie的查看f12调出控制台，我这里暂时没有存储数据，如果存储了可以在这里看到。cookie的

保持对代码的热爱并保存怀疑态度DOM介绍DOM：文档对象模型，document，提供了页面（网页，文档）的操作标准化组织：W3Cdocument表示页面，html结构，类似于树形结构（家族结构），页面由节点组成页面上所有的成份都是节点标签（元素）节点文本节点属性节点注释节点根节点所有的节点都是对象类型的数据如何操作网页，操作DOM，操作节点，哪个节点，选中其中一个↓↓↓选择器元素节点选择器单个对象：就算有多个符合条件的元素存在，也只能选择一个直接选择：id

保持对代码的热爱并保持怀疑态度首先得知道一点:在js中万物皆对象 Everything is object面向对象编程：就是以对象为主的编程对象 -就是数据的打包数据的查找速度得到提升数据的传输速度得到提升面向对象的三大设计思想·面向对象分析（OOA）：不断的将无法直接解决的大问题，拆分成可以直接解决的小问题·面向对象设计（OOD）：每个系统之间，需要有数据关联，但又没有功能依赖·面向对象编程（OOP）：封装（忽略细节选择使用重复使用）继承（相当于你有个父元素，然后子元素可以直

保持对代码的热爱，并保存怀疑态度BOMBOM：浏览器对象模型，对象是window作用：浏览器对象，提供了浏览器的操作提供了浏览器窗口的操作窗口与窗口之间的交互提供了js的运行的平台，所以，是js的顶层对象（顶层作用域）js的顶层对象window方法：parseInt() 取整parseFloat() 取小数isNaN() 判断是否是NaNtypeof() 检测数据类型setInterval() 计

保持对代码的热爱并保存怀疑态度这里只是简单的基础应用具体使用参照主页js随机点名计算器运用场景很多需要自己去发掘计时器（定时器）设置一个时间，每隔这个时间，执行一次指定代码setInterval(参数1,参数2)参数1：函数，被多次执行的代码段参数2：毫秒数，每次执行时间隔的时间 setInterval(() => { console.log("计算器每30执行一次"); }, 30);延时器设置一个时间，等待这个时间

保存对代码的热爱并保存怀态度日期对象 - 设置创建日期对象时参数是字符new Date(字符参数)超出上限日期，无效日期：Invalid Date没有设置的部分：默认为0关注月份：1~12参数个数：1个参数是数值new Date(数值参数)超出上限日期，向前进没有设置的部分：默认为0关注月份：0~11参数个数：多个创建日期对象后var d = new Date();精准设置d.set系列(数字);设置时间戳主动设置从197

保持对代码的热爱并保持怀疑态度正则正则的介绍正则，正确的规则，用来描述字符串的规则，正则在js中的数据类型以对象形式表现。正则也叫正则对象，因为正则在某些情况下可以直接参与运算，正则，也叫正则表达式正则的作用用来描述字符串的规则，根据这个规则对字符进行：查找，替换，验证正则的意义节省代码，快速输入正则并没有节省太多性能正则的使用查找：str.search(正则)str.match(正则)正则.exec(str)替换str.replace(

保存对代码的热爱，并保持怀疑态度1.post相对于get比较安全，get的数据直接显示到url直观的区别就是GET把参数包含在URL中，POST通过request body传递参数例如get的：https://mp.csdn.net/console/home?spm=1001.2014.3001.4503?“拼接的数据’=”url=url+"?"+拼接的数据+“sd=”+Date.now(); “sd=”+Date.now()为了清除缓存post相当于get比较安全一点，这里能查询到post

保持对代码的热爱并保存怀疑态度<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body>

保持对代码的热爱，并保存怀疑态度变量声明关键字(基础功能都是赋值）let1.全局变量不会绑定到window对象2.权重不会提升3.不允许重复声明4 块级作用域：只要是花括号就是作用域（写在花括号里面）5.暂时性死区const 同let, const声明的是常亮，声明时立即赋值，之后再也不能修改其实const不允许修改的是地址，可以改值也就是说变量声明了就不能再重复声明，对象数组复杂数据类型可以更改值// let和const的使用场景：如非特殊需要，所有的var都可以改成le

保存对代码的热爱，并保存怀疑态度jsonp的原理：利用script标签不会触发浏览器的同源策略，及script标签将自身引用的数据，作为js代码执行的原理。配合函数的传参(执行时的参数发送给定义时的参数)，实现跨域数据的获取。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device

保存对代码的热爱并保存怀疑态度// var str = ""; // for(var i=0;i<4;i++){ // str += random(0,9); // str += String.fromCharCode(random(97,122)) // str += String.fromCharCode(random(65,90)) // } // console.log(str); // // 2. 从

保持对代码的热爱并保存怀疑态度建议从头开始一步一步看<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Document</title> <style> #box1{width: 100px;height: 100px;background: red;position: absolute;left:0;top:0;

保持对代码的热爱并保存怀疑态度<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Document</title> <style> #box1{width: 100px;height: 100px;background: red;position: absolute;left:0;top:0;} #

保持对代码的热爱并保存怀疑态度<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Document</title> <style> #box1{width: 100px;height: 100px;background: red;position: absolute;left:0;top:0;} #b

保存对代码的热爱并保存怀疑态度indexOf()功能：查看当前字符的索引，从0开始，参数：要检索的字符 返回值：有的话就返回索引的位置，没有的话返回-1；charAt() 功能：查看当前索引的字符，从0开始， 参数：要检索的索引 返回值：有的话就返回当前的字符，没有的话返回空字符 “”；replace() 功能：替换，当替换为空的时候，相当于删除，替换多个相同的话要一个个从左往右replace参数：原参数，要替换的参数；正则表达式会用到 返回值：返回被更改好的值；substring( n,m)

保存对代码的热爱，并保持怀疑态度内置对象 - Math数学对象，提供了一些数学操作Math.round() 大于5进1， -1.6=-2， 1.6=2Math.random() 0~1随机数，不包括0和1Math.abs() 绝对值Math.ceil() 向上取整 4.1=5Math.floor() 向下取整 4.1=4Math.max() 最大值 不能接收数组Math.

保存对代码的热爱并保存怀疑态度这是未封装之前的，明天发封装的，一共分了三部分，小白我还未研究清楚，见谅注释齐全，绝对是最齐全的我都恨不得写篇论文出来<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &lt

保存对代码的热爱，并保存怀疑态度<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> --> <title>Document</title></head&g

保存对代码的热爱，并保持怀疑态度function round(max,min){ //随机数 return Math.round(Math.random()*(max-min)+min); } function rondow(){ // return "rgb("+ round(0,255) +","+ round(0,255) +","+ round(0,255) +")"; //加号拼接法 return `rgb(${round(

保持对代码的热爱并保存怀疑态度<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #b

保持对代码的热爱，并保存怀疑态度<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #

function round(max,min){ return Math.round(Math.random()*(max-min)+min); }

保存对代码的热爱，并保存怀疑态度es5-方法名 对应版本 功能 原数组是否改变 返回值concat(连接的数组) ES5- 合并数组，并返回合并之后的数据 njoin(“-”) ES5- 使用分隔符，将数组转为字符串并返回 npop(无参数) ES5- 删除最后一位，并返回删除的数据 yshift(无参数) ES5- 删除第一位，并返回删除的数据 yunshift() ES5- 在第一位新增一或多个数据，返回长度 ypush() ES5- 在最后

保持对代码的热爱，并保存怀疑态度表单的重置和提交需要在form里，浏览器的滚动需要出现滚动条加个heigh=1000px就能测<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do

保存对代码的热爱，并保存怀疑态度isNAN 是不是nan，自带隐式转化，如果是“123”，会自动转换为123，结果就是falsejs的三大数据类型undefinedNaNnullNaN不等于 null，undefined包括他自己underfined 等于mull三等于=不等null加+1=1undefined+1=NaN// 非严格模式下，不写声明关键字，直接给不存在的变量赋值会自动将变量声明到顶层作用域（全局作用域）（但这是不规范的写法，不要使用）递归：在一个函数的内部，执

保存对代码的热爱，并保存怀疑态度入口 - 参数实参形参类型数量关系数量一致时：从左向右一一对应实参多：无法通过形参拿到多出来的实参，但是可以通过arguments拿到所有实参形参多：多出来的形参为undefinedfunction fn(a){ // 形参 console.log(a);}fn(1) //实参一. arguments函数内部有一个隐藏对象，用来接收所有实参类数组（伪数组）具有的索引和长度的概念，但是不能使用数组的某些操作