- 博客(33)
- 资源 (2)
- 收藏
- 关注
RSS订阅
原创 如何将当前地理位置（省份、城市）渲染到页面？（百度地图API）
先上组件：<template> <div class="m-position">{{LocationCity}}</div></template><script>import BMap from "BMap";export default { data() { return { LocationCity: "正在定位" //给渲染层定义一个初始值 }; }, mounted() { th
2020-06-26 11:26:45
2186
原创 ES6——Promise源码（原生javascript全部实现）
ES6——Promise源码（原生javascript全部实现）： function MyPromise (func) { var self = this; self.status = 'pending'; //进来时就先定义一个'pending'状态；等待调用时改变状态； self.resolveValue = ...
2020-02-07 00:35:01
1268
原创 ES6——异步编程Promise全方位学习，从零到源码（.then()、.catch()、.finally()、Promise.all()）
ES6——异步编程Promise学习（.then( )回调问题）异步编程：开发中无论是在浏览器环境中还是在Node环境中，我们都会使用JavaScript我完成各种异步操作（定时器、事件、ajax、读取文件、事件等），伴随着异步编程就避免不了回调机制的产生；会产生很多问题；异步编程问题：产生回调地狱，难于维护和扩展；try catch只能捕获同步代码中的异常；同步并发的异步会存在一定的问题；...
2020-02-05 01:32:33
2920
原创 ES6——之数据存储结构：Set、Map基本使用及实现原理（邻接链表详解）
ES6——之数据存储结构 Set、Map基本使用及实现原理使用时必须要new：1、Set：是ES6提供给我们的构造函数，能构造出一种新的储存数据的结构；特点：只有属性值，成员值唯一（不重复）用途：可以转换成数组，进行去重、取交集、并集、差集等操作；Set的基本使用：创建时可传[]、’'等迭代数据；const oS = new Set([1,2,false,1]); //自带去重方法...
2020-02-04 19:31:54
1964
1
原创 利用less实现多主题切换（配合天气现象）
创建src/assets/style/variables.less 使用 @XXX:var(–XXX,‘style’) 声明系列变量，之后添加其他变量直接增加即可（由于之后要配置颜色，默认值可以先给" "）也可以声明一下常用的class，方便全局使用（这里已.backgroundCard 为例）原理：先给body元素添加style，再根据天气现象动态更改style。
2023-09-08 13:45:49
919
原创 百度地图API 实现区域反遮罩，包括河北等特殊区域
这里是处理问题核心，目的是找的多个区域点最多（也就是区域最大的）当做主区域添加反遮罩，其他区域则添加遮罩；这样会有一个问题，就是其他区域，会出现遮罩背景，对效果有一定影响，这里欢迎大家给出更好解决办法…...
2022-08-08 11:29:49
1015
原创 终止请求：终止axios，JQ请求方法
终止请求：axios，JQ方法背景：项目需求中经常遇到点击操作，会频繁调用接口服务，浪费资源。有时更是会出现异步，导致结果出错，产生bug，如何让点击时终止之前所有请求，就是今天学习主要内容：连续点击优化前：连续点击优化后：终止axios请求:api.js增加配置（request.cancelToken）import axios from 'axios'import Vue from 'vue'const instance = axios.create({ // timeout: 5
2021-11-15 11:10:06
1350
原创 UTC时间，本地时间，moment，时间 详解
moment详解一、背景utc时间和北京时间：utc:世界协调时，以英国格林威治时间为准utc时间和北京时间相差8小时；北京时间：2021-1-1 22:18 <==> utc时间：2021-1-1 14:18时间戳timestamp概念：某个utc时间到utc1970-1-1凌晨经过的毫秒数北京时间：1970-1-1 00:08:00 时间戳 0utc时间：1970-1-1 00:00:00 时间戳 0对服务器的影响：服务器可能部署到任何国家，服务器内
2021-08-31 23:47:48
7384
原创 数据抓取，爬虫豆瓣读书书籍信息
标题抓取豆瓣读书中的书籍信息//思路：//先爬取网页html//将网页html进行分析，获取每个数据详情信息（在这里比较好找到作者，书名...等信息）//将每本书籍的详情信息进行抓取，转换为自己想要的格式//抓取豆瓣读书中的书籍信息//cnpm i axios cheerioconst axios = require('axios').defaultconst cheerio = require('cheerio')//抓取豆瓣读书源代码async function getBooks
2021-08-26 22:52:33
513
原创 http、https区别，深度理解SSL
http、https区别相同点：都是建立在TCP/IP协议之上的，二者都会三次握手，四次挥手等。不同点：http使用明文形式传输（极容易被篡改，窃取）https在TCP/IP协议之上又增加了一个SSL（加密传输协议，保证数据在传输过程中被窃取和篡改可以验证）深度理解 加密传输协议（SSL演变史）先了解两种加密方式：对称加密：产生一个 对称密钥 ，可以用其加密，也可以解密加密过程：信息 + 对称密钥 = XXX解密过程： XXX + 对称密钥 = 信息常用算法：DES、3DES、AE
2021-07-30 17:41:01
274
原创 vue 生命周期图 + activated + deactivated
vue 生命周期图除此之外，简单介绍一下在被keep-alive包含的组件/路由中，会多出两个生命周期的钩子:activated 与 deactivated。文档：在 2.2.0 及其更高版本中，activated 和 deactivated 将会在 树内的所有嵌套组件中触发。activated在组件第一次渲染时会被调用，之后在每次缓存组件被激活时调用。activated调用时机：第一次进入缓存路由/组件，在mounted后面，beforeRouteEnter守卫传给 next 的回调函数之前调用
2021-07-23 16:24:53
8431
原创 网络请求,状态码大全 402,403....
网络请求,状态码大全 402,403…无意再在mockjs 源码中看到，随手取出，记得曾经面试还被问过 403…laugh and cry//翻译后：100:“继续”，101:“交换协议”，200：“好的”，201:“已创建”，202:“接受”，203:“非权威信息”，204:“无内容”，205:“重置内容”，206:“部分内容”，300:“多选”，301:“永久移动”，302:“找到”，303:“见其他”，304:“未修改”，305:“使用代
2021-07-23 14:43:53
5127
1
原创 webpack（前端工程化，编译打包文件）
webpack官网文章地址1.下载cnpm i -D webpack webpack-cli （-D本地开发，部署时不需要）2.使用webpack默认webpack会以.src/index.js文件作为入口文中件（这里需要自己新建，所以开发中文件也都写在src目录下），打包到./dist/main.js 文件并且默认运行环境是生产环境（会报警告未配置）配置方法：①可命令设置：webpack --mode=devepolment (开发环境，打包后的main.js文件适合调试
2021-06-09 23:21:05
495
原创 echarts 柱状图渐变色
echarts 柱状图渐变色（基于echart官网中的阶梯瀑布图数据）设置：itemStyel{ normal{}, emphasis{} } 两个属性normal为显示样式，emphasis为hover高亮样式具体效果代码如下：option = { title: { text: '柱状图渐变色', // subtext: 'From ExcelHome', sublink: 'http://e.weibo.com/1341556
2020-12-25 13:42:59
1966
原创 vuex deep属性使用 监听对象数组改变
vuex数据格式：（数据来源echart官网）opcitions: { xAxis: { data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], }, yAxis: { name: '数值', }, series: [{ type: 'bar', barWidth: 50, // 柱图宽度 barMaxWidth: 50,
2020-11-21 22:31:05
1022
原创 如何在移动端访问本地vue的项目？
现如今移动端异常火爆，今天工作中需要写一个自定定位城市的功能，虽然浏览器也可以看到移动端的样式，但是自己心里还是不靠谱（devicemotion监听设备速度变化，deviceorientation监听设备方向变等事件）也必须在移动端预览效果那如何在移动端访问本地的项目？1、必需手机电脑在相同WiFi下2、查看WiFi下的IP地址 （命令：ipconfig）3、更改config.js文件4、重新运行vue项目，域名已经更改，在移动端运行自己的项目吧！...
2020-06-26 00:34:16
1395
原创 ES6——数据劫持Proxy 代理器
标题ES6——数据劫持Proxy今天的学习先从一个简单需求说起：假设后端传给前端数据XXX，我们必须将数据XXX渲染到页面上，但是由于后端的数据不停的改变，我们能否实现前端的页面的数据XXX跟着后端数据一起同步改变呢？这里我们用input输入框输入的不同结果来模拟后端不停数据的改变；用一个div模拟前端数据的展示；<input id='input' type="text" name="" > //注意：仅作为模拟后端数据改变使用<div id='div'></
2020-06-06 23:07:19
373
原创 号称下一代javascript语法编辑器（babel）的使用
babel工具使用：1、线上使用：https://www.babeljs.cn （点击进入在线babel工具）2、本地使用：①打开项目文件夹：（敲击命令行）$ cnpm init -y //初始化；$ cnpm install @babel/core -D //本地下载 @babel/core工具，提供语法树功能；$ cnpm install @babel/preset-env -D //下载插件集合，提供转译功能；$ cnpm insta
2020-06-06 17:30:14
288
原创 gulp的使用
gulp的使用：前言：1、gulp时一种自动化构建工具：生成流文件，减少频繁的IO（生成文件）操作，与webpack的区别：gulp可以看做任务运行器，webpack 可以看做模块打包器；2、gulp的使用流程一般是这样子的：首先通过gulp.src()方法获取到我们想要处理的文件流，然后把文件流通过pipe方法导入到gulp的插件中，最后把经过插件处理后的流再通过pipe方法导入到gulp.dest()中，gulp.dest()方法则把流中的内容写入到文件中一、下载gulp：$ cnpm ins
2020-06-06 17:07:16
180
原创 vue——组件间通信方式
组件间通信：（父子、兄弟组件数据的传递方式）一、父组件向子组件传递：1、常见方式：利用属性传递数据$attrs表示组件中未被注册的属性；可以利用其进行传值；配合v-bind可以将所有属性传递给另一个组件； //根数据传给组件，通过父组件传给子组件： var vm = new Vue({ el: "#app", data: { ...
2020-05-08 00:04:06
181
原创 Vue2.0中消除警告方法：eslint-plugin-vuefix
消除vue2.0版本中的警告方法：①package.json文件中：（更改lint字段） "lint": "eslint --fix --ext .js,.vue src",②.eslintrc.js文件中：（更改plugins字段） plugins: [ 'vuefix' ],③ 下载eslint-plugin-vuefix插件：$ npm i eslint-plu...
2020-04-12 17:24:34
7101
原创 设计模式之贪吃蛇游戏
设计模式之贪吃蛇游戏游戏效果：点击游戏源码：点击总结：通过此次利用设计模式编写贪吃蛇小游戏，加深了自己对设计模式全方位的理解，找bug能力有提高；完成后自己又利用浏览器缓存机制实现保存最高得分方法，让自己开发变得更有趣。...
2020-03-25 00:51:12
598
原创 设计模式——装饰者模式（为不同对象各自添加不同行为）
设计模式——装饰者模式（为不同对象各自添加不同行为）装饰者模式（可以理解成另一种继承方式）背景：以飞机大战为例，不同类型的飞机已由构造工厂构造完毕，当飞机碰到血包或者敌机时，实现血量会有相应变化的功能；我们知道用传统继承方法实现该功能就要为不同类型的飞机原型上增加该系列方法，会影响原有子类下的所有实例；而装饰者模式可以在不改变对象（子类）自身的基础上，在程序运行期间，为不同对象各自动态添加...
2020-02-23 16:53:44
303
原创 设计模式——工厂方法模式（批量生产不同对象方法）
设计模式——工厂模式工厂方法模式：该方法比简单工厂模式复杂，引入了抽抽象层（空的），还有子工厂；但是相比于简单工厂模式，代码的维护性和扩展性提高了，新增产品时，只需要在抽象成原型上增加该子工厂类即可，不需要修改抽象工厂类和其他子工厂；更符合面向对象的开闭原则；下面一个demo：了解工厂方法模式的便捷之处； //引入一个抽象层：PlaneFactory function Pl...
2020-02-23 15:00:40
383
原创 设计模式——代理模式（控制对象的访问）
设计模式——代理模式代理模式：为一个对象提供一种代理，以控制这个对象的访问；代理对象起到类似中介的作用，会增加一些功能（效验、合并等），也会去掉原对象的一些功能；<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compat...
2020-02-23 14:54:52
405
原创 设计模式——单例模式（高性能创建单个对象方法）
设计模式——之单例模式（高性能创建对象方法）首先介绍一下设计模式：1、设计模式是一套被反复使用、多数人知晓的、经过分类的、代码设计经验的总结；（设计模式可以说是一套开发经验，开发前应该想好自己代码采用哪些设计模式，为后期维护、开发做准备）2、设计模式的六大原则：①单一职责原则：一个函数尽量执行一个功能；（更好维护，更不容易出错）②里氏代换原则：构造函数中可以定义一些方法，但是不实现具体的...
2020-02-21 16:46:55
377
原创 微信小程序入门
微信小程序入门1、介绍：①发展：2016年首次被提出（张小龙）：越来越多的产品通过公众号来做，因为这里的开发、获取用户和传播成本更低，但是拆分出来的服务号并没有提供更好的服务，所以微信内部正在研究新的形态，叫做微信小程序；2016年9月21日，开启内测，微信小程序引起广泛关注；2017年1月9日，正式上线，低调上线，用户可以体验到各种各样的小程序提供服务；②什么是微信小程序：小程序是...
2020-02-15 01:13:56
174
原创 Git——从基础到项目搭建
Git——从零到项目搭建1、集中式与分布式的区别：Git：是分布式储存管理，客户端存储的是原始代码的完成镜像（实时的）储存到本地，也就是说每一个客户端的代码仓库都是一样的，任何部分的代码出现问题，可以使用其他客户端的代码进行修复；SVN：是集中化的版本控制系统，大家协同工作但是用的是同一个服务器，一旦服务器出了问题所有人都不能提交更新，历史记录存放位置单一，出现问题可能面临版本丢失；2、本...
2020-02-13 03:31:06
232
原创 10分钟利用hexo搭建自己的博客网站
搭建自己博客网站方法：1、准备工作：① 首先保证自己的电脑中有Node环境（下载Node即可）；② 我用的git版本控制工具进行的指令操作（下载git即可）；③ $ cnpm install hexo-cli -g ； 在全局安装hexo-cli；④ $ hexo init blog 创建一个blog文件夹；（此处速度可能较慢）3、搭建自己的本地blog仓库；按照顺序输入指...
2020-02-13 03:11:58
198
原创 ES6——promise化（异步操作）
ES6——promise化：//先看一个用Pronmise方法读取一个文件时： const fs1 = require('fs'); function readFile (path) { return new Promise( (resolve, reject) => { fs1.readFile(path, ...
2020-02-09 00:36:12
986
原创 ES6——Iterator原理及使用方法
ES6——Iterator原理及使用方法：先了解一下Symbol：（第七种数据结构）特点：唯一、可作为对象的属性，有静属性Symbol.iterator；demo：const os = Symbol(‘abc’); //赋值；const os2 = Symbol(‘abc’);const prop = ‘name’; const obj = {[prop]...
2020-02-08 00:03:05
234
原创 ES6——箭头函数（对比ES5学习法）
箭头函数：作用：箭头函数，只能作为函数使用，不能new，没有原型，目的指向性方更强，可读性更好，简化代码，提高开发效率；①写法：//demo1：// function sum (a, b){ //ES5写法；// return a + b;// }const sum = (a, b) => { //箭头函数写法，使用时，形参变量不能重复； ...
2020-02-07 00:54:49
827
十几万字前端学习笔记.pdf
2020-06-27
vue2.html.281257120
2020-05-08
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人