- 博客(22)
- 收藏
- 关注
RSS订阅原创 解读Vue源码之路
Vue2.x源码解读之路解读源码之前的准备需要下载Vue的源码，直接从github上clone即可。需要了解Flow：JavaScript的静态类型检查器相关知识。需要了解打包工具RollupVue打包的版本– vue.js/vue.common.js 完整版– runtime.js是运行时版– min.js是压缩版完整版：同时包含编译器和运行时的版本。编译器：用来将模板字符串编译成JavaScript渲染函数的代码，体积大、效率低。把template模板内容转换为JavaScrip
2021-06-28 15:59:16
202
原创 Virtual DOM爬坑之路
虚拟DOM什么是 Virtual DOMVirtual DOM(虚拟 DOM)，是由普通的 JS 对象来描述 DOM 对象，因为不是真实的 DOM 对象，所以叫 Virtual DOM真实 DOM 成员let element = document.querySelector('#app')let s = ''for (var key in element) { s += key + ','}可以使用 Virtual DOM 来描述真实 DOM，示例 { sel: "di
2021-06-08 17:40:52
113
原创 Vue响应式原理
Vue响应式原理数据驱动Vue数据响应式的核心原理Vue2.x的响应式核心原理模拟Vue3.x的响应式核心原理模拟Vue自定义事件发布订阅模式观察者模式实现一个最小版本的VueVue.jsObserver.jsCompiler.jsDep.jsWatcher.js数据驱动// 在模拟vue响应式原理之前：需要了解：数据驱动、响应式的核心原理；发布订阅模式和观察者模式// 数据响应式：数据响应式中的数据就是数据模型，基于vue开发的数据模型就是普通的JavaScript对象，当我们修改数据时，视图会进
2021-06-08 16:37:13
157
原创 vue-router原理以及vue-router核心代码实现
Vue路由Vue的基础结构VueRoutervue-router的基本结构vue-router核心代码动态路由嵌套路由编程式导航vue-router的Hash模式和History模式Hash模式History模式vue-router的类图实现Hash模式的核心代码实现History模式的核心代码Vue的基础结构对于Vue的基本机构，我相信小伙伴们肯定都会有很多的了解；在这里小编就不多做介绍了，简单的列一下：<!DOCTYPE html><html lang="en">&l
2021-06-08 11:44:41
300
原创 前端工程化之开发脚手架及封装自动化构建工作流
前端工程化概念前端工程化指的是：遵循一定的标准和规范；通过工具去提高效率，降低成本的手段。为什么要做前端工程化：1、想要使用ES6+新特性，但是兼容有问题 2、想要使用Less、Sass、PostCSS增强CSS的编程性，但是运行环境不能直接支持。3、想要使用模块化的方式提高项目的可维护性，但是运行环境不能直接支持。4、部署上线前需要时候东压缩代码及资源文件；部署过程需要手动上传代码到服务器。 5、多人协作开发，无法硬性统一大家的代码风格，从仓库中pull回来的代码质量无法保证。6、部分功能开发时需要
2021-04-20 13:46:54
222
原创 JS语言层面性能优化
小编这里说的js性能优化只是在针对js语言上的优化。小编给大家提供一个js语言性能测试的网站：https://jsbench.me/avaScript 内存管理内存：由可读写单元组成，表示一片可操作空间管理：人为的去操作一片空间的申请、使用和释放内存管理：开发者主动申请空间、使用空间、释放空间管理流程：申请 – 使用 – 释放垃圾回收js内存管理是自动的对象不再被引用的时候是垃圾对象不能从根上访问到的时候是垃圾js中的可达对象可以访问到的对象就是可达对象（引
2021-04-15 00:07:39
84
原创 TypeScript相关知识
TypeScript语言TypeScript 是 JavaScript 的超集，包含了 JavaScript 的所有元素，并扩展了语法。 TypeScript比JavaScript多了类型系统和ES6+ 但是最终都会编译成JavaScript 。TypeScript是强类型的。TypeScript使用// 使用typescript 先安装模块：yarn add typescript --dev// 然后就可以使用tsc的命令来运行文件 yarn tsc 文件名 来编译ts文件// 也可以使
2021-04-14 23:46:43
153
1
原创 ES6新增特性(下)
迭代器 (Iterator)在上次的博客中我们遗留了一个问题：for…of… 对普通对象进行遍历会出现错误。如果要对普通对象进行for…of…循环的话；这个时候就需要用到迭代器了。举个例子：const set = new Set(['foo', 'bar', 'baz'])const iterator = set[Symbol.iterator]()console.log(iterator.next()); // { value: 'foo', done: false }console
2021-04-14 23:06:46
74
原创 ES6新增的特性(上)
作用域ES6之前只有两个变量作用域（全局作用域和局部作用域）；ES6中新增了块级作用域 例如：if(true) {var foo = 'sfy'}console.log(foo) // 这里我们很明显都知道他的结果就是 sfy但是如果是下面的这种方式if(true) {let foo = 'sfy'}console.log(foo)// 这次的结果就和上面的不一样了；他会出现：ReferenceError: foo is not defined 。// 从这个例子我们就能看出
2021-04-02 10:16:03
101
原创 异步方案之Generator和async
Generator生成器函数所谓生成器函数就是在普通函数的基础上加了一个*号。function* foo() { console.log('start'); // 生成器函数可以随时使用yield来向外返回一个值 try { const res = yield 'foo' console.log(res); } catch (e) { console.log(e); }}// Generator函数会返回一个内部
2021-03-30 10:38:00
78
原创 js异步编程学习
标题实现JavaScript异步编程方式：回调函数、事件监听、发布/订阅、Promise对象详细的介绍点击这个链接回调函数回调函数是所有异步编程方案的根基。function foo (callback) { setTimeout(function () { callback() }, 3000)}foo(function () { console.log('这个就是一个回调函数'); console.log('调用者定义这个函数，执行者执行这个函数'); cons
2021-03-30 10:32:40
57
原创 异步编程之回调函数
回调函数回调函数是所有异步编程方案的根基。function foo (callback) { setTimeout(function () { callback() }, 3000)}foo(function () { console.log('这个就是一个回调函数'); console.log('调用者定义这个函数，执行者执行这个函数'); console.log('其实就是调用者告诉执行者异步任务结束后应该做什么');})```...
2021-03-30 10:19:25
347
原创 函子
Functor函子定义：容器：包含值和值得变形关系(这个变形关系就是函数)函子：是一个特殊的容器，通过一个普通的对象来实现，该对象具有map方法，map方法可以运行一个函数对值进行处理(变形关系)； 函子内部有一个值；对外还有一个方法map方法。定义一个函子class Container { // 定义一个静态方法 static of就是方法名 static of (value) { // 返回一个函子对象 return new Container(value) }
2021-03-30 10:15:36
136
原创 函数组合
lodash中的函数组合lodash中组合函数flow()或者flowRight()，他们都可以组合多个函数；flow()是从左到右运行；flowRight()是从右到左运行。const _ = require('lodash')// 把数组中的最后一个函数取出来；并把它转成首字母大写。const reverse = arr => arr.reverse()const first = arr => arr[0]const toUpper = s => s.charAt(0).
2021-03-30 10:05:13
124
原创 函数柯里化
柯里化概念当一个函数有多个参数的时候，先传递一部分参数调用它，然后返回一个新的函数接收剩余参数，返回返回结果。柯里化可以让我们给一个函数传递较少的参数得到一个已经记住了某些固定参数的新函数；这是一种对函数参数的缓存；让函数变得更灵活，让函数的粒度更小；可以把多元与函数转换成一元函数，可以组合使用函数产生强大的功能。lodash中的柯里化方法// lodash中的curry方法const _ = require('lodash')// curry方法能够使函数柯里化；参数是一个纯函数；纯函数的参
2021-03-30 09:56:26
68
原创 js 纯函数
纯函数的概念纯函数就是相同的输入会有相同的输出结果；而且没有任何可观察的副作用。纯函数例子let arr = [1, 2, 3, 4, 5, 6, 7]console.log(arr.slice(0, 3))console.log(arr.slice(0, 3))console.log(arr.slice(0, 3))function getSum(n1, n2) { return n1 + n2}console.log(getSum(1, 2))console.log(getS
2021-03-30 09:46:13
88
原创 闭包
js函数闭包闭包的概念在函数外部调用函数内部的变量(能够读取其他函数内部变量的函数)闭包例子function salary(money1) { return function (money2) { return money1 + money2 }}let allSalary = salary(15000)console.log(allSalary(5000))...
2021-03-30 09:29:21
66
原创 小程序加载数据太多，通过上拉加载实现分页
小程序向后台请求数据太多，加载太慢，通过上拉加载实现分页 有时候我们在向后台发送请求的时候，后台由于数据量大，一下返回的数据很多，造成小程序端的加载很慢。当我们遇到这种情况的时候我们可以考虑修改后台，就是小程序端携带一个page参数像后台发起请求，让后台根据传过来的page值来返回相应的数据，但是呢，除了这个方法，还有一个方法就是直接不修改后台，在小程序端也可以实现，就是通过上拉加载跟...
2020-01-08 11:53:22
933
原创 微信小程序一键置顶操作详解：
微信小程序一键置顶操作详解：第一种方式：采用scroll-view滚动视图实现第二种方式，直接用view实现第一种方式：采用scroll-view滚动视图实现下面是代码简介：wxml文件代码展示：js文件代码展示：data: {up_show: false,topNum: 0},// 获取滚动条当前位置scrolltoupper: function (e) {consol...
2020-01-08 11:31:36
4561
原创 常用的加密方式
常用的加密方式有哪些?MD5 , AES , DES, hash+盐其中小编最常用的就是MD5 和hash+盐用MD5加密的时候需要调用hashlib这个包,它的特点是:1.不可逆,只能解密不能加密 2.加密后的数据定长(一般是32位) 3.MD5是一种摘要算法例如:用MD5同时加上最基本的加盐来给信息加密import hashlibdef regist(user_name,user_...
2019-08-07 21:52:14
942
原创 数据库的基本知识(sqlite3数据库创建表并对其进行增删改查)
数据库依据功能可分为两大类:1.关系型数据库: 包括MySQL aqlserver oracle sqlite3 postgresql2.费关系型数据库(MongoDB Redis memcache)什么叫关系型:数据的存储结构一致什么是非关系型:数据的储存结构不一致什么是数据库?存储数据的仓库学会数据库的必备概念: 表 / 连接对象/ 游标 /事务/SQL语句数据库的攻击方...
2019-08-07 21:38:24
799
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人