Nolan的博客 | Nolan's Blog

Posted by nolan on February 4, 2020

async await VS Promise

async await VS Promise, 实现啰嗦的妻子。

场景：啰嗦的妻子丈夫和妻子去看电影，排队时，妻子却说自己饿了，去便利店买东西； Promise 实现 console.log('person1: show ticket') console.log('person2: show ticket') console.log('husband: let go in') console.log('wife:no, i am hu...

Posted by nolan on February 4, 2020

前端简史

前端的发展历程

前端旧史 1990 HTML 1990 年，Tim 以超文本语言 HTML 为基础在 NeXT 电脑上发明了最原始的 Web 浏览器； 1994 W3C 1994 年底，由 Tim 牵头的万维网联盟（World Wide Web Consortium）成立，这标志着万维网的正式诞生； 1995 Jav...

Posted by nolan on February 3, 2020

前端异常捕获和上报系统

window.onError

如何捕获异常 try catch try { var a = 1; var b = a + c; } catch (e) { // 捕获处理 console.log(e); // ReferenceError: c is not defined } 弊端：不适用于整个项目的异常捕获 window.onerror windo...

Posted by nolan on February 2, 2020

HTML5 介绍

HTML5 带来了什么新东西？

一、概述 HTML5 是一种新的 HTML 标准版本，于 2014 年发布。二、更新 2.1 更好的语义新增区块和段落元素 <section>,<article>,<nav>,<header>,<footer>,<aside>,<hgroup> 新增...

Posted by nolan on January 29, 2020

React 长列表优化

waterfall无限滚动下拉加载的实现

思路对于滚动的组件，在 componentDidMount 方法中做判断：若是初次视口内可见，则直接发请求渲染；若不可见，则绑定 onScroll 事件，在滚动事件发生后，再次进行视口内可见性判断，若滚动后组件可见，则发请求渲染，并移除绑定的 onScroll 事件对于 onScroll 事件，要做防抖处理； ...

Posted by nolan on January 20, 2020

js 异步方案

callback、promise、generator、async

callback 是最初的方案 function _fetch(callback){ const xhr = new XMLHttpRequest() xhr.onReadyStateChange = ()=> { if(xhr.readyState = xhr.Done && xhr.status == 200 ){ ...

Posted by nolan on January 5, 2020

Promise 源码剖析

promise 的状态与值，then、catch、finally方法，resolve、reject、race、all等静态方法

Promise 的状态和值状态 Pending（进行中） Resolved（已成功） Rejected（已失败）状态只能由 pending 到 resolved 或 rejected，且改变后将一直...

Posted by nolan on January 4, 2020

【移动端开发】三种跨平台技术

【h5 + 原生】【js + 原生控件】【自绘引擎 + 原生调用】

h5 + 原生原理将 App 需要动态变动的内容通过 H5 实现，通过原生的网页加载控件 WebView 来加载； WebView 本质是浏览器内核，h5 运行在内核之上，对系统能力没有访问权限；混合框架通过框架代码实现一些访问系统内里的 api，暴露给 WebView 供 js 调用；（这种依赖于 WebView 用于 js ...

Posted by nolan on December 5, 2019

网站存储技术

cookie localStorage sessionStorage IndexDB

cookie 读取 document.cookie 写入 document.cookie = newCookie // newCookie 就是一个键值对形式的字符串 ps.用这个方法一次只能对一个 cookie 的值进行设置或更新； cookie 的属性 ;path=path 默认为当前文档位置的路径 ;dom...

Posted by nolan on December 1, 2019

Nolan's Blog

过程式编程vs函数式编程vs面向对象编程

以一个表单页面为例，通过三种不同风格的编码，实现表单的校验和提交。