- 博客(54)
- 收藏
- 关注
原创 GIT新建分支
git checkout -b shane(你分支的名字)git push origin shane(把本地分支 推送到远程)这样就可以在远程看到你的分支了
2021-04-20 15:06:11
153
原创 JS中 innerHTML和createElement的区别
在DOM节点操作中,innerHTML和createElement都可以实现创建元素。它们实现的功能类似,但是效率却相差很大1. innerHTML字符串拼接方式function fn() { var d1 = +new Date(); var str = ''; for (var i = 0; i < 1000; i++) { document.body.innerHTML += '<div style="width:100px; height
2021-03-03 10:27:08
863
转载 深入浅出前端本地储存
引言2021 年,如果你的前端应用,需要在浏览器上保存数据,有三个主流方案: Cookie Web Storage (LocalStorage) IndexedDB 这些方案就是如今应用最广、浏览器兼容性最高的三种前端储存方案今天这篇文章就聊一聊这三种方案的历史,优缺点,以及各自在今天的适用场景文章在后面还会提出一个全新的,基于 IndexedDB 的,更适合现代前端应用的前端本地储存方案GoDB.jsCookieCookie 的历史Cookie 早在.
2021-02-20 14:43:20
313
原创 关于前端IndexedDB的使用且和Cookie、Web Storage 的区别
// 打开了名为 pku 的数据库,如果不存在,浏览器会自动创建 const request = window.indexedDB.open('pku'); var db; // 全局 IndexedDB 数据库实例 // 在版本改变时触发 首次连接数据库时,版本从 0 变成 1,因此也会触发,且先于 onsuccess request.onupgradeneeded = function(event) { db = event.target.result; con.
2021-02-20 14:37:32
114
原创 JS 根据数组中对象的某一key进行大小排序
function createComparisonFunction(name){ return function(object1,object2){ if(object1 > object2){ return 1 }else if(object1 < object2){ return -1 }else{ return 0 } }}let d.
2021-02-19 15:53:32
1695
1
原创 使用Object.is 检查多个值是否相等
function recursivelyCheckEqual(x, ...rest) { return Object.is(x, rest[0]) && (rest.length < 2 || recursivelyCheckEqual(...rest)); }const a = [1,1,1]const b = [1,1,2]recursivelyCheckEqual(...a)// truerecursivelyCheckEqual(...b)// false.
2021-01-25 14:42:13
215
原创 JS中的深拷贝思路
深拷贝1,新建变量 判断传入对象是数组还是OBJECT 根据传入对象的constructor === Array 来判断2,判断传入对象是否是object类型 根据typeof判断 不是的话直接返回传入对象 (因为是基本类型 不会存在指针)3,如果是object类型的 进行for in循环4,循环中 判断属性 是否为对象 是的话 进行嵌套 不是的话 直接 = 就好了 deepcopy(obj){ let newobj = obj.constructor === Array ? ..
2020-12-11 14:29:35
263
2
原创 JS字符串中 slice substring substr的用法
1. slice(x,y)slice(x,y)截取字符串的一部分,并返回一个新的字符串。其中x为起始位置索引值,y为结束位置,不包含y。可以将x,y理解为 [x,y)。其中,x和y的值存在以下几种情况。① 只有一个参数此时会从参数下标开始到字符串结尾进行截取。② x<y此时会从x开始,到y结束,不包含y。③ x>y此时会返回一个空字符串。④ y为负数此时会先将y的值与字符串的长度相加,然后将得到的结果当做新的y值。然后再参考上面的2和3两种情况,根据情况给出结果...
2020-12-08 13:37:51
465
原创 每日一题-编程题
实现一个render(template,context)方法,降template中的占位符用context填充。示例:var template = '{{name}}很厉害,才{{age}}岁';var context = {name:'bottle',age:'15'};// 输入:template context // 输出:bottle很厉害 才15岁要求:级联的变量也可以展开分隔符与变量之间允许有空白字符。解答:使用正则 + trim利用非贪婪匹配/\{\{(.*?).
2020-12-01 11:26:01
367
原创 浏览器中JavaScript的运行机制 Event Loop
在浏览器中,首先JavaScript是单线程的,所以 运行的方式是一个个往下走 ,但是 有些代码 是异步执行的。所谓异步,就是不会阻塞代码的运行,而会另外开启一个空间去执行这段异步代码,其余同步的代码就仍正常执行,若异步代码中有其它的代码,则会在之后的某个时刻将异步代码中其它代码执行。 而js的 执行栈 运行方式 后进先出 最后面进去的 最先出来(最先出结果)。为什么 promise 和 setTimeout 同样是异步,为什么前者优先于后者?是因为macrotask(宏任务) 和 micro...
2020-11-27 18:12:08
143
原创 学习 JS操作符
语句1. if 语句这里的条件(condition)可以是任何表达式,并且求值结果不一定是布尔值。ECMAScript 会自动调用 Boolean()函数将这个表达式的值转换为布尔值。如果条件求值为 true,则执行语句 statement1;如果条件求值为 false,则执行语句 statement2。这里的语句可能是一行代码,也可能是一个代码块(即包含在一对花括号中的多行代码)。2. do-while 语句do-while 语句是一种后测试循环语句,即循环体中的代码执行后才会对.
2020-11-26 14:31:18
91
原创 JS 布尔操作符 学习
布尔操作符 布尔操作符一共有 3 个:逻辑非、逻辑与和逻辑或。1、逻辑非逻辑非操作符由一个叹号(!)表示,可应用给 ECMAScript 中的任何值。这个操作符始终返回布 尔值,无论应用到的是什么数据类型。逻辑非操作符首先将操作数转换为布尔值,然后再对其取反。换 句话说,逻辑非操作符会遵循如下规则。如果操作数是对象,则返回 false。 如果操作数是空字符串,则返回 true。 如果操作数是非空字符串,则返回 false。 如果操作数是数值 0,则返回 true。 ...
2020-11-26 10:05:01
461
原创 es6 Symbol 类型学习、操作符学习
Symbol(符号)是 ECMAScript 6 新增的数据类型。符号是原始值,且符号实例是唯一、不可变的。 符号的用途是确保对象属性使用唯一标识符,不会发生属性冲突的危险。 尽管听起来跟私有属性有点类似,但符号并不是为了提供私有属性的行为才增加的(尤其是因为 Object API 提供了方法,可以更方便地发现符号属性)。相反,符号就是用来创建唯一记号,进而用作非字符串形式的对象属性。// 创建全局符号let s = Symbol.for('foo');console.log(Symbol.
2020-11-25 14:57:22
144
1
原创 String 类型学习
字符串的特点ECMAScript 中的字符串是不可变的(immutable),意思是一旦创建,它们的值就不能变了。要修改 某个变量中的字符串值,必须先销毁原始的字符串,然后将包含新值的另一个字符串保存到该变量,如 下所示: let lang = "Java";lang = lang + "Script";这里,变量 lang 一开始包含字符串"Java"。紧接着,lang 被重新定义为包含"Java"和"Script" 的组合,也就是"JavaScript"。整个过程首先会分配一个足够容
2020-11-23 14:30:50
122
原创 学习关于JavaScript深入之执行上下文栈
学习连接JavaScript深入之执行上下文栈如果要问到 JavaScript 代码执行顺序的话,想必写过 JavaScript 的开发者都会有个直观的印象,那就是顺序执行,毕竟:var foo = function () { console.log('foo1');}foo(); // foo1var foo = function () { console.log('foo2');}foo(); // foo2然而去看这段代码:function
2020-11-16 17:24:02
112
原创 学习JavaScript 中的执行上下文和执行栈
js 执行栈 运行方式 后进先出 最后面进去的 最先出来(最先出结果)function first() { console.log('Inside first function'); second(); console.log('Again inside first function');}function second() { console.log('Inside second function');}first();console.log('Inside Gl...
2020-11-16 16:34:35
76
原创 关于在js中遇到精度丢失问题的解决方案
在js的运算中 会遇到类似于 0.3 != 0.1+0.2; 0.3-0.1 =0.19999999999999998;精度丢失的问题可以用以下方式解决/** * 把错误的数据转正 * strip(0.09999999999999998)=0.1 */function strip(num: number, precision = 12): number { return +parseFloat(num.toPrecision(precision));}这样的话 得到...
2020-11-13 14:06:37
785
原创 使用IIS发布前端项目时 如何设置反向代理
再IIS上发布好web项目后,1、点击站点功能视图---> Url重写---> 添加入站规则如上设置后Url重写的结果其实就是下面的web.config文件<?xml version="1.0" encoding="utf-8"?><configuration> <!-- To customize the asp.net core module uncomment and edit the following section. ..
2020-11-05 14:40:59
520
原创 微信小程序之 vant-weapp使用Toast 遇到的问题
官方给的路径是这样import Toast from 'path/to/@vant/weapp/dist/toast/toast';引入后发现报错。。。。。。正常的路径应该为importToastfrom'@vant/weapp/toast/toast';修改完成后 便可使用啦!
2020-10-23 10:03:01
1268
原创 关于防抖debounce和节流throttle
最近又用到了防抖和节流这两个方法,平时都是直接调用的方法 也没太注意实现的原理 今天就好好的了解一下!!首先防抖 中有三个类型 分别是 规定时间内点击最后一次结束时才触发、点击第一次就触发,规定时间内不再触发、以及根据传入是否立即执行来进行触发,首先是非立即执行的版本function debounce(fn,time){ let time = time || 500; let timeout; return function(){ let that = this; let arg
2020-09-04 10:39:40
163
转载 angular使用jsencrypt插件
1.首先在angular项目里边安装jsencrypt模块npm install --save jsencrypt2.引入使用import * as JsEncryptModule from 'jsencrypt';export class RsaUtil { constructor() { } public getSignStr(timestr: string) { let publicKey = '-----BEGIN PUBLIC KEY--
2020-09-03 09:11:14
630
转载 正则表达式中?=和?:和?!的理解
要理解?=和?!,首先需要理解前瞻,后顾,负前瞻,负后顾四个概念:// 前瞻:exp1(?=exp2) 查找exp2前面的exp1// 后顾:(?<=exp2)exp1 查找exp2后面的exp1// 负前瞻:exp1(?!exp2) 查找后面不是exp2的exp1// 负后顾:(?<!exp2)exp1 查找前面不是exp2的exp1举例:"中国人".replace(/(?<=中国)人/, "rr") // 匹配中国人中的人,将其替换为rr,结果为 中国r
2020-08-18 17:16:18
221
转载 把nodejs项目部署在服务器上
forever和pm2的区别:forever 管理多个站点,每个站访问量不大,不需要监控。pm2网站访问量比较大,需要完整的监控界面。使用forever的命令:[plain]view plaincopynpminstallforever-g[plain]view plaincopyforeverstartapp.js使用pm2的命令:[plain]view plaincopynpminstallpm2-g[plain...
2020-08-04 13:37:36
1124
转载 Page Visibility API
document.visibilityState这个 API 主要在document对象上,新增了一个document.visibilityState属性。该属性返回一个字符串,表示页面当前的可见性状态,共有三个可能的值。hidden:页面彻底不可见。 visible:页面至少一部分可见。 prerender:页面即将或正在渲染,处于不可见状态。其中,hidden状态和visible状态是所有浏览器都必须支持的。prerender状态只在支持"预渲染"的浏览器上才会出现,比如 Chrom
2020-08-04 09:35:50
204
原创 js中 关于export default 和 export 区别
export default 和 export 区别:export与export default均可用于导出常量、函数、文件、模块等 你可以在其它文件或模块中通过import+(常量 | 函数 | 文件 | 模块)名的方式,将其导入,以便能够对其进行使用 在一个文件或模块中,export、import可以有多个,export default仅有一个 通过export方式导出,在导入时要加{ },export default则不需要export default 和 export 的主要区别 在于对
2020-07-01 13:47:01
2292
原创 在VUE中使用axios之如何引入
首先要安装axios包npminstall--saveaxiosvue-axios然后在vue中的main.js中 引入axiosimportaxiosfrom'axios'importVueAxiosfrom'vue-axios'Vue.use(VueAxios,axios)引入之后 就可以在组件中使用了。 this.axios.get('https://yesno.wtf/api') .then(function(respon...
2020-06-30 14:18:51
1944
原创 关于Lodash的用法
什么是Lodash?Lodash是一个一致性、模块化、高性能的 JavaScript 实用工具库。Lodash 消除了处理数组的麻烦,从而简化了 JavaScript、 数字、对象、字符串等。它的模块化方法非常适合: 迭代数组,对象和字符串 操作和测试值 创建复合功能 如何在vue中使用Lodash 、首先 npm i lodash -S其次在main.js 中import _ from 'lodash'Vue.prototype._ = _;..
2020-06-30 14:09:51
480
原创 关于angular中 object类型和any类型的区别
any类型是十分有用的,它允许你在编译时可选择地包含或移除类型检查。 你可能认为Object有相似的作用,就像它在其它语言中那样。 但是Object类型的变量只是允许你给它赋任意值 - 但是却不能够在它上面调用任意的方法,即便它真的有这些方法let notSure: any = 4;notSure.ifItExists(); // okay, ifItExists might exist at runtimenotSure.toFixed(); // okay, toFixed exists ..
2020-06-29 17:38:04
1506
原创 angular 局域网访问 angular 预加载功能
angular 局域网访问本地项目 想让其他同局域网的同事访问 可以通过以下代码来实现如果 你平时启动项目 用 ng serve 那只需变更为 ng serve--host xxx.xxx.xxx.xxx (xxx 为本地ip)若果你是用 ng start 则如图所示angular 预加载功能在routing-module.ts文件中 引入import { PreloadAllModules } from '@angular/router';然后在imports中...
2020-06-04 11:14:07
301
原创 关于 VUE打包后 在nginx上发布时 刷新报404 的解决方法
在nginx的nginx.config文件中 添加try_files $uri $uri/ /index.html;然后重启即可正常刷新访问。
2020-05-14 17:01:38
481
原创 有关git 的一些用法
git checkout -b <可自定义的本地分支的名称> origin/<分支名> ,此时就创建了一个本地的新分支,并且代码是从远程新分支下下来的。切换本地仓库 git checkout <本地分支的名称> 即可。git branch 看所有本地的 加个 -a 看所有的。git branch<自定义的本地分支的名称> 创建一个...
2020-05-08 13:37:35
121
原创 angular 中关于同级组件数据传输 以及数据变化时 触发事件
首先 新建一个servicesimport { EventEmitter, Injectable } from '@angular/core';import { Subject } from 'rxjs';export class Book { name: string; price: number;}@Injectable({ providedIn: 'root',...
2020-05-07 16:22:43
640
原创 关于ng-alain 9.0测试版本新建项目无法使用路由复用问题
在 ng-alain新版本中 在shared.module.ts中 作者 默认取消掉了import{DelonABCModule}from'@delon/abc'; 的引入这样会导致在按照文档进行路由复用的时候,无法正常使用。 会提示找不到 reuse-tab 这个组件 这时候 只要把DelonABCModule 这个整体 或者ReuseTabModule 这个引入到share...
2020-04-27 09:54:36
555
3
原创 关于js的
var a = [1];function f(a){ a[100] = 3; a = [1,2,3]}f(a);console.log(a)引用类型函数传参传的是指针的值。直接对其属性操作的话。改变的是指针指向的地址的值。所以值会变。函数里面第二个a。是赋值。相对于把a指向了另一个地址。所以原来的a指向的值不会改变所以 结果是 [1,empt...
2019-07-31 15:23:29
75
原创 每日一学之 关于 setTimeout和
setTimeout(function(){ console.log('set1')})var p = new Promise(function(resolve,reject){ resolve()})setTimeout(function(){ console.log('set2'); new Promise(function(resolve,reject){ resolv...
2019-07-31 15:20:27
109
原创 ng-zorro图标问题
看到好多人留言 再补充一下 如果你在图标库看到的标签是<i nz-icon nzType="folder-open" nzTheme="outline"></i> 这个的 那你就要在 style-icons-auto.ts 这个文件中引入FolderOpenOutline 以及在export constICONS_AUTO中也加入FolderOpenOut...
2019-06-04 15:14:14
1526
4
原创 关于如何使用rxjs
import { interval } from 'rxjs';// Create an Observable that will publish a value on an intervalconst secondsCounter = interval(1000);// Subscribe to begin publishing valuessecondsCounter.subscr...
2019-06-03 13:41:55
192
原创 关于angular form 表单 赋值的问题
之前不是很了解form表单 , 每次 弹窗从新打开时 都是选择 从新group一个 表单,如下所示this.validateForm = this.fb.group({ userName: [null, [Validators.required]], password: [null, [Validators.required]], remember: [...
2019-05-17 10:36:44
3553
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人