前端开发
文章平均质量分 50
一杯码农
这个作者很懒,什么都没留下…
展开
-
https流程详解(含ca证书校验)
首先来说 一下,为什么需要https 加密由于http 传输是明文传输,信息在传输的过程中容易被篡改,不安全所以 就有了 加密传输对称加密 (aes等)对称加密很容易理解,就是 只有一个秘钥, 可以使用这个秘钥加密和解密,但是这样只要被别人截取到秘钥,信息传输就不安全了,相当于明文传输了。特点:1. 只有一个秘钥, 客户端和服务器传输秘钥过程中被截取就能被破解2. 加解密速度极快非对称加密(RSA等)特点:1. 有 公钥 和 私钥,公钥加密,就只能用 私钥 来..原创 2021-07-22 23:09:22 · 1845 阅读 · 1 评论 -
实现迷你版vue2的响应式核心原理代码
vue2 的响应式核心原理代码 其实就只有几个模块1. 代理Object.defineProperty2.依赖收集dep,收集所有监听页面数据的watcher实例3. 监听页面数据实例watcher4.观察者 Observer ,实现数据劫持5.编译模块 Compiler下面来简单实现一下各个模块代码,新建index.js文件1.首先简单实现Vue类,和基本代理功能export class Vue{ constructor(options = {}){ ...原创 2021-06-22 15:15:01 · 299 阅读 · 1 评论 -
手写mini版vuex响应式数据仓库
前言~~不喜欢手写原理的程序员不是好的程序员根据vuex官网的使用,下面来实现以下基础的vuex中心化数据响应式原理1.首先来看一下 store注册store注册使用了vue的插件机制,use方法会调用插件的install方法用过store的我们可以得知,在vue中每个实例的每个方法都可以通过this.$store 调用数据仓库,这样我们就可以得出,我们的vuex插件是有install方法,主要实现了store的全局混入,我们这里利用一些vue的mixin全局混入,beforeC原创 2021-06-17 14:47:41 · 247 阅读 · 1 评论 -
简单实现koa的洋葱模型
class myKoa{ middleware = [] ctx = {a:1} constructor(){ } use(fn){ this.middleware.push(fn) } listenCallback(){ let fn = this.compose(this.middleware) return fn(this.ctx).then(this.respond) } r.原创 2021-06-10 16:01:16 · 173 阅读 · 0 评论 -
js实现flat函数
function myFlat(arr,count){ if(count == 0){ return arr } return arr.reduce((res,value)=>{ if(Array.isArray(value)){ res = res.concat(myFlat(value,count-1)) }else{ res = res.concat(value) .原创 2021-06-07 22:42:36 · 1032 阅读 · 0 评论 -
聊一聊js的各种继承方式
1.原型链继承我们知道js对象的属性查找流程,是先查找本对象的属性,查找不到就会从 原型对象 上查找(每个实例对象都有会__proto__属性指向 原型对象 ),还是找不到那就__proto__.__proto__ ,原型对象上的原型对象,这样一路往上找,找到为止或者__proto__值为null。我们可以使用这种查找原理来实现js对象继承function Parent(){ this.name = 'my name is Parent' this.actions = ['si原创 2021-06-06 13:37:30 · 112 阅读 · 0 评论 -
手写 nodejs 打包工具,转译 CommonJs 规范的代码
使用过nodejs的小伙伴应该都知道, commonjs规范其实就是用在nodejs服务器端的commonjs 其实是同步加载机制我们先来看一下这段代码,这个其实就是webpack 将 commonjs 规范的模块代码 打包编译之后的代码const cache = {};(function(modules){ const require = (path)=>{ if(cache[path]) return cache[path] let...原创 2021-05-31 15:57:29 · 300 阅读 · 1 评论 -
手写CMD规范的异步加载机制(seaJs)
实现完上文的AMC规范 异步加载机制后,https://blog.csdn.net/weixin_38407447/article/details/117407660这里实现一下CMD 规范的 异步加载机制同样 需要 用到 这篇文章实现 的 模块加载器 __loadhttps://blog.csdn.net/weixin_38407447/article/details/117402939?spm=1001.2014.3001.5501新建cmd.jsgb.sj = {}.原创 2021-05-31 13:28:01 · 259 阅读 · 0 评论 -
手写AMD规范的异步加载机制(requireJs)
AMD异步加载机制,特点是:依赖前置, 先把模块需要用到的依赖全部加载本质是利用promise实现异步加载需要 用到 这篇文章实现 的 模块加载器 __loadhttps://blog.csdn.net/weixin_38407447/article/details/117402939?spm=1001.2014.3001.5501新建amd.js文件//默认配置const defaultOpts = { paths:{}}gb.rj = {}rj.config =原创 2021-05-30 23:22:42 · 380 阅读 · 0 评论 -
systemjs 通用模块加载器 源码分析原理 并 实现
这里在nodejs里面分析一下systemjs 通用模块加载器的实现原理这里 npm install systemjs 后,执行一下这段代码,发现then里面可以直接拿到 lodash 的对象let {System} = require('systemjs')var lodashCdn = 'https://cdn.bootcdn.net/ajax/libs/lodash.js/4.17.21/lodash.js'System.import(lodashCdn).then(_=>{原创 2021-05-30 22:29:45 · 1865 阅读 · 0 评论 -
一道有意思的JavaScript面试题
原型对象方式实现function LazyMan(name){ return new LazyManClass(name)}function mySleep(ms){ return new Promise((resolve,reject)=>{ setTimeout(resolve,ms*1000) })}function LazyManClass(name){ this.name = name; this.task ...原创 2021-05-19 10:56:55 · 159 阅读 · 0 评论 -
vite2.0+vue3.0+vuex+vue-router4+typescript+less 从0搭建项目
环境准备 node版本12.0.0以上一:先使用vite搭建项目1.命令行输入 npm init@vitejs/app选择 vue 和 typescript键入这三个命令 安装基础包成功二.接下来修改成自己习惯的项目架构1.首先搭建vue-router 架构,先安装vue-router依赖less 依赖在src 目录下 新建views 文件夹 这里包含所有页面结构views目录下 新建 Index目录, 这里是首页,新建三个文件in..原创 2021-05-15 16:45:32 · 676 阅读 · 2 评论 -
nodejs京东接口分析 实现京东自动化功能整合(扫码登陆、商品信息监控、购物车修改、自动下单)
nodejs 实现京东自动化功能整合(扫码登陆、商品信息监控、购物车修改、自动下单)1.京东扫码登陆功能实现 原理 分析https://blog.csdn.net/weixin_38407447/article/details/1165906022.京东商品信息监控功能实现 原理 分析https://blog.csdn.net/weixin_38407447/article/details/1165926293.京东购物车修改功能实现 原理 分析https://blog.csd.原创 2021-05-10 15:27:12 · 1318 阅读 · 0 评论 -
nodejs京东接口分析系列-实现京东自动化功能 之 自动下单
本章节实现,京东自动下单功能需要用到京东的用户登陆后的信息,详情请查看https://mp.csdn.net/editor/html/116590602章节相对之前的功能,该功能会稍微复杂一点,需要通过阅读京东源码来分析,看看能不能先实现拦截提交订单请求,防止在测试的时候多次真实提交订单首先 打开https://cart.jd.com/cart_index/#none点击去结算,跳到下单页通过查看HTML结构代码,发现提交订单需要调用submit_Order(n...原创 2021-05-10 15:22:19 · 4619 阅读 · 1 评论 -
nodejs京东接口分析系列-实现京东自动化功能 之 购物车修改
本章节实现,清空购物车和添加购物车功能需要用到京东的用户登陆后的信息,详情请查看https://mp.csdn.net/editor/html/116590602章节后续感兴趣的小伙伴可自行实现 购物车的增删查改等全部功能首先,我们先分析一下京东的购物车接口打开https://item.jd.com/100009820314.html,ctrl+f12来一波~发现加入购物车功能是如此简单,以至于不敢相信http://cart.jd.com/gate.act...原创 2021-05-10 14:41:16 · 3364 阅读 · 4 评论 -
nodejs京东接口分析系列-实现京东自动化功能 之 商品信息监控
本章节无需登陆,接口是可以直接get请求调用的这里随便打开一个京东商品https://item.jd.com/100009820314.html随便看一下请求信息,就能发现很多接口能直接用1.获取商品库存状态接口(京东不能直接查看具体库存,只能查看是否有库存)http://c0.3.cn/stocks?type=getstocks&area=19_1601_36953_62867&skuIds=100009820314参数解析type:getstocksa原创 2021-05-10 13:33:38 · 3381 阅读 · 1 评论 -
nodejs京东接口分析系列-实现京东自动化功能 之 扫码登陆,需要puppeteer
最近想要实现一个京东扫码登陆和自动下单,自动抢购的功能(ps:实现京东自动化功能),!!!本项目纯属学习性质,禁止商业用途给大家分享一下我是如何一步步通过分析京东的网站请求,查看京东网站的源代码去找到对应的接口和参数爬虫必备,准备好接口的基础headers头部信息,下面所有接口请求需要在头部传入这些参数,以表示你是个正常用户~let header = { "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) Ap原创 2021-05-10 12:36:07 · 5005 阅读 · 3 评论 -
javascript实现毫秒级精准定时执行函数
由于javascript 的setTimeout 会因为事件队列问题导致不精准,有偏差,而且时间越长偏差越大这里实现了一个精准的倒计时执行函数原理:每隔时间的一半,重新设置定时器,时间继续切分一半,相当于重新校准偏差等时间达到1秒(根据业务服务器资源自行调控,时间越长越耗费性能)以内,死循环检测时间 function dealTimerTask(callback,time){ let dec = time - Da...原创 2021-04-30 15:02:09 · 1276 阅读 · 1 评论 -
laya开发微信小游戏《奇异水族馆》之 观察者模式应用
初学laya开发的微信小游戏终于上线啦!!!过年耗费几个月开发出来的小游戏,游戏内容是模仿小时候玩过的一款pc端游戏叫怪怪水族馆~~微信搜《奇异水族馆》即可畅玩哦!!暂时采用本地缓存游戏数据,后面引入游戏数据自动上传保存,功能模块还在开发中~...原创 2021-03-24 17:05:08 · 380 阅读 · 0 评论 -
vue 源码分析系列之数组监听
/** * vue 数组监听原理, 重写数组各个方法函数实现监听 */ //保存数组原型对象 var arrayProto = Array.prototype; //创建空对象,并将原型指向数组的原型对象 var arrayMethods = Object.create(arrayProto); //需要监听的方法 var methodsToPatch = [ 'push', 'pop', 'shi..原创 2021-04-27 14:25:07 · 202 阅读 · 0 评论 -
javascript深拷贝
function deepCopy(obj){ if(typeof obj != 'object'){ return obj; } let newObj = Array.isArray(obj) ? []:{}; for(let key in obj){ //过滤原型链上的属性 if(obj.hasOwnProperty(key)){ newObj[key] = obj[key] &&.原创 2021-04-25 22:30:39 · 92 阅读 · 0 评论 -
javascript手写apply函数(call同理)
Function.prototype.myApply=function(objThis){if(typeofthis!=='function'){throwError(`需要函数才能绑定`)}if(!objThis){objThis=window}letkey=Symbol()objThis[key]=thisletargs=Array.pr...原创 2021-04-25 17:04:18 · 87 阅读 · 0 评论 -
javascript手写bind函数
Function.prototype.bindq=function(objThis){if(typeofthis!=='function'){throwError(`需要函数才能绑定`)}letthat=thisletargs=Array.prototype.splice.call(arguments,1);letfun=function(){leta=args....原创 2021-04-25 15:56:51 · 104 阅读 · 0 评论