06.ElementUI 2.X 源码学习:源码剖析之工程化(一)06.ElementUI 2.X 源码学习:源码剖析之工程化(一)
0x.00 前言
在用了5章篇幅 ElementUI源码学习:从零开始搭建Vue组件库汇总 讲解了如何编写一个组件、发布npm以及生成展示文档之后。接下来将分析Element项目的代码结构，学习其工程化思想。
前端开发早已从瘦客户端（thin client）架构/中心服务器（server-ce...[2021/6/7]
实践指南-网页生成PDF
一、背景
开发工作中，需要实现网页生成 PDF 的功能，生成的 PDF 需上传至服务端，将 PDF 地址作为参数请求外部接口，这个转换过程及转换后的 PDF 不需要在前端展示给用户。
二、技术选型
该功能不需要在前端展示给用户，为节省客户端资源，选择在服务端实现网页生成 PDF 的功能。
1....[2021/6/7]
在微信框架模块中，基于Vue&Element前端的微信公众号和企业微信的用户绑定
在一个和微信相关的业务管理系统，我们有时候需要和用户的微信账号信息进行绑定，如对公众号、企业微信等账号绑定特定的系统用户，可以进行扫码登录、微信信息发送等操作，用户的绑定主要就是记录公众号用户的openid或者企业微信的userid，那样可以通过微信API接口，发送系统消息或业务消息。
1、系统...[2021/6/7]
react中context的优化
很多时候，为了减少render的次数，我们不得不使用shouldUpdate或memo等方法，但是当组件使用了context上下文之后，无论你的反回值是true或false,只要context里的值发生了改变，都无法阻止组件的render，这也是因为组件需要监听context值的变化，但有时，我...[2021/6/7]
JS之-BOM模型-DOM模型 - 小杨-先生
目录一、BOM浏览器对象模型window对象window的子对象弹出框计时相关*二、DOM文档对象模型选择器节点操作文本操作属性操作值操作cla 的操作c 操作事件
一、BOM浏览器对象模型
览器对象模型（BOM） Broswer object model（整合js和浏览器）
window对...[2021/6/7]
javascript 09 web API DOM
API应用程序编程接口，是一些预先定义的函数，或方法。
任何开发语言都有自己的API
API的特征是输入和输出（I/O ）
Web API 是浏览器提供的一套操作浏览器功能和页面元素的API（BOM和DOM）
DOM经常进行的操作：
获取元素
对元素进行操作（设置属性...[2021/6/7]
JavaScript 10 DOMJavaScript 10 DOM
获取标签属性和内容
DOM对象将标签的属性和内容封装成了对象的属性
<div id = "div">我是一个div
<span>我是span< pan>
</div> <script>
var box = document.g...[2021/6/7]
浅析mvvm模式和mvc模式的区别和联系
三层架构与MVC模式
三层架构
三层架构是一种以实现“高内聚，底耦合”为目标，的代码架构方法，它将整个业务分为，表示层，业务层，数据访问层（Dao层）。
MVC模式
MVC模式是一种软件设计的典范，一种组织代码的方法。
M 是 model 模型
V 是 view 视图
C 是 contr...[2021/6/7]
Handlebars.js 模板引擎Handlebars.js 模板引擎
介绍
Handlebars 是 JavaScript 一个语义模板库，通过对view和data的分离来快速构建Web模板。它采用"Logic-le template"（无逻辑模版）的思路，在加载时被预编译，而不是到了客户端执行到代码时再去编译， 这样可以保证模板加载和运行的速度。Ha...[2021/6/7]
JavaScript 11 节点
节点的层次结构
nodeType节点的类型
1 元素节点 nodeType=1
2 属性节点
3 文本节点 nodeType=3
4 注释节点 nodeType=8
nodeName 节点的名称（标签名称）
nodeValue 节点值
元素节点的nodeValue...[2021/6/7]
数组的reduce方法详细解
前言
很多前端开发中都知道数组的reduce方法可以用来给数组求和，但是你问到里面的具体参数代表的时候什么，很多人却不知道。所以在工作中也是很少人会用到这个方法。现在我就通过这篇文章给大家详细讲解一下，并通过几个案例给大家展开
reduce方法
下面是api的使用和每个参数代表的含义：
a...[2021/6/7]
小程序从零开始 新手必看(2)
大家可以搜索 菜鸟百宝箱 小程序查看我的小程序会持续更新 每次审核需要大约一天时间
今天来讲如何对接接口
一.准备
一个接口网站 可以自己提供 也可以用网上的接口网站 我用的万维易源
然后就是上一章的代码
二.开始
首先我们在微信公众平台上吧我们的接口地址配置...[2021/5/31]
ES6学习-5 解构赋值（2）对象的解构赋值
啥也不说，先举个栗子:
1 let { myname, myage } = { myage: 18, myname: "郭郭" };
2 console.log(myname) 郭郭
3 console.log(myage) 18
很简单的例子，主要是为了说明对象解构赋值与数组解构赋...[2021/5/31]
前端js的命名规范与let，var和const的区别
命名规范
命名规范
1 硬性要求
1）不能以数字开头
&nbs...[2021/5/31]
ES6学习-6 解构赋值（3）解构赋值的应用ES6学习-6 解构赋值（3）解构赋值的应用
已学习了数组解构赋值和对象解构赋值，下面我们来看一下解构赋值都可以应用在哪些地方。
函数参数的解构 - 数组参数 ，栗子：
function add([a, b]){
return a + b;
}
console.log(add([1, 2])); 控制台输出3
...[2021/5/31]
前端js的数组的循环遍历 for / for of / for in / arr.forEach()
数组的作用是使用单独的变量名来存储一系列的值。数组的功能强大很 ，其方法也很多...
数组的循环遍历 for / for of / for in / arr.forEach()
for 循环
最简单的一种，也是最灵活的
let arr=[1,2,3];
for(let y=0;y&l...[2021/5/31]
JavaScript 05 对象 ，this，工厂方法，自定义构造函数，new的执行过程，遍历对象的属性JavaScript 05 对象 ，this，工厂方法，自定义构造函数，new的执行过程，遍历对象的属性
一个月没有更新了，一直在弄毕业论文和毕设，刚刚告一段落……
对象：对象是一个具体的事物，不是一类。不同属性中间用 逗号 隔开
对象是无序属性的集合，属性的值可以是基本值，对象和函数。
对象由特征（描述对象的，属性，名词）和行为（动词）组成
var student = {
...[2021/5/31]
GLSL着色器，来玩
对实现动画的前端同学们来说，canvas可以说是最自由，最能全面控制的一个动画实现载体。不但能通过javascript控制点、线、面的绘制，使用图片资源填充；还能改变输入参数作出交互动画，完全控制动画过程中的动作轨迹、速度、弹性等要素。
但使用canvas开发过较复杂一点的动画的同学，可能会发...[2021/5/31]
算法学习：滑动谜题
今天在力扣看到一道题，顺手写了下，这里记录一下思路。
题目名称：滑动谜题
在一个 2 x 3 的板上（board）有 5 块砖瓦，用数字 1~5 来表示, 以及一块空缺用 0 来表示.
一次移动定义为选择 0 与一个相邻的数字（上下左右）进行交换.
最终当板...[2021/5/31]
JavaScript 06 内置对象Math，Date，Array
JavaScript组成ECMAScript+BOM+DOM
目前所学的都是ECMAScript，BOM和DOM还没有学
已学的ECMAScript：变量，注释，数据类型，操作符，流程控制语句(判断和循环)，数组，对象，构造函数，内置对象
JavaScript中所包含的对象：自定义对象(之...[2021/5/31]
React三大属性
最近学习了一波react，暂时感觉用起来很舒服，和vue相比，react最大的特点就是需要有点js的基础，不然有点难搞！
react既然用起来这么舒服，这次就说说react不得不聊的三大属性吧！当然在说三大属性之前，我们可以必须要聊点其他方面的废话
1.模块化和组件化
1.1 ...[2021/5/31]
JavaScript-百度换肤效果
前端JavaScript小案例——百度换肤效果
话不多说直接给大家上代码：
HTML结构部分：
<body>
<ul cla ="baidu">
<li><img src="image 1.jpg" alt="...[2021/5/31]
通俗易懂的JS之Proxy
与掘金文章同步：https: juejin.cn/post/6964398933229436935
什么是代理模式
引入一个现实生活中的案例
我们作为用户需要去如何评估一个房子的好坏、如何办理住房手续等一些列繁琐的事物吗？显然，用户肯定不愿意这样做。用户最关心的是结果，用户对房子提出需求以及...[2021/5/24]
ES6解构赋值
与掘金文章同步：https: juejin.cn/post/6964749085794369566
数组的解构赋值
ES6允许按照一定模式从数组或对象中提取值，然后对变量进行赋值，称为解构。只要等号两边的模式相同，左边的变量就会被赋予对应的值，这种写法属于“模式匹配”。统称起来就叫做“解构赋值...[2021/5/24]
面试遇到的坑JS深拷贝和浅拷贝
首先要搞明白深拷贝和钱拷贝的区别要先搞明白 栈和堆的区别
一、栈
栈存储基础数据类型，如： String、Number、Boolean、Null、Underined，这些简单的基础数据类型能够直接存储在栈中。栈如果没有被使用就会被回收
二、堆
堆存储引用数据类型的是 Functi...[2021/5/24]
使用NodeJs作为微信公众号后台服务器 使用node回复公众号消息 node验证公众号tonken node微信公众号开发 - Y-X南川
使用NodeJs作为微信公众号后台服务器
下面演示代码的源码地址 https: gitee.com zxio/weChatServer
申请测试公众号
首先登录微信公众平台，选择自己的公众号登录。登录成功后点击开发者工具，选择公众平台测试账号
点击进去后我们可以申请一个测试用的公众号，可...[2021/5/24]
机器学习初探-线性回归
题外话
我很早就对人工智能是非常感兴趣的。记得我大学的毕业论文，就是使用遗传算法解决了一个经典的寻路问题。
我一直对人类经典的思想是非常敬畏和崇拜的，比如传统的计算机数据结构算法问题，例如经典的排序算法或者动态规划思想，把一些看似
复杂的问题竟然用短短十几行甚至一个 for 循环就能解决，这...[2021/5/24]
通俗易懂的JS之Proxy
与掘金文章同步：https: juejin.cn/post/6964398933229436935
什么是代理模式
引入一个现实生活中的案例
我们作为用户需要去如何评估一个房子的好坏、如何办理住房手续等一些列繁琐的事物吗？显然，用户肯定不愿意这样做。用户最关心的是结果，用户对房子提出需求以及...[2021/5/24]
小程序从零开始 新手必看(1)
大家可以搜索 菜鸟百宝箱 小程序查看我的小程序会持续更新 每次审核需要大约一天时间
准备工作
1.微信小程序开发工具
2.一个接口网站(我用的https: www.showapi.com/api/apiList?sortType=userCnt&sortValue=-...[2021/5/24]
ES6解构赋值
与掘金文章同步：https: juejin.cn/post/6964749085794369566
数组的解构赋值
ES6允许按照一定模式从数组或对象中提取值，然后对变量进行赋值，称为解构。只要等号两边的模式相同，左边的变量就会被赋予对应的值，这种写法属于“模式匹配”。统称起来就叫做“解构赋值...[2021/5/24]
在微信框架模块中，基于Vue&Element前端的后台管理功能介绍
微信开发包括公众号、企业微信、微信小程序等方面的开发内容，需要对腾信的微信API接口进行封装：包括事件、菜单、订阅用户、多媒体文件、图文消息、消息群发、微信支付和企业红包、摇一摇设备、语义理解、微信小店、微信卡劵等相关接口处理，另外还包括扫一扫、图库和照片管理、地理位置、H5页面开发等内容，以及...[2021/5/24]
React 笔记
基础
<div id="app"></div>
<!-- React核心库 -->
<script cro origin src="https: unpkg.com/react@16/umd/re...[2021/5/24]
javaScript(叁)
javascript(叁)
1. 节点*
HTML 文档中的所有内容都是节点：
整个文档是一个文档节点 document
每个 HTML 元素是元素节点
HTML 元素内的文本是文本节点
每个 HTML 属性是属性节点
注释是注释节点
节点类型
document的节点类型 9、标签的...[2021/5/24]
Vue源码-手写mustache源码
引言
在Vue中使用模板语法能够非常方便的将数据绑定到视图中，使得在开发中可以更好的聚焦到业务逻辑的开发。
mustache是一个很经典且优秀的模板引擎，vue中的模板引擎也对其有参考借鉴，了解它能更好的知道vue的模板引擎实现的原理。
数据转换为视图的方案
Vue的核心之一就是数据驱动，而...[2021/5/24]
在微信框架模块中，基于Vue&Element前端的事件和内容的管理在微信框架模块中，基于Vue&Element前端的事件和内容的管理
在微信后台管理中，我们需要定义好菜单对应的事件管理，因为微信通过菜单触发相关的事件，因此菜单事件的响应关系，我们如果处理好，就能构建出我们的微信应用入口了。通过入口，我们可以响应用户菜单的事件，如响应文本内容，图片内容，以及扫码处理，或者定位到自己的页面中去进行业务数据的录入和展示等等。
1、微...[2021/5/24]
每个前端开发都应该知道的10个JavaScript技巧
在过去的5-10年中，JavaScript的市场份额已上升到新的水平，尤其是自2015年6月ES6推出以来，它成为Web开发中最受欢迎的编程语言，从而使开发人员可以创建前端UI和后端-逻辑。
由于近年来启动了许多JavaScript框架，因此在开发Web应用程序时，它已成为显而易见的选择。...[2021/5/24]
js给图片打马赛克的方法示例js给图片打马赛克的方法示例
本文主要主要介绍了js给图片打马赛克的方法示例，分享给大家，具体如下：
效果演示
Canvas简介
这个 HTML 元素是为了客户端矢量图形而设计的。它自己没有行为，但却把一个绘图 API 展现给客户端 JavaScript 以使脚本能够把想绘制的东西都绘制到一块画布上。
...[2021/5/17]
微信小程序支付实现流程
基本流程
用户操作流程
小程序流程
整体支付流程
代码实现
创建订单
创建订单，主要是前端将订单的信息提交到后端。但是在创建订单之前还有一些准备工作要做：
获取用户数据GetUserInfo
获取用户授权，获得token
创建订单
使用button的getUserInfo 获得...[2021/5/17]
如何用JS追踪用户
一、同步 AJAX
数据发回服务器的常见做法是，将收集好的用户数据，放在unload事件里面，用 AJAX 请求发回服务器。
但是，异步 AJAX 在unload事件里面不一定能成功，因为网页已经处于卸载中，浏览器可能发送，也可能不发送。所以，要改成同步 AJAX 请求。
win...[2021/5/17]
JS如何使用剪贴板操作Clipboard API
一、Document.execCommand() 方法
Document.execCommand()是操作剪贴板的传统方法，各种浏览器都支持。
它支持复制、剪切和粘贴这三个操作。
document.execCommand(''copy'')（复制）
document....[2021/5/17]
闭包
闭包
简单讲：就是能够读取其他函数内部变量的函数。例如在 JavaScript 中，只有函数内部的子函数才能读取局部变量，所以闭包可以理解成 “定义在一个函数内部的函数” 。在本质上，闭包是将函数内部和函数外部连接起来的桥梁。
下面本人通过几个案例与各位读者分享有关闭包的知识点：
例1：
...[2021/5/17]
js正则匹配以{开头,以}结尾的表达式怎么写？-附源码
基本知识
1、正则表达式组成
正则表达式是由普通字符（例如字符 a 到 z）以及特殊字符（称为元字符）组成的文字模式。正则表达式作为一个模板，将某个字符模式与所搜索的字符串进行匹配。
正则表达式 = 普通字符+特殊字符（元字符）
2、匹配符
字符匹配符用于匹配某个或某些字符
名词解析...[2021/5/17]
在微信框架模块中，基于Vue&Element前端，通过动态构建投票选项，实现单选、复选的投票操作
最近把微信框架的前端改造一下，在原来基于Bootstrap框架基础上的微信后台管理，增加一套Vue&Element的前端，毕竟Vue的双向绑定开发起来也还是很方便的，而且Element本身也提供了很强大的界面组件。因此在原来数据库的基础上，增加Web API+Vue&Elemen...[2021/5/17]
JavaScript常用数组方法汇总JavaScript常用数组方法汇总
添加/删除元素
push()
数组末端添加元素
let arr = [''javascript'', ''c ''];
alert( arr.push(''html'') ); 3
alert( arr ); javascript, c , html
pop()
移除...[2021/5/17]
基于Typescript的Vue项目配置国际化
基于Typescript的Vue项目配置国际化
简介
使用vue-i18n插件对基于Typescript的vue项目配置国际化，切换多种语言, 配合element-ui或者其他UI库
本文以配置中英文两种语言为例
安装
安装国际化插件vue-i18n
npm i vue-i18n --sa...[2021/5/17]
一文搞懂Ajax，附Ajax面试题
目录前言正文Ajax是什么东西？实现核心/工作原理：XMLHttpRequest对象XMLHttpRequest大致用法创建XMLHttpRequest对象发送请求服务器响应1. responseText属性2. responseXML属性数据处理1. readyState 属性2. onrea...[2021/5/17]
vue单页面，多路由，前进刷新，后退不刷新
最近终于忙里抽空，总结项目经验了
index页面包含三个链接导航。page1-->page2-->page3.依次前进，每次前进到一个新页面都需要获取数据，而按下后退键后，从page3返回到page2，page2不再获取新数据，而是使用之前缓存的数据。从page2返回到page1时...[2021/5/17]
vue-cli3.0 日常优化
1.项目第三方库 cdn引入
使用cdn资源主要是为了减小打包文件体积
vue.config.js 中
是否为生产环境
const isProduction = proce .env.NODE_ENV !== ''development''
本地环境是否需要使用cdn
const d...[2021/5/17]
快速排序（JS实现）
思想
快速排序的基本思想是选择数组中的一个元素作为关键字，通过一趟排序，把待排序的数组分成两个部分，其中左边的部分比所有关键字小，右边的部分比所有关键字大。然后再分别对左右两边的数据作此重复操作，直到所有元素都有序，就得到了一个完全有序的数组。
来看一个例子，以数组[4, 5, 2, 7, 3...[2021/5/17]
JS中的正则表达式
JS中的正则表达式
1.RegExp类型
ECMAScript通过RegExp类型支持正则表达式。
let expre ion = /pattern/flags;
pattern（模式）是任何正则表达式，正则表达式可以带零个或多个flags。
常见 修饰符（标记）
修饰符
描述
...[2021/5/17]
经验首页