- 博客(50)
- 收藏
- 关注
RSS订阅原创 不推荐使用cnpm命令镜像安装依赖的原因，及依赖安装最佳的实践方案
前言：package-lock.json的作用：在NPM5之后更新了package-lock.json文件，因为在使用package.json里 是只会同步依赖的大版本号，对于小版本无法保证同步。而package-lock.json就是为了解决这个问题推出的，它会在npm install的时候自动创建，记录下当前依赖的版本。在其他协同着在首次npm install时就会通过package-lock.json安装依赖，以保证项目依赖版本的完全一直。1.为什么不推荐使用cnpm安装依赖 cnpm..
2021-06-07 16:49:38
1202
原创 position:sticky的应用与失效条件
1.使用方法sticky生效的前提是，必须搭配top、bottom、left、right这四个属性一起使用，不能省略，否则等同于relative定位，不产生"动态固定"的效果。它的具体规则是，当页面滚动，父元素开始脱离视口时（即部分不可见），只要与sticky元素的距离达到生效门槛，relative定位自动切换为fixed定位；等到父元素完全脱离视口时（即完全不可见），fixed定位自动切换回relative定位。2.应用场景（1）顶部Nav导航的自动跟随，以前用JS实现的效果现在只要两行C
2020-12-21 10:59:16
2178
原创 如何使用json-server模拟数据
工作中，在进行前端开发时，如果后端还没有做好准备，前端不可避免的要使用一些模拟数据。很多时候，我们并不想使用简单的静态数据，这个时候，我们就可以使用json-server来完成模拟请求以及返回数据的过程。json-server 是一个 Node 模块，运行 Express 服务器，你可以指定一个 json 文件作为 api 的数据源，简单来讲就是可以用来模拟接口数据。安装使用npm全局安装npm install -g json-server或者使用yarn全局安装yarn global ad
2020-12-19 11:23:42
3744
2
原创 在小程序中使用Less的方法
VScode中的 Easy LESS插件可以实现保存less文件在同级目录生成同名css文件。并且该插件可以导出在微信开发者工具中使用。使用步骤：1.vscode中下载插件Easy LESS(大写的LESS)2.在C:\Users\userName\.vscode\extensions中复制Easy LESS3.打开微信开发者工具 设置-》拓展设置-》拓展-》编辑自定义拓展-》打开拖拽文件夹把Easy LESS复制在这4.微信开发者工具设置-》拓展设置-》编辑器-》更多及工作区的编辑器.
2020-12-17 14:09:34
428
原创 图片加载失败后CSS样式处理最佳实践
思路：图片加载失败后给图片标签加上一个类名，给该类添加伪元素引入我们自己需要的加载失败图片覆盖在裂掉的图片上，并把alt内容加载显示在其中HTML:<img src="imgX.png" alt=alt内容" onerror="this.classList.add('error');">CSS:img.error { display: inline-block; transform: scale(1); content: ''; color: transpa.
2020-12-16 16:15:12
206
转载 jquery中attr与prop 读写值的不同表现
最近在进行项目开发的时候，发现全选与否的时候出现了问题，同样的代码，在不同框架中，不能正常运行了，function selectall() { if ($('#checkall').is(':checked')) { $("[name='check_kid']").attr("checked", 'true'); } else { $("[name='check_kid']").removeAttr("checked"); }}
2020-12-15 09:23:32
126
原创 8道经典JavaScript面试题解析，你真的掌握JavaScript了吗？
JavaScript是前端开发中非常重要的一门语言，浏览器是他主要运行的地方。JavaScript是一个非常有意思的语言，但是他有很多一些概念，大家经常都会忽略。比如说，原型，闭包，原型链，事件循环等等这些概念，很多JS开发人员都研究不多。所以今天，就来和大家看看下面几个问题，大家可以先思考一下，尝试作答。八道面试题问题1：下面这段代码，浏览器控制台上会打印什么？问题2:如果我们使...
2019-08-30 17:20:45
144
原创 对于“不用setInterval，用setTimeout”的理解
JavaScript高级程序设计（第三版）（以下简称红宝书）22.3高级定时器中详细介绍了定时器setTimeout和setInterval，看完书后，深入理解了二者的区别，结合前辈们给我的建议“用setTimeout，不要用setInterval”，写下此文，分析这个建议的合理性。这两个家伙看上去长得差不多，func是要执行的函数，interval是时间间隔。setTimeout(fun...
2019-08-28 17:45:09
307
原创 怕不是在刁难我的算法题
案例1题目描述：求1+2+3+…+n，要求不能使用乘除法、for、while、if、else、switch、case等关键字及条件判断语句（A?B:C）。我去，求和居然不让用乘除法，也不准我们用循环，如果单独这两个限制的话还好，我们还可以用地递归，例如：f(intn){if(n==0){returnn;}else{...
2019-08-26 10:38:39
113
原创 位运算简述
1：背景在现代计算机中所有的数据都是以二进制的形式存储在设备中。即0、1两种状态，计算机对二进制数据进行的运算(+、-、*、/)都是叫位运算，即将符号位共同参与运算的运算。2：计算机计算原理加法和乘法举一个简单的例子来看下CPU是如何进行计算的，比如这行代码int a = 35;int b = 47;int c = a + b;计算两个数的和，因为在计算机中都是以...
2019-08-26 10:15:02
156
转载 SaaS、PaaS、IaaS是什么？
云计算的服务模式仍在不断进化，但业界普遍接受将云计算按照服务的提供方式划分为三个大类：SaaS（Software as a Service–软件即服务）PaaS（Platform as a Service–平台即服务）IaaS（Infrastructure as a Service–基础架构即服务）。PaaS基于IaaS实现，SaaS的服务层次又在PaaS之上，三者分别面对不同的需求...
2019-08-07 15:03:07
158
原创 vue页面与iframe页面通信方法
获取iframe里的内容主要的两个API就是contentWindow,和contentDocumentiframe.contentWindow, 获取iframe的window对象iframe.contentDocument, 获取iframe的document对象这两个API只是DOM节点提供的方式(即getELement系列对象)在iframe中获取父级内容同理，在同域下，...
2019-08-07 14:44:07
4999
1
转载 vscode常用配置记录
1.vscode + ESLint保存自动修改代码不管是多人合作还是个人项目，代码规范是很重要的。这样做不仅可以很大程度地避免基本语法错误，也保证了代码的可读性。这所谓工欲善其事，必先利其器，个人推荐 eslint+vscode 来写 vue，绝对有种飞一般的感觉。效果如图：每次保存，vscode就能标红不符合eslint规则的地方，同时还会做一些简单的自我修正。安装步骤如下...
2019-05-24 14:21:28
531
转载 10 年前被删的初恋，凌晨 1 点突然加我…
背景今天凌晨一点，突然有个人加我的qq，一看竟然是十年前被我删掉的初恋……因为之前在qq空间有太多的互动，所以qq推荐好友里面经常推荐我俩互相认识……谜之尴尬同意好友申请以后，仔细看了她这十年间所有的qq动态和照片。她变美了，会打扮了，以前瘦瘦的身材配上现在的装扮和妆容，已经是超越我认知的女神了。而我依然碌碌无为，逐渐臃肿的身体加上日益上扬的发际线，每天为生活操劳和奔波，还穷。用...
2019-05-16 15:19:51
183
原创 vue + java项目部集成方法
可以将war包与打包后的dist文件放在一个tomcat中启动、router里的设置：mode: 'hash'由于是要继承到门户的网页，其实是本意是多页面。如果mode为history模式回车找不到对应页面就会报错base: process.env.NODE_ENV === 'development' ? '/' : '/dist/'在开发模式中路由寻找的base路径为根...
2019-04-28 14:31:43
5107
原创 git增量发布方法
选择两个版本的id在项目目录git base里执行以下语句、git diff fb680360 3c00a593 --name-only | xargs tar -czvf update.tar.gz
2019-04-22 14:09:01
1435
原创 vue实现国际化
1.首先安装国际化组件vue-i18n$ npm install vue-i18n --save2.在main.js中完成注册使用import VueI18n from 'vue-i18n'Vue.use(VueI18n)const i18n = new VueI18n({ locale: 'zh', // 语言标识 messages: { 'zh': r...
2019-04-01 10:40:09
127
转载 WebSocket
一、内容概览WebSocket的出现，使得浏览器具备了实时双向通信的能力。本文由浅入深，介绍了WebSocket如何建立连接、交换数据的细节，以及数据帧的格式。此外，还简要介绍了针对WebSocket的安全攻击，以及协议是如何抵御类似攻击的。二、什么是WebSocketHTML5开始提供的一种浏览器与服务器进行全双工通讯的网络技术，属于应用层协议。它基于TCP传输协议，并复用HTTP的...
2019-03-25 11:06:40
90
原创 JavaScript之为什么要用let代替var
javascript中用 var 声明变量，存在以下问题：声明的变量为全局变量(被誉为JS最大设计缺陷之一)：var a = 123;console.log(window.a); // 123这造成了在开发大型项目或引入三方库时，很容易覆盖已有变量。变量提升：console.log(a); // undefinedvar a = 1;这种奇异的行为会...
2019-03-20 13:52:21
2434
转载 一些JS简写方式
1.数据类型转换~是按位取反的意思，计算机里面处理二进制数据时候的非，~~就是再转回来，利用两个按位取反的符号，进行类型的转换，转换成number类型，并向下取整。~~3.14 ==> 3 //此处可以替代Math.round()方法~~'1234' ==> 1234 //此处可以替代parseInt()方法~~'' ==> 0~~f...
2019-03-20 13:31:48
1740
原创 兼容性问题
1. ios 在获取时间如（2018-01-01） 中 - 无法识别。 需要替换成（2018/01/01）格式。安卓与ios都能识别2.在做vue单页面应用时 导入jsssdk时发现。 ios URL会一直停在第一次进入的页面。路由切换的时候 URL不会再改变。而安卓切换正常。所以安卓切换页面需要重新请求jssdk。而ios不需要3. v-echarts 在IE11不兼容、 ...
2018-12-03 09:50:44
195
转载 函数去抖（debounce）和函数节流（throttle）
一、安装cnpm i lodash -S二、方法一1、引入import _ from 'lodash'Vue.prototype._ = _2、使用this._.debounce(this.handleClick,1000,false)3.简单debounce函数与使用 例：function debounce(fn, delay) { let t...
2018-11-15 16:32:02
209
原创 node 搭建简单服务器-（用于mock数据）
1.安装express依赖(是一个基于 Node.js 平台，快速、开放、极简的 Web 开发框架) npm install express --save2.看代码就好了 node serves.js就能开启服务//安装express依赖 并用变量保存起来方便调用里面的方法var express = require("express");var app = expr...
2018-10-30 15:02:22
868
原创 Vue-cli 搭建与要点
1.安装vue-cli① 使用npm（需要安装node环境）全局安装webpack，打开命令行工具输入：npm install webpack webpack-cli -g② 全局安装vue-cli，在cmd中输入命令: npm install --global vue-cl2.用vue-cli来构建项目① 在工作目录下进入npm 输入一下命令创建一个vue项目：vue in...
2018-10-18 17:16:58
279
转载 简单总结下JS中遇到的几种遍历方法
下面是几种遍历的方法，另外我们常用来中断循环的语句我在这里简单的提一下： a、continue： 中断本次循环； b、return和break直接跳出循环。1.for循环var arr = [1, 2, 3]for(var i = 0, len = arr.length; i < len; i++) { // 这里的i是代表数组的下标console.log(i); ...
2018-10-18 15:34:17
142
转载 Map和Set 与 Iterable
JavaScript的默认对象表示方式{}可以视为其他语言中的Map或Dictionary的数据结构，即一组键值对。但是JavaScript的对象有个小问题，就是键必须是字符串。但实际上Number或者其他数据类型作为键也是非常合理的。为了解决这个问题，最新的ES6规范引入了新的数据类型Map。Tips: 1. map、set 都支持链式操作 2. 扩...
2018-10-17 14:34:49
204
原创 Vue项目踩的坑
1.vue-router有两种模式 hash 和history （前端路由） 默认模式为hash， vue中使用router-link to=`/home` 替代a标签 hash 修改 #后路径 并且#后路径不发送给服务器 history API 无# 可以前后跳转 但是怕回车 服务器没有配置对应路径指向同一个html文件就回404 mode=h...
2018-09-11 10:13:05
1627
转载 基础总结与面试题
字符串常用方法：1.str.charAt(index); 返回子字符串，index为字符串下标，index取值范围[0,str.length-1]2.str.indexOf(searchString,startIndex); 返回子字符串第一次出现的位置，从startIndex开始查找，找不到时返回-13.str.substring(start,end); 两个参数都为正数，返回...
2018-07-16 16:05:26
113
转载 用github部署静态网站
对于简单的静态网站，可以直接挂在github上，为什么推荐这样呢，因为免费。 在Github上免费部署静态网站的简单的操作步骤如下： 1. 新建仓库Repository 2. 克隆已有的仓库，复制项目到仓库文件夹中， 再次上传修改后的项目。 3. 选择一个默认主题 单击创建好仓库后，在仓库主页面里点击Settings，进入设置页面，找到GitHub Page, 并且...
2018-07-05 19:42:22
929
转载 Markdown简单语法
1. 段落与换行一个 MD段落是由一个或多个连续的文本行组成，它的前后要有一个以上的空行（若某一行只包含空格和制表符，则该行也会被视为空行）「由一个或多个连续的文本行组成」这句话其实暗示了 Markdown 允许段落内的强迫换行（插入换行符）。操作方法为在行末添加两个以上空格后回车2. 标题标题在文章中不可或缺的，MD中只要在标题文字前加上 # 即可（最好在井号后加上一个空格）# 一级标题## 二...
2018-07-04 22:48:50
263
转载 HTML5 <template>标签元素简介
一、HTML5 template元素<template>元素，顾名思意，就是用来声明是“模板元素”。二、HTML5 template元素看下下面四种嵌套图片HTML，同时图片内容不显示，不会有请求的写法：<script type="text/template"><img src="mm1.jpg"></script><textarea st
2018-06-01 13:49:55
1036
原创 Vue--学习笔记四
Vue中挂载所用的el ， 可选用两种类型，一种是css选择器 例：#app .还可用HTMLElement 例：document.getElementById("app").但注意，el 只会匹配对应的第一个元素。所以不能给统一个元素绑定两个Vue实例。另外var app = new Vue({}); 可用在别的Vue实例里通过变量名app获得里面的数据。...
2018-06-01 13:48:11
139
转载 javascript中浮点运算精度问题
计算机是由二进制存储和处理数字的，不能精确到处理浮点数，且javascript也没有这样的方法 所以在浏览器计算的时候也会有误差，比如说 我想用 3.3 / 1.1 那么按道理来说 答案是 3 ，对不对 但是我们可以打印出来看下 结果令我们很惊讶 是 2.9999999999999996 . 现在我们想 为了避免产生精度差异，需要计算的数字升级（乘以10的n次幂）成计算机能够精确识...
2018-05-29 13:47:50
324
转载 设计模式------策略模式
什么是策略模式？GoF四兄弟的经典《设计模式》中，对策略模式的定义如下：定义一系列的算法，把它们一个个封装起来，并且使它们可互相替换。上边这句话，从字面来看很简单。但是如何在开发过程中去应用，仅凭一个定义依然是一头雾水。以笔者曾经做过的商户进销存系统为例：某超市准备举行促销活动，市场人员经过调查分析制定了一些促销策略：购物满100减10购物满200减30购物满300减50。。。收银软件的界面是这样...
2018-05-29 13:43:07
168
转载 设计模式概念-----与装饰者模式
设计模式主要是基于以下的面向对象设计原则。对接口编程而不是对实现编程。优先使用对象组合而不是继承。设计模式的六大原则1、开闭原则（Open Close Principle）开闭原则的意思是：对扩展开放，对修改关闭。在程序需要进行拓展的时候，不能去修改原有的代码，实现一个热插拔的效果。简言之，是为了使程序的扩展性好，易于维护和升级。想要达到这样的效果，我们需要使用接口和抽象类，后面的具体设计中我们会...
2018-05-29 10:48:49
162
原创 Vue--学习笔记三
组件基础实例这里有一个 Vue 组件的示例：// 定义一个名为 button-counter 的新组件Vue.component('button-counter', { data: function () { return { count: 0 } }, template: '<button v-on:click="count++">You c...
2018-05-28 17:54:31
183
原创 Vue--学习笔记二
for遍历对象： 三个参数分别为 值 键 索引<div id="app"> <ul> <li v-for = "(value,key,index) in obj" > {{ key }} : {{ value }} : {{ index }} </li> &
2018-05-21 10:20:59
124
原创 一些Js题目
//1.找出数字数组中最大的元素（使用Match.max函数） // var arr = [1, 10, 20, 80, 60]; // console.log(Math.max.apply(this, arrs)); //obj.call(thisObj, arg1, arg2, ...); // obj.apply(thi...
2018-05-18 18:14:35
360
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人