Reborn酱-CSDN博客

原创 Vue 响应式原理学习笔记

一、数据响应式原理1. vue2.x2. vue3.x二、Vue 内部事件机制1. 发布订阅模式vue 自定义事件，兄弟组件传值，模拟实现一个三、Vue 响应式机制使用观察者模式四、实现一个简版的 Vueimport numpy as npimport pandas as pdimport matplotlib.pyplot as pltimport seaborn as snsimport warningswarnings.filterwarnings('ignore')imp

2021-08-16 18:07:53 179

原创虚拟 DOM snabbdom 源码学习笔记

snabbdom 一、h 函数1. h 函数源码解析2. h 函数参数传递总结1) sel:string2) data: vnodeData3) content二、使用步骤1.引入库2.读入数据总结一、h 函数1. h 函数源码解析// 在 TS 中函数声明的时候我们就必须指定函数的参数及其类型以及函数的返回值类型，可是如果我们想让这个函数接受参数更加灵活，可以利用 TS 函数的重载（），进行同名函数不同参数及返回值类型定义，然后在函数体内部再通过对所传入的参数进行校验，根据不同参数的组合实现不同的

2021-08-02 17:12:45 228

原创 ESLint & StyleLint & CommitLint 前端规范化学习笔记

前端规范化学习笔记一、规范化标准1. 为什么要有规范化标准？2. 哪里需要规范化标准3. 实施规范化的方法二、ESLint 介绍1 使用步骤2. eslint 配置文件解析3. ESLint 配置注释4. ESLint 在 gulp 中的支持5. ESLint 在 webpack 中的支持一、规范化标准规范化是我们践行前端工程化中重要的一部分1. 为什么要有规范化标准？软件开发需要多人协同不同开发者具有不同的编码习惯和喜好不同的喜好增加项目维护成本每一个项目或是团队需要明确统一标准2.

2021-05-17 17:44:22 425

原创 Rollup && Parcel 学习笔记

Rollup 学习笔记一、Rollup的认识二、Rollup插件的使用1. rollup-plugin-json2. rollup-plugin-node-resolve3. rollup-plugin-commonjs一、Rollup的认识rollup官方文档相比于webpack来说更为小巧Rollup 仅仅使一款ESM打包器（默认只能够处理 ESM 的模块），而webpack配合plugins可以实现大部分前端工程化的需求。打包的结果更加的扁平。打包会以 tree-shaking 的形式进

2021-05-12 15:16:42 1518

原创 WebPack 笔记

WebPack 笔记前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇文章正文内容，下面案例可供参考一、pandas是什么？示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。二、使用步骤1.引入库代码如下（示例）：import numpy as npi

2021-05-11 17:49:30 184

原创模块化规范之ES Modules && CommonJS 规范学习笔记

模块化开发一、模块化发展的过程二、ES Modules 特性三、ES Modules 导入出注意事项：import注意事项：四、ES Modules 浏览器兼容性问题五、ESModules 在 Node 环境中的支持一、模块化发展的过程下面是一篇关于前端模块化发展的文章模块化在不同环境的使用：浏览器环境： ES Modules 模块化规范Node环境： CommonJS 模块化规范二、ES Modules 特性<!DOCTYPE html><html lang="en"&g

2021-04-25 09:20:36 504

原创 Grunt && Gulp前端自动化构建工具

前端自动化构建一、自动化构建的认识1. 概念相关2. 自动化初体验二、Grunt1. Grunt 的基本使用2. Grunt 标记任务失败1. 如何标记2. 失败之后带来的影响3. Grunt 的配置方法4. Grunt 多目标任务5. Grunt 插件的使用三、Gulp1. 基本使用2. gulp 创建组合任务总结一、自动化构建的认识1. 概念相关学自动化构建的目的？比如说在一个项目中我们想使用 ecmascript 的最新特性，以及想使用 sass来编写css，但这些内容都不是浏览器所能够识别的

2021-04-19 11:30:54 183 2

原创 Gulp 快速入门（内含case）

Gulp特点（相对于 Grunt）：高效，易用一. 基本使用安装 gulp 依赖yarn add gulp -D再根目录创建 gulp工具入口文件 gulpfile.js通过 yarn gulp 来运行任务// 默认任务yarn gulp// 普通任务yarn gulp 任务名二. gulp 创建组合任务const { series, parallel } = require('gulp')// series创建的是串行任务（按照任务次序执行,前一个任务

2021-04-19 11:25:27 222 2

原创 Yeoman && Plop 通用脚手架工具

Yeoman一、脚手架的了解1. 脚手架的作用二、Yeoman的认识三、Yeoman 基本使用1. 创建node项目的例子2. Sub Generator3. Yeoman的总结四、自定义Generator一、脚手架的了解1. 脚手架的作用相同类型的项目往往会有许多相似之处，脚手架工具就是为了帮助我们因为这些相似之处所带来的 “重复劳动”，使我们能够快速得到一个项目的基础结构。相似之处的体现以 vue 项目代码为例相同的基础代码。如： vueRouter初始化，vuex初始化，vue实例的创建

2021-04-12 20:03:36 269

原创 JavaScript 垃圾回收机制的认识

