jsvascript
文章平均质量分 90
zsnpromsie
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
part4-m2
Part 4 · React 框架原理与实战本阶段将带你学习前端圈子中口碑极佳的 React 框架以及它的一些高阶用法、组件库封装、数据流方案、服务端渲染(SSR)、静态站点生成(SSG),同时深入 React 框架内部,剖析 React 部分核心源码和实现,最后还会结合 TypeScript 和蚂蚁金服的 Ant Design 库做出实战。模块二 React 数据流方案专题(Redux、MobX随着一个应用规模的增长,应用的数据状态一定会变得越来越复杂,慢慢的数据流管理成为最主要话题。本模块中原创 2021-08-23 18:43:31 · 199 阅读 · 0 评论 -
part4-m1 笔记
Part 4 · React 框架原理与实战本阶段将带你学习前端圈子中口碑极佳的 React 框架以及它的一些高阶用法、组件库封装、数据流方案、服务端渲染(SSR)、静态站点生成(SSG),同时深入 React 框架内部,剖析 React 部分核心源码和实现,最后还会结合 TypeScript 和蚂蚁金服的 Ant Design 库做出实战。模块一 React 设计原理解密及核心源码解读React 作为前端圈子中口碑极佳的框架,自身的设计非常超前,本模块中,我们会一起深入探索 React 框架本原创 2021-08-19 14:23:29 · 293 阅读 · 0 评论 -
part3-m6
Part 3 · Vue.js 框架源码与进阶本阶段围绕当下国内最主流的前端核心框架 Vue.js 展开,深入框架内部,通过解读源码或者手写实现的方式,剖析 Vue.js 框架的内部实现原理,让你做到知其所以然。同时我们还会介绍 Vue.js 的进阶用法、周边生态以及性能优化,让你轻松应对更加复杂的项目业务需求。模块六 Vue.js + Vuex + TypeScript 实战项目开发与项目优化本模块中我们通过使用 TypeScript 编程语言,基于 Vue.js 全家桶(Vue.js、Vue原创 2021-08-11 17:53:28 · 496 阅读 · 0 评论 -
part3-m5
Part 3 · Vue.js 框架源码与进阶本阶段围绕当下国内最主流的前端核心框架 Vue.js 展开,深入框架内部,通过解读源码或者手写实现的方式,剖析 Vue.js 框架的内部实现原理,让你做到知其所以然。同时我们还会介绍 Vue.js 的进阶用法、周边生态以及性能优化,让你轻松应对更加复杂的项目业务需求。模块五 Vue.js 3.0 Composition APIs 及 3.0 原理剖析本模块中围绕 Vue.js 3.0,重点介绍 Vue.js 3.0 的设计初衷以及 Vue.js 3.原创 2021-08-05 23:04:15 · 364 阅读 · 0 评论 -
part3-m4
Part 3 · Vue.js 框架源码与进阶本阶段围绕当下国内最主流的前端核心框架 Vue.js 展开,深入框架内部,通过解读源码或者手写实现的方式,剖析 Vue.js 框架的内部实现原理,让你做到知其所以然。同时我们还会介绍 Vue.js 的进阶用法、周边生态以及性能优化,让你轻松应对更加复杂的项目业务需求。模块四 搭建自己的SSR、静态站点生成(SSG)及封装 Vue.js 组件库本模块会带你深入 SSR 的实现,自己动手搭建一个自己的基于 Vue.js 的 SSR,然后使用静态站点生成器原创 2021-08-02 00:57:14 · 148 阅读 · 0 评论 -
p3-m2
Part 3 · Vue.js 框架源码与进阶本阶段围绕当下国内最主流的前端核心框架 Vue.js 展开,深入框架内部,通过解读源码或者手写实现的方式,剖析 Vue.js 框架的内部实现原理,让你做到知其所以然。同时我们还会介绍 Vue.js 的进阶用法、周边生态以及性能优化,让你轻松应对更加复杂的项目业务需求。模块二 Vue.js 源码分析(响应式、虚拟 DOM、模板编译和组件化)本模块会带你深入分析 Vue.js 源码,包括:Vue.js 初始化开始、首次渲染的过程、响应式的依赖收集、Wat原创 2021-07-20 12:36:02 · 148 阅读 · 0 评论 -
part3-m1
Part 3 · Vue.js 框架源码与进阶本阶段围绕当下国内最主流的前端核心框架 Vue.js 展开,深入框架内部,通过解读源码或者手写实现的方式,剖析 Vue.js 框架的内部实现原理,让你做到知其所以然。同时我们还会介绍 Vue.js 的进阶用法、周边生态以及性能优化,让你轻松应对更加复杂的项目业务需求。模块一 手写 Vue Router、手写响应式实现、虚拟 DOM 和 Diff 算法首先回顾 Vue Router 的基本使用,以及 Hash 模式和 History 模式的区别,然后自原创 2021-07-15 17:03:19 · 186 阅读 · 0 评论 -
part2-m2
Part 2 · 前端工程化实战本阶段主要以前端工程化为主题,分别从脚手架工具、自动化构建、模块化开发、规范化标准四个维度介绍前端工程化具体该如何落地、如何实践,以此应对复杂前端应用的开发和维护过程,提高开发者的工作效率,降低项目维护成本,从而更好地适应大前端时代下的前端开发工作。模块二 模块化开发与规范化标准此模块中会介绍当下前端开发过程中最重要的开发范式:模块化,我们会介绍模块化在前端行业的演进过程、如何实现模块化开发以及 Webpack 打包工具的使用和核心工作原理;另外我们还会为你介绍原创 2021-07-12 23:47:07 · 186 阅读 · 0 评论 -
part2-m1
Part 2 · 前端工程化实战本阶段主要以前端工程化为主题,分别从脚手架工具、自动化构建、模块化开发、规范化标准四个维度介绍前端工程化具体该如何落地、如何实践,以此应对复杂前端应用的开发和维护过程,提高开发者的工作效率,降低项目维护成本,从而更好地适应大前端时代下的前端开发工作。模块一 开发脚手架及封装自动化构建工作流此模块中会先带你了解什么是前端工程化,以及前端工程化和工具之间的关系;紧接着在脚手架工具的学习中你可以了解到脚手架的本质、工作原理,以及自己从无到有搭建一个自己的脚手架工具;最原创 2021-07-01 20:55:48 · 169 阅读 · 0 评论 -
part1-02笔记
* ./header.vue?vue&type=style&index=0&id=59b9e752&lang=less&scoped=true& in ./components/template/header.vuenpm install less less-loader --save-dev原创 2021-06-27 18:41:19 · 384 阅读 · 0 评论 -
m1
Part 1 · JavaScript 深度剖析函数式编程与 JS 异步编程、手写 Promise任务一:函数式编程范式函数式编程函数式编程的特性(纯函数,柯里化,函数组合等)函数式编程库Lodash学习函数式编程的理由函数式编程是随着React的流行受到越来越多的关注Vue3也开始拥抱函数式编程函数式编程可以抛弃this打包过程中可以更好的利用tree shaking 过滤无用代码方便测试,方便并行处理有很多库可以进行函数式开发:lodash,underscore,r原创 2021-05-25 15:53:52 · 185 阅读 · 0 评论 -
m3
Part 1 · JavaScript 深度剖析函数式编程与 JS 异步编程、手写 Promise任务二:手写Promsie源码Promise 类核心原理的实现Promise 就是一个类 在执行这个类的时候 需要传递一个执行器进去, 执行器会立即执行Promise 中有三种状态 分别为成功 fulfilled 失败reject 等待 pending一旦状态确定后就不可更改resolve被reject函数是用来更改状态的then 方法内部要做的事情就是判断状态 如果状态是成功 调用成功的原创 2021-05-25 15:53:24 · 134 阅读 · 0 评论 -
m2
Part 1 · JavaScript 深度剖析函数式编程与 JS 异步编程、手写 Promise任务二:异步编程异步编程概述采用单线程模式工作的原因JS创建之初是出现在浏览器中的脚本语言,目的是为了实现页面的动态交互,实现页面操作的核心就是DOM操作,就决定了它必须使用单线程模型,否则就会出现很复杂的线程同步问题。设想一下,如果JavaScript是多线程操作,一个线程修改了DOM元素,一个线程删除了DOM元素,那浏览器就不能判断以哪个线程的工作为主.所以在js执行环境中负责执行代码的线原创 2021-05-25 15:51:27 · 112 阅读 · 0 评论 -
Node.js 编写跨平台 spawn 语句
前言Node.js 是跨平台的,也就是说它能运行在 Windows、OSX 和 Linux 平台上。很多 Node.js 开发者都是在 OSX 上做开发的,然后再将代码部署到 Linux 服务器上。由于 OSX 和 Linux 都是基于 Unix 的,因此两者共性很多。Windows 也是 Node.js 官方支持的平台,只要你通过正确的方式写代码,就能在各个平台上毫无压力的跑起来。 ...转载 2019-02-12 18:58:02 · 747 阅读 · 0 评论 -
js数组方法 改变原数组和不改变原数组的方法整理
转载至:https://blog.youkuaiyun.com/love07070707/article/details/79888566 改变原数组: pop():删除 arrayObject 的最后一个元素,把数组长度减 1,并且返回它删除的元素的值。如果数组已经为空,则 pop() 不 改变数组,并返回 undefined 值。arrayObject.pop() *push():*push(...转载 2019-01-10 12:07:00 · 2319 阅读 · 0 评论 -
为网页元素增加resize事件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">原创 2019-01-24 11:29:51 · 1651 阅读 · 0 评论 -
koa2与express中间件机制的实现
// koa 中间件机制 koa1基于迭代器和生成器+prommsie(es6) koa2基于 async/await(es7)class Koa {constructor() {this.middlewares = []}use(middleware) {this.middlewares.push(middleware)}compose() {retur...原创 2019-01-07 22:01:34 · 518 阅读 · 0 评论 -
面试遇到的算法问题
美团面试1. 城市a到城市e有多少条路径问题。a>b>c>ea>b>f>ea>k>e...class Node{constructor(address) {this.address = addressthis.path = []}}let bj = new Node('北京')let tj = ne...原创 2019-01-07 02:52:50 · 441 阅读 · 0 评论 -
Node 定时器详解
【第1201期】Node 定时器详解阮一峰 2018-02-28前言过完今天,2018年过了六分之一了。今日早读文章由@阮一峰老师授权分享。正文从这开始~JavaScript 是单线程运行,异步操作特别重要。只要用到引擎之外的功能,就需要跟外部交互,从而形成异步操作。由于异步操作实在太多,JavaScript 不得不提供很多异步语法。这就好比,有些人老是受打击, 他的抗打击...转载 2019-01-02 15:53:13 · 179 阅读 · 0 评论 -
前端路由简介以及vue-router实现原理
转载https://segmentfault.com/a/1190000015123061后端路由简介路由这个概念最先是后端出现的。在以前用模板引擎开发页面时,经常会看到这样http://www.xxx.com/login大致流程可以看成这样:浏览器发出请求 服务器监听到80端口(或443)有请求过来,并解析url路径 根据服务器的路由配置,返回相应信息(可以是 html...转载 2019-01-10 21:08:35 · 224 阅读 · 0 评论 -
常用的正则表达式匹配
1.给数字加千分位逗号'123456789.99888'.replace(/(?=(?!\b)(?<!\.\d+)(\d{3})+(\.\d+)?$)/g, ',')2.保留固定的整数位和小数位/**** @param {z: 保留整数位数 y: 保留小数位数} param0*/function keepLen(num, {z, x} = {}) {let r...原创 2019-01-04 23:39:13 · 193 阅读 · 0 评论 -
apply,call,bind用js原生实现
// apply第一个参数是函数的执行环境this,第二个参数是一个数组,这个数组会自动散开成为函数的参数Function.prototype.apply = function (x, y) { x = x || window y = y || [] x._apply = this // this为当前函数:使函数指向x if (!x._apply) { // 如果作用域x不可...原创 2018-05-09 20:17:34 · 1500 阅读 · 0 评论 -
es6 实现二叉树的中序,先序,后序,以及插入,删除等操作,以及自平衡树的插入
//二叉树 class BinarySearchTree { constructor(){ this。root = null this .Node = class { constructor(key){ this。键 =键入 此。left = null 这个。right = null } ...原创 2018-04-24 21:02:31 · 519 阅读 · 0 评论 -
斐波那契数列和阶乘的尾函数优化,动态规划解决最小硬币找零和背包问题
// 递归是一种解决问题的方法,它解决问题的各个小部分,直到解决最初的大问题。递归通常涉及函数调用自身// 斐波那契数列尾调用优化 function fibonacci(n, acc1 = 1, acc2 = 1) { if (n === 1 || n === 2) { return acc1 } return fib(n - 1, acc1 + acc2, ac...原创 2018-04-24 17:13:43 · 204 阅读 · 0 评论 -
es6实现冒泡排序,选择排序,插入排序,归并排序,快速排序,桶排序
class ArrayList { constructor() { this.array = [] } insert (...item) { this.array.push(...item) } toString () { return this.array.join() } // 冒泡排序: 比较两个相邻的项,如果第一个大于第二个则交换他们的位...原创 2018-04-23 19:14:07 · 2176 阅读 · 0 评论 -
vue滚动条组件,纯css
<template> <div class="scroll" :style="options" ref="scroll"> <slot></slot> </div></template><script> export def原创 2018-04-12 11:45:33 · 781 阅读 · 0 评论 -
冒泡和捕获的执行顺序
addEventListener() 方法用于向指定元素添加事件句柄。element.addEventListener(event, function, useCapture),其中的event,必须。字符串,指定事件名。 不要使用 "on" 前缀。 例如,使用 "click" ,而不是使用 "onclick"。function 必须。指定要事件触发时执行的函数useCapture 可选。布尔...转载 2018-03-29 15:59:26 · 1032 阅读 · 0 评论 -
字符串复制自身的两种高效方法,包含递归尾函数优化
function repeat(target, n) { var s = '' while (n > 0) { if (n % 2 === 1) { s += target } if (n === 1) break target += target n = n >> 1 } return s}//...原创 2018-03-28 20:13:10 · 329 阅读 · 0 评论 -
~按位非运算符和移位运算符
〜按位非运算符:简单看就是把当前值转化为Nuber类型,并添加一个 - 号,再减去1〜1:-2〜真:-2移位运算符 :2 >> 1可以看成2与2的一次方取商Math.floor(2/2 ^ 1)2 >> 1其实就是2的二进制往右移一位0.00000010“ 00000001值为11 <<2其实就是1的二进制往左移二位.00000001“00000100 pars...原创 2018-03-28 20:07:03 · 322 阅读 · 0 评论 -
用生成器+promise实现async,await
// 用生成器+promise实现async,awaitfunction run(gen) { let args = [].slice.call(arguments, 1), it it = gen.apply(this, args) return Promise.resolve().then(function handleNext(value) { var next = ...原创 2018-04-25 19:39:38 · 530 阅读 · 0 评论 -
处理浏览器端长时间执行JavaScript脚本的两种优化方式:定时器和worker
第一种:定时器方式,把长时间的任务进行分割成一个数组,间隔一定的时间执行。function timeProcessArray(items, process, callBack) { let todo = items.concat() setTimeout(function () { let time = +new Date() do { process(todo...原创 2018-05-03 20:50:17 · 1984 阅读 · 0 评论 -
throttle & debounce(节流&防抖)
转载自https://www.cnblogs.com/wilber2013/p/5893426.html白话debounce和throttle遇到的问题在开发过程中会遇到频率很高的事件或者连续的事件,如果不进行性能的优化,就可能会出现页面卡顿的现象,比如:鼠标事件:mousemove(拖曳)/mouseover(划过)/mouseWheel(滚屏) 键盘事件:keypress(基...转载 2018-12-28 13:09:16 · 202 阅读 · 0 评论 -
一些有趣的js面试题解析
参考地址:http://javascript-puzzlers.herokuapp.com/1. ["1", "2", "3"].map(parseInt)返回值为[1, NaN, NaN] .因为parseInt接受两个参数,即parseInt('1', 0), parseInt('2', 1),parseInt('3', 2)2.[typeof null, null instanc...原创 2018-11-12 01:01:12 · 1952 阅读 · 1 评论 -
javascript权威指南-js的枚举
// 来自JavaScript权威指南219页// 这个是一个工厂方法,每次调用都返回一个新的枚举类。// 参数对象表示类的每个实例的名字和值// 不能使用这个返回的枚举类创建新的实例。// 枚举值继承自返回的这个枚举类function enumeration (namesToValues) {var enumeration = function () {throw "...转载 2018-10-25 10:47:56 · 275 阅读 · 0 评论 -
WebSocket在服务端和客户端通信demo,支持心跳检测+断线重连
一、为什么需要 WebSocket?初次接触 WebSocket 的人,都会问同样的问题:我们已经有了 HTTP 协议,为什么还需要另一个协议?它能带来什么好处?答案很简单,因为 HTTP 协议有一个缺陷:通信只能由客户端发起。举例来说,我们想了解今天的天气,只能是客户端向服务器发出请求,服务器返回查询结果。HTTP 协议做不到服务器主动向客户端推送信息。这种单向请求的特点,注定了如果服务器有连续...原创 2018-06-10 23:52:52 · 23389 阅读 · 2 评论 -
解决js加减乘除运算小数丢失精度的问题
// 解决浮动运算问题,避免小数点后产生多位数和计算精度损失。class Precision { // 乘法 times (num1, num2, ...others) { if (others.length > 0) { return this.times(this.times(num1, num2), ...others) } const ...原创 2018-05-25 16:39:39 · 1905 阅读 · 0 评论 -
剖析Vue原理&实现双向绑定MVVM
转载: https://segmentfault.com/a/1190000006599500几种实现双向绑定的做法目前几种主流的mvc(vm)框架都实现了单向数据绑定,而我所理解的双向数据绑定无非就是在单向绑定的基础上给可输入元素(input、textare等)添加了change(input)事件,来动态修改model和 view,并没有多高深。所以无需太过介怀是实现的单向或双向绑定。实现...转载 2018-05-18 18:06:27 · 269 阅读 · 0 评论 -
promise顺序动态加载JavaScript
<script> // Promise IE不兼容,需要找shim一下 let loadScript = function () { return function _loadScript(url, callBack) { return new Promise(function (resolve) { let script = documen...原创 2018-04-27 15:36:19 · 1355 阅读 · 0 评论 -
css元素居中的多个方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title></head><style> html, body { /*body原创 2018-05-11 20:33:07 · 217 阅读 · 0 评论 -
es6的shim标准地址
https://github.com/paulmillr/es6-shim/原创 2018-04-02 20:27:58 · 855 阅读 · 0 评论
分享