- 博客(21)
- 收藏
- 关注
RSS订阅原创 函数式编程 | 高阶函数 | 纯函数 | 闭包 | 柯里化
函数式编程范式一、函数式编程1.函数式编程意义：函数式编程是随着 React 的流行受到越来越多的关注vue 3.X 拥抱函数式编程函数式编程可以抛弃 this打包时更好的 tree Shaking 过滤无用代码很多开源代码库协助函数是开发：loadsh、underScore、ramda2.函数式编程的定义编程中有很多编程方式：面向过程：根据过程一步一步实现功能；面向对象：面向对象将现实世界中的事物抽象成程序世界中的类和对象，通过封装、继承、多态来演示事物事件的联系；函数式编程：
2021-11-06 12:21:41
300
原创 2021前端面试部分汇总
一、vue部分：1.vue 核心思想：数据驱动与组件化数据响应式：vue会将data内部对象使用 object.defineproperty() 转为 getter/setter ，当访问或更改这些对象时，同时触发getter/setter，内部对 DOM 进行操作，实现响应式。 vue3.x 中使用 proxy 监听这些对象，而非属性，避免递归循环监听。2.data 为什么是函数？避免组件相互影响，data 每次返回的是一个新对象，存放组件内部自己的数据，党内部数据改变时，并不会影响基于组件的其他
2021-10-06 19:07:23
159
原创 React - 扩展
1.setStatesetState更新状态的2种写法(1). setState(stateChange, [callback])------对象式的setState 1.stateChange为状态改变对象(该对象可以体现出状态的更改) 2.callback是可选的回调函数, 它在状态更新完毕、界面也更新后(render调用后)才被调用(2). setState(updater, [callback])------函数式的setState 1.updater
2021-08-31 23:46:40
189
原创 react 和 react-redux ？
1.redux 理解1.1.redux 是什么redux是一个专门用于做状态管理的JS库(不是react插件库)。它可以用在react, angular, vue等项目中, 但基本与react配合使用。作用: 集中式管理react应用中多个组件共享的状态。1.2. 什么情况下需要使用redux某个组件的状态，需要让其他组件可以随时拿到（共享）。一个组件需要改变另一个组件的状态（通信）。总体原则：能不用就不用, 如果不用比较吃力才考虑使用。1.3. redux工作流程Compon
2021-08-30 20:49:43
298
原创 React-知识点总结
一、todoList案例相关知识点 1.拆分组件、实现静态组件，注意：className、style的写法 2.动态初始化列表，如何确定将数据放在哪个组件的state中？ ——某个组件使用：放在其自身的state中 ——某些组件使用：放在他们共同的父组件state中（官方称此操作为：状态提升） 3.关于父子之间通信： 1.【父组件】给【子组件】传递数据：通过props传递 2.【子组件】给【父组件】传递数据：通过props传递，要求父提前给子传递一个函数 4.注意defa
2021-08-26 23:53:10
141
原创 React基础-生命周期
1.引出生命周期unmountComponentAtNode() 卸载组件componentDidMount（）组件挂载完毕componentWillReceiveProps （） 组件将要接受参数 （子组件将要接受新参数时触发的生命周期函数）shouldComponentUpdate() 是否可以组件更新，必须有 Boolean 值得返回，如果为 true 则继续生命周期，如果为 false 则不执行任何后续操作，相当于更新操作的阀门componentWillUpdate （） 组件即将要更新
2021-08-26 23:43:23
149
原创 React-基础语法
1.jsx 语法规则定义：全称: JavaScript XML，\1. react定义的一种类似于XML的JS扩展语法: JS + XML本质是 React.createElement(component, props, …children) 方法的语法糖，用来简化创建虚拟DOM ；它不是字符串, 也不是HTML/XML标签，它最终产生的就是一个JS对象；1>定义虚拟DOM时，不要写引号。2>标签中混入js表达式时要用{}，遇到以 { 开头的代码，以JS语法解析3>样式的类名指定
2021-08-26 23:38:12
150
原创 React 相关问题
1.请简述 React 16 版本中初始渲染的流程jsx 转换成 react 元素babel-react 会将jsx 转换为 React.createElement 函数调用React.createElement 会 jsx 转换成 react element （react element 就是 一个用来描述react 元素的对象。）render （协调层）此阶段负责创建 Fiber 数据结构并为 Fiber 节点打标记，标记当前 Fiber 节点要进行的 DOM 操作。首先为每一个react
2021-08-01 00:28:47
160
原创 React 实现 Fiber 算法
介绍：fiber 算法的核心 API 是 requestIdleCallback，利用浏览器的空余时间执行任务，如果有更高优先级的任务要执行时，当前执行的任务可以被终止，优先执行高级别任务。React 16 之前的版本问题：React 16 之前的版本比对更新 VirtualDOM 的过程是采用循环加递归实现的，这种比对方式有一个问题，就是一旦任务开始进行就无法中断，如果应用中组件数量庞大，主线程被长期占用，直到整棵 VirtualDOM 树比对更新完成之后主线程才能被释放，主线程才能执行其他任务。
2021-07-29 09:32:21
760
原创 React基础回顾
1. React 介绍React 是一个用于构建用户界面的 JavaScript 库，它只负责应用的视图层，帮助开发人员构建快速且交互式的 web 应用程序。React 使用组件的方式构建用户界面。2. JSX 语法在 React 中使用 JSX 语法描述用户界面，它是一种 JavaScript 语法扩展。在 React 代码执行之前，Babel 会将 JSX 语法转换为标准的 JavaScript API。JSX 语法就是一种语法糖，让开发人员使用更加舒服的代码构建用户界面。jsx语法：相
2021-07-22 23:57:35
112
1
原创 Vue.js 3.0 详解
1、Vue 3.0 性能提升主要是通过哪几方面体现的？响应式系统升级使用 Proxy 对象重写响应式系统：vue2.x 中 使用 defineProperty 在初始化时遍历 data 中的成员，实现响应式，若成员中嵌套成员则递归实现 get 、set ,如果 data 中的成员未被使用，也会做响应式处理的操作。但在 Vue3 中，只有在成员被用到的时候才会处理响应式可以监听动态新增的属性可以监听删除的属性可以监听数组的索引和 length 属性编译优化Vue2.x 中通过标记
2021-06-12 13:58:23
489
原创 Vue.js 3.0 探索
1.源码组织方式的变化源码采用 TypeScript 重写使用 Monorepo 管理项目结构，每个模块可单独测试、发布、使用源码目录结构：compiler 开头的为编译相关的代码，compiler-core：与平台无关的编译器compiler-dom：浏览器下的编译器依赖于compiler-corecompiler-sfc：single-file-component 编译单文件组件，依赖compiler-core、compiler-domcompiler-ssr：服务端渲染编译
2021-06-05 21:07:06
126
原创 Vuex 使用解析+原理模拟
Vuex 注册：// main.js 中导入 store，并在 Vue 中注册import Vue from 'vue'import App from './App.vue'import router from './router'import store from './store'Vue.config.productionTip = falsenew Vue({ router, store, render: h => h(App)}).$mount('#
2021-04-03 22:57:17
91
原创 Vue响应式原理 -【2】
模拟Vue响应式原理将 data 中的成员转换成 get 与 set 注入到 Vue 实例上，则在 vue 的实例中则可以访问到 data 中的成员Vue实例中的成员：data：记录data中的成员转换成get与set，data：记录 data 中的成员转换成 get 与 set，data：记录data中的成员转换成get与set，data 中的setter是真正监视数据变化$options：把构造函数的参数记录到options中_data：和 data指向同一个对象，下划线开头的为私有成员，d
2021-03-07 16:12:21
227
原创 Vue响应式原理 -【1】
模拟Vue响应式原理重点回顾：数据驱动：数据响应式、双向绑定、数据驱动数据响应式：数据模型仅仅是普通的JavaScript对象，而当我们修改数据时，视图会进行更新，避免了繁琐的DOM操作（ Vue 内部封装了复杂的 DOM 操作），提高开发效率；双向绑定：包含数据响应式，数据改变，视图改变，反之亦然；Vue 中我们可以使用 v-module 在表单元素上创建数据双向绑定；数据驱动是 Vue 最独特的特性之一：开发过程中仅需要关注数据本身，不需要关心数据是如何渲染到视图；数据响应式的核心原理：V
2021-03-07 16:10:05
154
2
原创 Vue-Router 原理实现
Vue-Router 原理实现基础回顾使用步骤：文件结构如下：// router/index.js 配置// 导入：import Vue from 'vue'import VueRouter from 'vue-router'import Index from '../views/Index.vue'// 1. 注册路由插件// Vue.use 用来注册组件// 接收一个参数，如果参数是函数直接调用来注册插件，// 如果参数是对象，会调用传入对象的 install 方法注册插件V
2021-03-07 16:06:46
145
原创 Webpack 与 自动化构建
Webpack快速上手：yarn init --yesyarn add webpack webpack-cli --dev//Webpack.config.js 配置文件const path = require('path')module.exports = { // 这个属性有三种取值，分别是 production、development 和 none。 // 1. 生产模式下，Webpack 会自动优化打包结果； // 2. 开发模式下，Webpack 会自动优化打包
2021-02-16 00:40:41
558
原创 前端工程化
前端工程化可以解决的问题：传统语言/语法的弊端无法使用模块化/组件化重复的机械式工作代码风格统一、质量保证依赖后端服务器接口支持，整体依赖后端项目工程化的表现：一切重复的工作都应该被自动化，但工程化不等于某个工具；成熟的工程化集成：creact-react-app vue-cli angular-cli gatsby-cli脚手架工具：本质作用：创建项目基础结构、提供项目规范和约定相同的组织结构相同的开发范式相同的模块依赖相同的工具配置相同的基础代码
2021-01-25 18:07:51
169
原创 JavaScript性能优化
前言：代码为什么需要优化？web应用日益丰富，用户体验至关重要，前端性能备受关注实现相同的结果下，哪种类型JavaScript代码具有更高性能高性能的背后是数据快速存取，也是优秀内存管理的体现JavaScript内存管理（Memory Management）：内存：有可读写的单元组成，表示一片可操作空间管理：人为的去操作一片空间的申请、使用和释放内存管理：开发者主要申请空间、使用空间、释放空间管理流程：申请 - 使用 - 释放JavaScript中的垃圾回收：JavaScri.
2021-01-25 17:59:28
145
原创 JavaScipt【函数式编程】
定义：用来描述数据（函数）之间的映射。（可以理解为对运算过程的抽象）学习意义：函数式编程是随着 React 的流行受到越来越多的关注Vue 3也开始拥抱函数式编程函数式编程可以抛弃 this打包过程中可以更好的利用 tree shaking 过滤无用代码方便测试、方便并行处理有很多库可以帮助我们进行函数式开发：lodash、underscore、ramda// 非函数式 let num1 = 2 let num2 = 3 let sum = num1 + num2 // 函数式
2021-01-25 17:57:31
124
原创 ECMAScript 新特性
ECMAScript 新特性前言：ECMAScript是JavaScript的语言本身，通常看作JavaScript的标准化规范，但其实JavaScript是ECMAScript的扩展语言，ECMAScript只提供了最基本的语法，下图分别为浏览器中的JavaScript与Node.js中的JavaScript组成：所以，JavaScript的语言本身指的就是ECMAScript。 ECMAScript从2015年开始实现每年一个版本的更新，并以年份命名，而ES2015也就是我们俗称的ES6，在经
2021-01-12 13:29:18
95
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人