js
关注
分享
扫一扫
文章平均质量分 51
不写博客的前端不是好前端
这个作者很懒，什么都没留下…
展开
-
TinyCE结合插件MathType(wiris)
TinyCE结合插件MathType(wiris)转载 2021-06-04 16:07:47 · 534 阅读 · 0 评论 -
梁宵《TypeScript开发实战》（基础篇）
梁宵《TypeScript开发实战》（基础篇）重塑“类型思维”类型基础强类型动态类型与静态类型重塑“类型思维”尽管es标准在几年内发展迅速，但是在类型检查方面依然是无所建树，这就会导致我们在定义函数的时候难以对函数的参数类型进行界定。众所周知js是一门动态弱类型语言，对变量的类型非常宽容，但是对于开发者而言，如果长期在没有约束的情况下开发，就会造成类型思维的缺失养成不良的编程习惯。ts就是致力于为js提供静态类型检查，现今angular和vue团队开始全面使用ts重构代码，在es标准推出静态类型检查之原创 2021-04-27 17:34:02 · 1039 阅读 · 2 评论 -
侯策《前端开发核心知识进阶》读书笔记——异步
setTimeoutJavaScript 中所有任务分为同步任务和异步任务。同步任务是指：当前主线程将要消化执行的任务，这些任务一起形成执行栈（execution context stack）异步任务是指：不进入主线程，而是进入任务队列（task queue），即不会马上进行的任务。当同步任务全都被消化，主线程空闲时，即上面提到的执行栈 execution context stack 为空时，将会执行任务队列中的任务，即异步任务。这样的机制保证了：虽然 JavaScript 是单线程的，但是对于一原创 2021-04-13 16:18:10 · 354 阅读 · 0 评论 -
[].slice.call(arguments)的理解
[].slice.call(arguments)的理解转载 2021-04-12 19:22:52 · 154 阅读 · 0 评论 -
使用sort(function(a,b){return a-b})对数组进行排序的原理
使用sort(function(a,b){return a-b})对数组进行排序的原理转载 2021-04-08 21:21:31 · 656 阅读 · 0 评论 -
Vue开发问题汇总
v-loading首先明确，在vue的众多指令中，现在v-cloack使用得很少，因为在简单项目中，使用 v-cloak 指令是解决屏幕闪动的好方法。但在大型、工程化的项目中（webpack、vue-router）只有一个空的 div 元素，元素中的内容是通过路由挂载来实现的，这时v-cloak 在单文件页面中是不起作用的。此时为了解决加载延时的问题，我们更多的会使用v-loading,v-loading不是vue的指令，而是element-ui提供的指令：官方文档mixinmixin提供了一种非常灵原创 2021-03-31 18:15:35 · 928 阅读 · 0 评论 -
JS二维数组赋值问题
背景定义二维数组并赋值 let list = new Array(5).fill(new Array(3).fill(0))此时在给二维数组赋值时使用如下代码：list[2][1] = 2看下赋值结束后的打印结果：未达到预期。ES6解析我们看下阮一峰在es6中对fill的定义：理解这样就不难理解，当我们在fill时，虽然进行了new Array，但填充的是数组的地址，因此在进行赋值的时候，会改变所有指向该数组的值。...原创 2021-03-21 12:50:36 · 4054 阅读 · 3 评论 -
解决TextEncoder 和 TextDecoder在IE下不兼容的问题
解决TextEncoder 和 TextDecoder在IE下不兼容的问题转载 2021-01-19 20:07:39 · 800 阅读 · 0 评论 -
动手搭建一个组件系统
组件化组件的基本概念和基本组成部分为组件添加JSX语法组件的基本概念和基本组成部分组件区别于模块，区别于对象，组件是和ui强相关的东西，它既是对象又是模块，它可以以树形结构来进行组合，并且有一定的模板化的配置的能力。看一下组件和对象的区别：对象的三要素是属性、方法和继承关系。组件在此基础上又多了一些别的概念，其中最重要的是children，没有children就没办法形成树形结构，没有树形结构描述界面的能力就差了很多。组件在对象的基础上加了这么多语义相关的概念，使得组件变成一种非常适合描述ui的原创 2021-01-17 19:03:14 · 479 阅读 · 2 评论 -
唐金州的Vue开发实战学习笔记（生态篇）
Vue开发实战学习笔记VuexWhy VuexHow VuexVuex的核心概念和底层原理Vuex的最佳实践Vue RouterWhy Vue Router路由类型及底层原理NuxtNuxt解决的问题Nuxt的核心原理UI组件库对比常用开发工具单元测试VuexWhy Vuexprovide和inject虽然能够实现层层传递的数据管理，但对于一个大的管理系统而言会显得有些繁琐，我们需要一个大型的状态管理系统。How Vuex一个简单的计数器的例子，在main.js中引入Vueximport Vu原创 2020-12-18 21:13:26 · 2038 阅读 · 0 评论 -
唐金州的Vue开发实战学习笔记（基础篇）
Vue开发实战学习笔记简易的Vue程序组件事件插槽单文件组件双向绑定虚拟DOM与key属性组件更新状态data与属性propsvue的响应式更新计算属性和侦听器计算属性 computed侦听器watchcomputed vs watch生命周期的应用场景和函数式组件生命周期函数式组件指令provide/inject跨层级组件实例简易的Vue程序在vscode中新建一个html文件，输入html5快捷生成代码：<!DOCTYPE html><html lang="en">&l原创 2020-12-17 21:51:12 · 1856 阅读 · 1 评论 -
js 双线性插值 双三次插值法 实现
js 双线性插值 双三次插值法 实现转载 2020-12-10 17:42:24 · 530 阅读 · 0 评论 -
Echarts热力图自定义底图
需求看下本次的需求：希望实现如下图的热力图的展示：原创 2020-12-08 17:31:15 · 3107 阅读 · 0 评论 -
echarts实现GIS可视化——热力图
看一下热力图实现的案例：效果图：示例代码&注释：$.get(ROOT_PATH + '/data/asset/data/hangzhou-tracks.json', function (data) { var points = [].concat.apply([], data.map(function (track) { return track.map(function (seg) { return seg.coord.concat([1])原创 2020-11-27 16:32:04 · 7501 阅读 · 1 评论 -
javascript实现UTF-8编码
编码原理：https://www.cnblogs.com/doublenet/p/5616451.html实现代码：const UTF8_Encoding = (string) => { let utf8_arr = []; for (let objIndex in string) { let code = string.charCodeAt(objIndex) if (code >= 0 && code < 127) {原创 2020-11-13 19:54:39 · 1905 阅读 · 0 评论 -
React案例分析
React案例分析内容介绍React 生命周期高阶组件与函数作为子组件CONTEXT API内容介绍本文是通过对geek-time提供的react课程的案例进行分析，着重强化react知识，附上案例github地址：https://github.com/supnate/react-geek-timeReact 生命周期Render阶段纯净且没有副作用，这个阶段可能会被react暂停，中止或者重新启动Pre-commit 阶段更新dom节点之前，可以读取dom节点内容commit 阶段原创 2020-10-29 20:15:49 · 321 阅读 · 0 评论 -
字符串算法
字符串算法字符串分析算法字典树字符串分析算法字典树——大量搞重复字符串的存储与分析KMP——在长字符串里找模式Wildcard——带通配符的字符串模式正则——字符串通用模式匹配状态机——通用的字符串分析LL LR——字符串多层级结构分析字典树看一下基础的字典树生成方法：<script> let $ = Symbol("$") class Trie { constructor(){ // 用Object.create的原创 2020-10-30 21:58:43 · 137 阅读 · 0 评论 -
JS实现AST抽象语法树问题
前端中的AST抽象语法树问题四则运算正则表达式词法分析语法分析完整代码github地址:https://github.com/feddiyao/Frontend-05-Template/tree/master/Week%2003四则运算首先明确，此次的代码都是基于LL的语法分析来实现的，实现的是四则混合运算的功能，先看下定义：TokenNumber：· 1 2 3 4 5 6 7 8 9 0 的组合Operator:+ - * / 之一WhiteSpace:<SP>L原创 2020-10-21 16:48:48 · 1128 阅读 · 0 评论 -
寻路问题
寻路问题地图编辑器地图编辑器首先实现一个地图编辑器，随着鼠标在页面上的点击滑动可以进行地图的绘画，并给出了一个save按钮来进行编辑后的地图内容的保存<style> .cell { display: inline-block; line-height: 7px; width: 6px; height: 6px; background-color: gray; border-bottom:原创 2020-10-16 17:01:34 · 372 阅读 · 0 评论 -
自己动手搭建一个React框架——toyReact
toyReact框架搭建环境配置JSX 原理和关键实现我们之前在博客上有提到 react的教程中tic-tac-toe游戏的案例，那么在篇博客中，我们主要要实现的是搭建自己的toyReact框架，将tic-tac-toe在toyReact框架中跑起来。环境配置包安装：npm install --save-dev webpack webpack-clinpm install --save-dev babel-loader @babel/core @babel/preset-envnpm insta原创 2020-09-05 21:59:48 · 1022 阅读 · 0 评论 -
JavaScript中的 NaN 与 isNaN
NaNNaN 即 Not a Number ，不是一个数字。 在 JavaScript 中，整数和浮点数都统称为 Number 类型 。除此之外，Number 类型还有一个很特殊的值，即 NaN 。它是 Number 对象上的一个静态属性，可以通过 Number.NaN 来访问 。console.log(Number.NaN); // NaNconsole.log(NaN); // NaNNAN的产生表达式计算一个表达式中如果有减号 (-)、乘号 (*) 或 除号 (/) 等运算符时，JS 引原创 2020-09-03 10:35:22 · 159 阅读 · 0 评论 -
JS手写API实现
API实现jQuery offset 实现递归实现通过 getBoundingClientRect API 实现数组 reduce 方法的相关实现概念reduce的用法简单用法：计算数组中每个元素出现的次数：数组去重：将二维数组转化为一维：将多维数组转化为一维：reduce 实现 runPromiseInSequencereduce 实现 pipe实现一个reducecompose 实现的几种方案compose 概念面向过程的实现方式reduce的实现方式Promise的实现方式jQuery offset原创 2020-09-03 10:00:49 · 586 阅读 · 0 评论 -
JS中的异步与案例分析
异步setTimeout最小延迟宏任务（macrotask）与微任务（microtask）案例实现功能回调方案导致的回调地狱Promise 方案generator 方案async/await 方案setTimeoutJavaScript 中所有任务分为同步任务和异步任务。同步任务是指：当前主线程将要消化执行的任务，这些任务一起形成执行栈（execution context stack）异步任务是指：不进入主线程，而是进入任务队列（task queue），即不会马上进行的任务。当同步任务全都被消化，原创 2020-09-02 17:30:16 · 262 阅读 · 0 评论 -
由源码看object.assign的拷贝方式
object.assign的拷贝方式基本用法源码基本用法Object.assign(目标,数据1,数据2…);网上有很多的Object.assign拷贝过程测试，这里放一个例子，就不多说了：//示例1 一层深拷贝let obj = {a:1}let newObj = Object.assign({},obj);console.log(newObj); //{a: 1}newObj.a=2;console.log(obj); //{a:1}console.log(newObj); //{原创 2020-09-02 11:18:09 · 256 阅读 · 0 评论 -
react官方文档棋盘案例分析
棋盘案例功能介绍井字棋初始状态代码通过 Props 传递数据给组件添加交互功能状态提升函数组件轮流落子判断出胜者时间旅行保存历史记录再次提升状态展示历史步骤记录选择一个 key实现时间旅行最终代码实现功能介绍井字棋tic-tac-toe(三连棋)游戏的所有功能能够判定玩家何时获胜能够记录游戏进程允许玩家查看游戏的历史记录，也可以查看任意一个历史版本的游戏棋盘状态初始状态代码class Square extends React.Component { render() { retu原创 2020-08-31 19:47:13 · 250 阅读 · 0 评论 -
《你不知道的javascript》读书笔记——作用域和闭包（未完）
作用域和闭包程序处理的工具编译的三个步骤程序处理工具工作过程LHS查询和RHS查询词法作用域作用域查找程序处理的工具• 引擎从头到尾负责整个 JavaScript 程序的编译及执行过程。• 编译器引擎的好朋友之一，负责语法分析及代码生成等脏活累活。• 作用域引擎的另一位好朋友，负责收集并维护由所有声明的标识符(变量)组成的一系列查 询，并实施一套非常严格的规则，确定当前执行的代码对这些标识符的访问权限。编译的三个步骤1、分词/词法分析(Tokenizing/Lexing)这个过程会将由字原创 2020-08-30 14:04:10 · 145 阅读 · 0 评论 -
JS面向对象和原型
面向对象和原型new关键字做了什么newFunc的模拟训练对newFunc的实现：如何优雅地实现继承JS原型链prototype`__proto__`prototype与`__proto__`原型链JS原型继承构造函数的继承构造函数绑定prototype模式、直接继承prototype利用空对象作为中介拷贝继承非构造函数的继承object()方法浅拷贝深拷贝JS创建对象的几种方式工厂模式构造函数模式原型模式组合使用构造函数模式和原型模式动态原型模式寄生构造函数模式稳妥构造函数模式总结Babel 编译结果研究原创 2020-08-28 17:30:22 · 225 阅读 · 0 评论 -
JS基础
JS基础JavaScript 类型及其判断typeofinstanceofObject.prototype.toStringconstructorJavaScript 类型及其转换JS中Number()、parseInt()和parseFloat()Number()parseInt()parseFloat( )JS中的NANNAN概念NAN的产生isNaNJavaScript 函数参数传递cannot read property of undefined 问题解决方案JavaScript 类型及其判断J原创 2020-08-27 19:07:14 · 315 阅读 · 0 评论 -
Javascript中的this
Javascript中的thisthis 到底指向谁全局环境下的this上下文对象调用中的 thisbind/call/apply 改变 this 指向构造函数和 this箭头函数中的 this 指向this 优先级相关实现一个 bind 函数this 到底指向谁谁调用它，this 就指向谁。更确切的说法：this 的指向，是在调用函数时根据执行上下文所动态确定的。在函数体中，简单调用该函数时（非显式/隐式绑定下），严格模式下 this 绑定到 undefined，否则绑定到全局对象windo原创 2020-08-27 18:49:33 · 159 阅读 · 0 评论 -
react组件间通信
react组件通信父子组件通信父子组件通信原创 2020-08-27 16:56:12 · 180 阅读 · 0 评论 -
微信小程序setData中键名key中使用变量
https://blog.youkuaiyun.com/tianxintiandisheng/article/details/82229685转载 2020-08-26 15:03:10 · 713 阅读 · 0 评论