- 博客(50)
- 问答 (2)
- 收藏
- 关注
RSS订阅原创 instanceof 和 typeof 原理回顾
instanceof概念官方定义: instanceof 运算符用来检测构造函数的prototype 属性是否出现在某个实例对象的原型链上.通俗的讲: instanceof 用来判断某个对象是否为某个构造函数的实例.形象的讲: 沿着操作符左边对象的proto这条线查找,沿着操作符右边对象的prototype查找.若两条线能找到同一个引用,则返回true.若到终点还未相交,则返回false.语法object instanceof constructor // object为要测试的实例对象
2020-08-11 16:58:07
318
原创 快来和fetch玩耍吧
fetch是什么?fetch 是一种使用 promise 为构建块的现代异步网络请求方法.是当今进行异步网络请求的新标准.除了IE之外,在各大浏览器中的兼容性都还可以,在caniuse上查询fetch的浏览器兼容性,不支持的浏览器可以使用 fetch polyfill.其本质是一种标准,该标准定义了请求,响应和绑定的流程,还定义了Fetch的JavaScript API.而Fetch API 提供了 fetch() 方法.它被定义在BOM的window对象中,返回一个 Promise 对象,因此我们能够对
2020-08-06 11:14:32
403
原创 多种方式实现前端图片下载
图片下载的功能,相信大家或多或少都有接触过.刚好这两天在回看以前项目中的代码时看见有这么一个需求,就是生成一张图片并下载.因为是个管理后台项目,并没有很多人使用,因此当时的代码写的也比较简陋.正好趁空点的时间,优化下代码,把有关下载图片的这块内容捋一下.通过a标签download属性下载.container { display: flex;}figure { display: flex; flex-direction: column;}img { width: 200px;.
2020-07-31 00:59:21
4827
2
原创 从setTimeout和Promise的执行顺序来了解JS的执行机制
JS是单线程的不同于Java等多线程语言,JavaScript这门语言是单线程的,这与它的用途是相关的.大家都知道JavaScript诞生之初就是作为浏览器的脚本语言.所以它的主要用途就是与用户进行交互以及操作DOM.假如有两个线程,其中一个线程想要添加一个节点,而另一个线程则想要删除一个节点.如果这两个线程同时运行,那么结果势必会导致混乱,所以JavaScript是一门单线程的语言.同步和异步JavaScript虽然是单线程的,但是也是分 同步 和 异步 的.像我们平时用的比较多的 ajax 请求,
2020-07-29 12:34:13
1245
2
原创 来了解下字符编码的历史吧
相信关于字符编码,大家应该都有所耳闻.多多少少也都能叫出一些名词,像什么 utf-8 , ASCII , Unicode 等.刚好这两天整理笔记的时候,翻到了之前做过一些有关字符编码的笔记,那就索性和大家一起回顾下相关内容喽.编码和解码概念首先在了解各种字符编码格式和标准之前,我们先来理解下编码和解码的概念.编码(encode) 是信息按照一定的规则从一种形式或格式转换为另一种形式的过程,而 解码(decode)则是一个编码的逆转换过程.编码解码都是有一套预先规定的方案,无论是在编码过程还是解码过.
2020-07-26 11:41:45
319
原创 时间久了,可别忘记这些DOM操作常用API
前段时间工作中开发的项目,没有用到三大框架,也没有引入jQuery,全是原生的JS,其中涉及到了一些DOM操作,因此这两天趁着空闲的时间把DOM操作中的API回顾了一下.这里主要将DOM操作分为了增删改查四部分.当然了,划分的可能不是那么准确.文末第二个链接里面的老哥对于类型的划分还是挺不错的,有兴趣的可以点进去看看.查找getElementById该方法返回一个匹配特定id(区分大小写)的元素,而又因为一个id一般在一个页面中是唯一的.因此这是一个高效查找特定元素的方法.但是如果同一个页面中有.
2020-07-22 22:11:26
240
原创 移动端300ms延迟以及点击穿透
上周有几天是在写一个响应式网站,在写到移动端交互时.遇到一个问题,就是点击下拉框的选项时,下拉框背后的元素也被点击了.其实这个就是著名的点击穿透现象,因此趁着周末的时间把这个问题梳理了一下.然后呢,也是参考了一些文章之后整理了这篇总结,也算是自己对这个问题的一个记录吧.所有参考链接都放在文末.大家有兴趣的话,也可以去看看.300ms延迟延迟产生原因300ms 延迟的由来,是当初07年初苹果发布首款iPhone之前,苹果工程师提出的一个为了优化交互体验的操作.因为当时的网站基本都是为PC等大屏幕设备.
2020-07-19 23:30:35
327
原创 10分钟回顾Location对象的几个知识点
Location对象包含有关当前URL的信息.它是Window对象的一部分,可通过window.location属性来访问.我的页面路径是 http://127.0.0.1:5501/html/index.html?id=123#test,在控制台键入window.location,返回一个Location对象.这其中有些是属性,有些是方法,我们来简单了解一下.对象属性我们按照上图中展开的Location对象,来说一说其中的一些属性属性描述hash锚点部分,以#开头.
2020-07-09 00:30:46
341
原创 10分钟回顾CSS媒体查询
在摸了几天鱼以后,领导派活了.需求是写一个响应式网站,兼容PC,Pad和手机.我一听哭笑不得,这可是要了我的老命啊.都知道写响应式页面烦的很.无奈,既然领导要求,那就写咯.在正式开干之前,我找出以前记录的相关笔记,想要先好好复习一下.当看到媒体查询这一块的内容时,发现了一些我脑海中没有印象的知识点.于是正好趁着周末休息的时候,简单梳理一下有关媒体查询的相关知识点.等以后再想要复习的时候,看这篇文章就可以了.今天的主角不是响应式页面怎么写,这个话题有点广,以后有时间再写好了.今天我们就来聊一聊响应式布局.
2020-07-04 18:28:53
1368
原创 5分钟回顾原生ajax的几个知识点
今天早上在整理笔记的时候,发现了很久之前的有关ajax的相关内容.当时主要用的还是jQuery的$.ajax().现在jQuery也快要退出历史舞台了,所以今天我们就来讲讲原生的ajax吧.首先简单的介绍一下ajax,全称是Asynchronous JavaScript + XML(异步JavaScript和XML).这不是一个语言,也不是一种新技术,只是一个在2005年被提出来的新术语,其类似的技术手段最早可以追溯到上个世纪末,而最早大规模使用ajax技术的是Gmail.大家都知道,以前的网页提交数.
2020-06-29 17:42:06
208
原创 这些有关函数参数的知识点你都了解么?
相信大家对函数的形参和实参都应该比较熟悉了.今天我们主要是来回顾一下其中的知识点,温故而知新,可以为师矣.最近的文章基本都是我在整理自己以前的笔记时,看到一些知识点的回顾总结.形参和实参是什么形参是形式参数(parameter),是指在函数定义时,预先定义用来在函数内部使用的参数实参是实际参数(arguments),是指在函数调用时,传入函数中用来运算的实际值function fn(a){ console.log(a)}fn('str')上面代码中,fn后面的这个定义在()中的a.
2020-06-27 12:51:29
573
原创 一网打尽JS中的循环和遍历
JS中的循环和遍历提供给我们一种简单快速的方法去做一些重复的事情.学会在不同的场景中使用不同的方法能够帮助我们有效的编写各类代码.在这里整理了一些常见的方法,今天就让我们大家一些来学习一波.forfor循环有3个表达式声明循环变量判断循环条件更新循环变量其中,三个表达式都是可以省略的,但是两个;却是不能省略的.let arr = ['a','b','c']for(let i = 0; i < arr.length; i++){ console.log(arr[i]) .
2020-06-24 14:48:03
221
原创 JSON.stringify()还能这么玩
对于JSON,相信大家应该都蛮熟悉的.不管是前端还是后端的童鞋,应该每天都会和JSON打交道吧.JSON是 JavaScript Object Notation(JavaScript对象表示法)的缩写,是一种轻量级的文本数据交换格式,比xml更小,更快,更易于解析在JavaScript中,JSON对象包含两个方法,parse()和stringify(),前者用于反序列化,后者用于序列化.所谓的序列化,通俗的理解就是将一个对象变成字符串,而反序列化就是相对应相反的过程.今天我们主要来讲讲其中的stri.
2020-06-21 00:01:41
506
原创 JS生成UUID的多种方式
UUID 是 通用唯一识别码 (Universally Unique Identifier)的缩写.其作用是让分布式系统中的所有元素,都能拥有唯一的辨识信息.目前最广泛的,是微软的全局唯一标识符(GUID).通常,我们一般使用的UUID是个36位的字符串,其格式如下:xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx其中第15位数是4,第20位是8到b这4个中的一个方法1:function UUID(){ let str = '0123456789abcdef' .
2020-06-14 22:57:53
2682
原创 看了10篇文章,我写下了这篇有关原型和原型链的笔记
相信大家肯定见过下面这几个单词,但是有时候又是傻傻分不清楚,不知道这几个单词到底是做啥的,又有啥区别.今天我们就来好好的瞧一瞧,剖析剖析它们.它们分别是 prototyoe, __proto__, constructor.prototype在JavaScript中,每一个对象(除了null)在创建的时候都会与之关联另一个对象,这另一个对象就是我们所说的原型,每一个对象都会从原型"继承"属性.这里的继承并不是真继承.因为继承意味着复制操作,然而JavaScript默认并不会复制对象的属性.这里只是在两.
2020-06-14 01:16:19
190
原创 深拷贝和浅拷贝了解一下
javascript中的数据类型分为基本类型和引用类型.我们平时所说的深浅拷贝都是针对引用类型而言的.对于基本类型,没有深浅拷贝的说法浅拷贝当我们在对象拷贝时,如果属性(假设为key)是对象(包括数组),这时我们传递的是一个地址(该地址指向key对象),即两个对象的属性值是同一个地址,指向了同一块内存空间.当通过其中一个对象去影响了这块内存空间的内容,相同的变化也会反映在另外一个对象上复制引用let obj = { a:1, b:{ c:2 }}// 浅拷贝实现函数fu.
2020-06-11 17:41:33
338
原创 EventTarget介绍
EventTarget是一个DOM接口,由可以接收事件并且可以创建侦听器的对象实现Element,document,window是最常见的event target,但其他对象如XMLHttpRequest等构造函数创建一个新的EventTarget对象实例class T extends EventTarget { constructor(name){ super() this._name = name } get name(){ return this._na.
2020-06-09 23:37:07
2108
1
原创 函数防抖和节流
函数的防抖和节流在我们的工作中经常会用到,在面试中也经常会出现.因此今天我们来聊聊防抖和节流首先我们来看下面这张用竖线画成的图:正常执行: ||||||| |||||| |||||||||||||||| |||||||||| |||||||函数防抖: | | | |函数节流: | | | | | | | | .
2020-06-09 14:27:26
411
原创 一文了解this指向
this的中文意思是这,在javascript中指的是当前执行代码的环境对象.在非严格模式下,总是指向一个对象,在严格模式下可以是任意值.相信很多同学在看到这个this的时候,肯定是有点脑壳疼的.所以今天我就写了一篇有关this的小文章,来梳理梳理有关this的几种用法,希望对大家都能有所帮助事件调用环境谁触发事件,函数里面的this就指向谁<button id="btn1">click me</button>let btn1 = document.querySelec.
2020-06-08 14:23:27
178
原创 JS new的时候干了啥
new在MDN上的定义是:new运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例在JavaScript中,new是一个关键字,创建了一个对this的绑定.而在面向对象的语言中,new关键字总是用于实例化一个类,如在Dart中:class Person {}var p = new Person()在JavaScript中,没有类的概念(ES6的class也只是语法糖而已),但是我们只要使用函数就能来生成对象.我们使用构造函数来创建一个对象,构造函数与一般的函数没有什么区别,.
2020-06-05 15:45:19
369
原创 浅谈基本包装类型
js中的基本类型有Null , Undefined, String,Number,Boolean,Symbol等,其中为了便于操作基本类型值,ECMAScript还提供了String,Number,Boolean 这三个特殊的引用类型.这就是我们今天的主角——基本包装类型.我们先来看下面的代码,思考下代码的运行结果:var s = 'str's.name = 'string'console.log(s.name) // undefined这里s.name为什么结果不是'string'而是.
2020-06-03 10:55:05
209
原创 Dart指南
Dart是Google出品的语言,用于服务端,web端,移动端,物联网等多个领域,是一门面向对象的类定义的单继承的语言.Dart作为Flutter的开发语言,随着Flutter在18年年底发行的1.0正式版,也是逐渐走入大家的视野.所谓"工欲善其事,必先利其器",本篇就是我们走向Flutter开发的第一步.让我们拿起Dart这把武器,开始打怪升级,攒经验吧.变量创建一个变量因为在Dart语言中,一切皆对象,一个字符串,一个数字甚至null都是一个对象.因此,变量存储的是对象的引用.var s =.
2020-05-29 17:37:32
353
原创 Markdown语法指南
Markdown语法Markdown是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档标题使用 # 号可表示 1-6 级标题，一级标题对应一个 # 号，二级标题对应两个 # 号，以此类推。# 一级标题## 二级标题### 三级标题#### 四级标题##### 五级标题###### 六级标题字体*我是斜体*_我是斜体_**我是粗体**__我是粗体__***我是粗斜体***___我是粗斜体___~~我是删除~~效果如下:我是斜体我是斜体我是粗体我
2020-05-25 17:08:05
219
原创 简简单单的来入个deno的门吧
前不久, deno1.0 正式发布,相信大家应该都已经听过它了.毕竟deno的作者正是大名鼎鼎的nodeJS之父Ryan Dahl.他在之前声称node已经无力回天了,所以他决定新写一个deno.意为destroy node.通俗的说就是一个号练废了,现在要重新练一个号.deno怎么发音,有说蒂诺的,有说德诺的.为此,我特意去YouTube上听了下deno作者的发音,链接戳我,但我怎么感觉听着更像是呆诺呢? 各位同学可以自行爱好发音.deno特性Deno是使用V8引擎并内置于Rust的一个简单现代.
2020-05-21 17:42:48
212
原创 JS精度问题
我们大家都知道,JS有个很经典的浮点运算精度丢失问题,今天我们就来聊一聊这个问题产生的原因,以及该如何去解决它呢?先来看下面的代码,0.1+0.2的结果不等于0.3,这是不是超出了我们之前的认知呢?毕竟0.1+0.2=0.3可是我们小学就已经学会了的东西,到这里怎么就不一样了呢?0.1 + 0.2 //0.30000000000000004下面让我们先来了解它是如何产生的,然后再去解...
2020-05-05 13:12:11
3655
1
原创 vuepress搭建个人博客并部署
想要快速搭建自己的个人博客,记录自己的工作学习心得,争取当一条有梦想的咸鱼相信大家都了解过vue这个框架.而今天,我们的主角vuepress 就是vue的作者尤大大的一个作品.开源于大概2年前,其本意是用来为vue及其子项目写文档,现在被大部分人用来搭建个人博客.之前一直有所耳闻,vuepress可以搭建博客,但也只是有所耳闻罢了,这回趁着五一在家休息的时间,简单的学了下vuepress的用...
2020-05-03 16:37:13
7713
6
原创 vue中有contenteditable属性的div如何数据双向绑定
昨天的工作中遇到了这样一个问题.场景是这样的:与一个第三方合作,对方将页面以及数据处理写好了给我们,但是技术栈不一样,对方是直接使用bootstrap+jquery+layer.js 来构建了两个页面.其中一个地方有大致如下代码:var num = $("#div1").text()这里是通过jQuery来获取div中的内容,但这里的div是有 contenteditable 这个属性的...
2020-04-01 10:39:55
4667
原创 Javascript中的with语法
这两天在干活的时候,遇到了这么一个业务场景.就是后台接口返回的数据中有不少字段是我不需要的,而我只想保留几个我想要的数据字段,不想要整个对象赋值.我们假设后台返回的数据如下:{ "code" : "200", "msg" : "操作成功", "data" : { "name": "zhangsan", "age": 12, "job": "FE deve...
2020-03-26 16:29:23
542
原创 一文搞懂exports和module.exports的关系和区别
我们知道NodeJS遵循 CommonJS 的规范,使用 require 关键字来加载模块,使用 exports 和 module.exports 来导出模块,那么这两个导出又有什么关系或者区别呢?其实,在node执行一个文件时,会给这个文件内生成一个 exports 对象和一个 module 对象,而这个module 对象又有一个属性叫做 exports新建一个index.js文件 执行...
2020-03-02 16:58:09
1543
1
原创 ES6 Set 数据结构
作为ES6提供的一种新数据结构, Set 类似于数组,但其成员却是唯一的,不会有重复的成员出现.Set 本身是一个构造函数,可以生成Set数据结构实例化方法1// 接受数组作为参数const arr = [1,2,3]const s0 = new Set(arr)console.log(s0) //Set(3) {1, 2, 3}方法2// html<spa...
2020-02-26 15:06:49
101
原创 ES6 Map 数据结构
js对象本质上是键值对的集合,但是只能用字符串作为键,虽然在定义的时候可以使用Number或者Boolean类型作为键名,但是却会改变它的类型const obj = { true:'value1', 2:'value2'}console.log(Object.keys(obj)) // ["2", "true"]发现 obj 这个对象的key已经全部都变成了字符串,那么,当...
2020-02-25 17:51:06
135
原创 Mac下创建或修改.bash_profile
.bash_profile 是系统环境变量配置文件,下面我们来简单讲一下如何创建或修改第一种打开终端,一般打开终端的时候,默认的是 ~ 路径 也就是 /Users/yourName创建文件touch .bash_profile 打开文件open .bash_profile此时.bash_profile会以默认文本编辑器打开,直接在里面修改完以后保存,然后关闭.bash_profi...
2020-02-16 11:15:28
4258
原创 npm发包流程
说起node,大家都很熟悉了,随着node一起下载安装的还有我们的包管理工具npm(node package manager).我们平时也是一直在使用npm的,但大部分时候,我们使用的都是别人的包.假如有一天我们自己写了一个包,想要上传到npm上面去,流程是怎么样的?创建一个文件夹并且进入这个文件夹mkdir publish-test && cd $_初始化一个packag...
2019-12-25 11:04:26
605
原创 Git常用指令
项目初始化git init项目初始化之后会生成一个.git文件,如果看不见,可能是因为电脑隐藏了以.开头的文件克隆项目git clone xxxx // xxxx 表示项目地址表示从远程仓库拉取项目到本地本地项目关联远程仓库如果我们本地是有项目的,我们想要的是将本地的项目和远程仓库关联起来,那么有如下两种情况本地已有文件与git仓库关联起来(空仓库)本地已有文件与git仓库...
2019-12-24 11:34:47
196
原创 sublime text3 安装了 Markdown Editing 插件,修改.md文件样式
安装了Markdown Editing 后,打开README.md 文档一看,满屏的白色,而且左边还有很大一片空白,真是亮瞎了眼睛,那么该如何调整呢?点击如下图所示,打开user配置文件将下面的代码添加进去,可以解决3个问题.{ "color_scheme": "Packages/MarkdownEditing/MarkdownEditor-Dark.tmTheme",...
2019-12-20 15:37:50
1274
1
原创 void 0 与 undefined 的关系
在练习TypeScript的时候,在对比.ts文件和转换后的.js文件的时候://index.tsfunction getInfo(name:string, age:number=10):void { console.log(name) console.log(age)}下面是转换后的文件:// index.jsfunction getInfo(name, a...
2019-11-11 15:07:50
730
原创 JS中Number转换规则
1.Number => Number 原先是啥就是啥2.String => Number 数字字符串 => 对应数字 空字符串 '' => 0 其他的都是NaN3.Boolean => Number ture => 1 false => 04.null => Number null => 05.undefined =>...
2019-10-28 11:57:23
534
原创 sublime Text 3中安装vue高亮插件以及解决可能出现的问题
现在vue作为前端最火的几大框架之一,相信有很多人会去使用它,sublime text 作为一款前端开发神器,也是有许多的人会去使用它,但是我们发现在默认的sublime中 对于以.vue 结尾的文件不是高亮的,这就很难受了,所以今天就来和大家说一说,如何在sublime中高亮Vue,以及一些在配置过程中会出现的问题及解决方案
2017-12-11 15:12:56
3276
空空如也
请问某些微信页面的分享到朋友圈自动生成一张截图是如何实现的？
2017-05-08
PHP如何修改上传文件的大小
2017-05-02
TA创建的收藏夹 TA关注的收藏夹
TA关注的人