JavaScript 性能优化内存管理JavaScript 中的垃圾回收二、使用步骤1.引入库2.读入数据总结内存管理内存：计算机中所有程序的运行都在内存中进行，由可读写单元组成，表示一片可操作空间管理：人为的去操作一片空间的申请，使用，释放内存管理：开发者主动去申请空间，使用空间，释放空间管理流程：申请 -> 使用 -> 释放JavaScript 不支持开发者进行手动的去对内存进行管理，当JS执行引擎执行代码的时候，遇见变量会自动的在内存中为该变量分配空间// 申请内

2021-04-08 09:56:14 136

原创浏览器 Performance 工具的使用

性能监测工具内存问题的体现内存的问题监控内存的方式1. 任务管理器监控内存2. Timeline 记录内存3. JS 堆快照查找分离DOM内存问题的体现在假设网络没有问题的前提下页面延迟加载，经常性的暂停页面持续性出现糟糕的性能页面在使用过一段时间，出现卡顿。内存的问题内存泄漏：内存使用持续升高，没有下降的节点，证明代码中存在内存泄漏问题。内存膨胀：内存的膨胀的鉴定首先需要确认时设备的问题，还是程序的问题。如果在多个主流设备上，程序都出现了糟糕的表现，可以确定为内存膨胀的问题。频繁的

2021-04-05 13:17:58 343

原创 TypeScript 快速入门

JS 自有类型系统的问题强类型与弱类型静态类型与动态类型JS自有类型系统的问题TypeScript强类型与弱类型编程语言的划分从安全的维度划分强类型：变量类型定义之后不会任意进行隐式类型转换 (JAVA)弱类型：会进行隐式转换 (JS)强类型优势错误更早暴露。如：编译时就知道代码的错误了代码更智能，编码更准确。如：编辑器知道变量类型，会实时进行提示减少不必要的类型判断。静态类型与动态类型编程语言从类型检查的维度划分静态类型：变量在声明的时候其类型就是明确的，声明过后他的类型是不允许

2021-03-30 17:49:33 2423 3

原创 JAVASCRIPT 通过FLOW实现类型检查,解决JS语言开发大型应用的所面临的缺陷

Flow基本的使用Flow的认识flow的基本使用1. 通过flow官方提供的flow-remove-types 包2. 使用Babel配合些插件也可以实现3. flow开发插件4. flow 会智能的进行类型推断5. flow类型注解的使用语法6. flow会对js运行环境所提供的API进行校验Flow的认识Flow FACEBOOK团队推出的JS类型检查器。是为了解决JS语言的是弱类型以及动态类型的缺陷.目前很多框架如VUE也有用到FLOW进行类型检查。了解FLOW对我们日后看VUE源码有一定的帮

2021-03-28 21:38:39 315 1

原创重温JAVASCRIPT ES6

JAVASCRIPT 详解你不知道的JAVASCRIPTECMASCRIPT 的发展过程ECMASCRIPT 2015 的新特性弥补了本身语言的缺点与不足引入块级作用域增加了需要新功能便于开发如：结构... 语法的应用字符串数组函数增加了新的类型如： set map类型作用域ECMASCRIPT ES7你不知道的JAVASCRIPTECMASCRIPTECMASCIRPT 是 JACASCRIPT 语言的标准既为 JACASCRIPT提供了最基本的语法，他约定了代码该如何编写（如何定义变量，定

2021-03-28 17:05:26 519 1

原创函数式编程&&异步编程&&手写Promise 作业

文章目录简答题代码题简答题一、谈谈你是如何理解JS异步编程的，EventLoop、消息队列都是做什么的，什么是宏任务，什么是微任务？代码题二、将下面异步代码使用Promise的方式改进// 分析: 这行代码的目的是输入 a + b + c && 解决回调地狱// 解:const promise = new Promise((resolve, reject) => { setTimeout(function () { resolve('hello') },

2021-03-22 15:02:58 165

原创 Javascript Promise 手把手教你封装属于你自己Promise 小白都能看得懂的Promise原理

文章目录前言一、Promise 核心逻辑的实现1. promise处理同步代码2. promise 处理异步代码二、then方法功能进一步的实现1. promise实例的then方法可以多次调用2. then 方法的链式调用3. then方法的链式调用识别 Promise 对象自返回4. then方法捕获异常处理，完善其他功能5. 将then变为可选参数三、Promise对象静态方法实现1. Promise.all2. Promise.resolve3. Promise.reject四、finally方法的

2021-03-22 10:27:02 537

原创 JS中函数式编程详解版(FunctionalProgramming,FP)

函数式编程详解函数式编程的认识函数式编程前置知识函数式编程基础函子函数式编程的认识函数式编程是编程中的一种范式，与面向对象这种类型编程的风格（思想）是并列关系。（编程范式：编程思想或是说编程中的一种编程风格）函数式编程：将现实世界中的事物与事物之间的联系抽象到程序世界（抽象其运算过程）程序的本质：根据输入通过某种运算获得相应的输出，程序开发过程中会涉及很多有输入和输出的函数函数式编程的函数是指数学中的函数例如：** y=sin(x)** ,x和y的映射关系x->f(联系、映射

2021-03-17 23:40:49 3149 19

weixin_51457459的博客