雪之樱的小站

什么是虚拟DOM和diff算法在前端发展的初期，前端工程师们使用JQ这样的框架对DOM进行命令式的操作，这种方式最大的好处是易学，直白，但在前端页面和业务逻辑不断复杂的今天，命令式的操作dom已经不适合大型项目的开发，随之而来的三大框架，vue，react， angular均使用了声明式的操作DOM，开发者只要描述状态和和DOM的映射关系，框架就会帮我们把状态转化成渲染好的视图，虚拟DOM正是状态和真实DOM之间的一个中间层，为什么要有这个中间层呢，因为操作DOM的代价是非常大的，虚拟DOM可以描述描述真实dom的信息，通过对比前后的虚拟dom找出DOM里真正需要的部分，从而减少DOM操作，提高性能。比较前后虚拟dom的算法就是diff算法，这是整个虚拟dom机制的最核心优化之一。 VNodeVNode本质上是一个JS对象，只是这个对象是用来描述真实DOM而已，Vue的实现如下。( 函数参数里的 ?: 的意思是，这个参数可以没有，但是如果有的话就要是某个指定的类型，这是flow的语法） 12345678910111213141516171819202122232425262728293 ...

柯里化柯里化又称为部分求值。一个 柯里化的函数首先会接受一些参数，接受了这些参数之后，该函数并不会立即求值，而是继续返回另外一个函数，刚才传入的参数在函数形成的闭包中被保存起来。待到函数被真正需要求值的时候，之前传入的所有参数都会被一次性用于求值。 简单来说就是实现这样的效果： add(1)(2, 3)(4)(5) = 15 实现一个简单的柯里化函数并不困难，我们要做只有两点 用闭包保存之前传入的参数 在每次传入参数后判断是否已经收集了足够多的参数，如果是就执行函数 来看看代码实现 12345678910111213141516171819202122232425/** * * @param targetFun 要柯里化的函数 * @param targetLength 要收集的参数个数 * @param targetThis 函数执行时绑定的this * @returns {wait} */function curry(targetFun, targetLength, targetThis) { // 需要收集的参数个数，收集足够 ...

最终效果是这样的，下面我们一步步实现它 编写dom结构我们需要的dom结构很少，只要一个container和一个content就可以了 12345<div class="container"> <div class="content"> Genius only means hard-working all one's life. </div></div> 初始化样式这里主要是一些无关样式 123456789101112131415161718192021222324252627282930313233343536373839body, h1{ margin: 0; padding: 0;}html, body { font-size: 19px; font-family: serif; color: rgba(0,0,0,0.8);}.container { width: 100%; height: 100%; ...

算是我写的第一个能用的安卓项目 同时也是我最后一个安卓项目 github地址：https://github.com/sliyoxn/wanandroid 如果非要说点什么的话，或许这个app见证了我最努力的时光吧。 运行截图：

今天更新了一波chrome，开始用着还没啥，然后我在调节音量时感觉到了事情有点不大对劲，woc这是什么，为什么要在音量条后面放这个东西残害我的双眼，行吧，谷歌一波成功解决 第一步 在地址栏输入： chrome://flags/“>chrome://flags/ 然后你就会看到下面的页面 第二步 按Ctrl + F键，输入 Hardware Media Key Handling ，定位到对应位置后，把default改成disable 然后下面会弹出一个弹框让你重启浏览器，直接点relaunch重启就完事 然后一切正常了

前言嗯嗯嗯，等写完这个博客我就去复习期末。 实现过程基本属性对一个promise来说，我们需要有下面这些东西 对应三个状态的表示 当前promise的数据（也就是成功获得的数据或者失败的原因） 当前promise的状态 成功时要执行的回调函数列表 失败时要执行的回调函数列表 另外，为了使用属性私有化，我们要用一个立即执行函数来生成class，然后私有属性全部使用Symbol类型定义 12345678910111213141516171819202122const MyPromise = (function () { // 对应的三个状态 const PENDING = "pending"; const RESOLVED = "resolved"; const REJECTED = "rejected"; // 当前promise的数据 const PromiseValue = Symbol("PromiseValue"); // 当前promise的状 ...

写在前面最近发现了一个叫co的神奇东西，似乎是es7没发布时，没有async，await时的一个非常好用的库，感觉挺好玩的，打算模拟实现一个。 实现过程只能执行同步代码版这一版的代码十分简单，主要做到三点就行了 把返回的promise的resolve函数一层层往下传，当迭代结束时，把生成器函数的返回值传给resolve函数 如果没有结束迭代，就把上一次迭代获得的值作为下一次next函数执行的参数传入，一直重复执行直到迭代结束为止 123456789101112131415161718192021222324252627function run(generatorFunc, data) { // 获得生成器 const generator = generatorFunc(data); // 执行next方法获取结果 let result = execute(generator); return new Promise((resolve, reject) => { // 处理结果 handleResul ...

写在前面我和这个问题也算是有段因缘了，在初学JS时，就遇到了这个很蛋疼的东西，也算是JS中一个很杂的知识点，每次想起时都让我头疼不已，后来我决定花点时间去研究它，然后我查了一下《JavaScript权威指南》和《JavaScript高级程序设计》和文档，然后画了一张大致的图来帮帮助自己理解，大概就是下面那个 后来我发现这个图画的可能只有我自己看的懂，加上后来我学了更多的东西，对他也有了更深的了解，于是打算再写个博客分析一波这个东西。虽然这个东西，我是从来不用的，=== 它不香吗。 先了解一下JS的变量类型JS中的变量类型大致可以分为两种，基本类型（ primitive values ）和引用类型（ reference values ） 基本类型有： Undefined, Null, Boolean, String, Symbol（es6新增）, Number 引用类型有：Object 如果你不知道Symbol是什么的话，可以看看这个：http://caibaojian.com/es6/ 理解==的运行过程== 的 ...

如果你也想建一个wordpress博客但是没有头绪，欢迎阅读这篇文章，这篇文章记录了我是怎么零基础用wordpress建站的。虽然算不上教程，但如果你完全找不到教程，看看这篇文章也是可以的，毕竟里面分享了我搭建时使用的教程和文档，也记录了一些踩过的坑，希望能帮到你。 购买服务器首先要购买服务器，我个人推荐阿里云，另外如果你是学生可以申请学生认证，服务器一年只要114，可以说很实惠了。虽然配置不高，但是如果你的站点访问量不大应该没啥大问题。 学生云链接：https://promotion.aliyun.com/ntms/act/campus2018.html 配置我推荐买下面这个，没有必要提前预装系统一些东西，也不要买window系统的，安全性不是那么好，不用担心不会Linux，后面的操作基本都是复制粘贴。另外最好买轻量应用服务器，因为带宽会大不少，而且其实1000G也够用的了。 搭建站点然后你就可以按照这个文章来搭了：https://themeforwp.net/archives/wordpress-website-tutorial/ 如果你的服务器是按我的选项买的，有几点要注意，可 ...