蘑菇炸了

instanceof概念官方定义: instanceof 运算符用来检测构造函数的prototype 属性是否出现在某个实例对象的原型链上.通俗的讲: instanceof 用来判断某个对象是否为某个构造函数的实例.形象的讲: 沿着操作符左边对象的proto这条线查找,沿着操作符右边对象的prototype查找.若两条线能找到同一个引用,则返回true.若到终点还未相交,则返回false.语法object instanceof constructor // object为要测试的实例对象

fetch是什么?fetch 是一种使用 promise 为构建块的现代异步网络请求方法.是当今进行异步网络请求的新标准.除了IE之外,在各大浏览器中的兼容性都还可以,在caniuse上查询fetch的浏览器兼容性,不支持的浏览器可以使用 fetch polyfill.其本质是一种标准,该标准定义了请求,响应和绑定的流程,还定义了Fetch的JavaScript API.而Fetch API 提供了 fetch() 方法.它被定义在BOM的window对象中,返回一个 Promise 对象,因此我们能够对

图片下载的功能,相信大家或多或少都有接触过.刚好这两天在回看以前项目中的代码时看见有这么一个需求,就是生成一张图片并下载.因为是个管理后台项目,并没有很多人使用,因此当时的代码写的也比较简陋.正好趁空点的时间,优化下代码,把有关下载图片的这块内容捋一下.通过a标签download属性下载.container { display: flex;}figure { display: flex; flex-direction: column;}img { width: 200px;.

JS是单线程的不同于Java等多线程语言,JavaScript这门语言是单线程的,这与它的用途是相关的.大家都知道JavaScript诞生之初就是作为浏览器的脚本语言.所以它的主要用途就是与用户进行交互以及操作DOM.假如有两个线程,其中一个线程想要添加一个节点,而另一个线程则想要删除一个节点.如果这两个线程同时运行,那么结果势必会导致混乱,所以JavaScript是一门单线程的语言.同步和异步JavaScript虽然是单线程的,但是也是分 同步 和 异步 的.像我们平时用的比较多的 ajax 请求,

前段时间工作中开发的项目,没有用到三大框架,也没有引入jQuery,全是原生的JS,其中涉及到了一些DOM操作,因此这两天趁着空闲的时间把DOM操作中的API回顾了一下.这里主要将DOM操作分为了增删改查四部分.当然了,划分的可能不是那么准确.文末第二个链接里面的老哥对于类型的划分还是挺不错的,有兴趣的可以点进去看看.查找getElementById该方法返回一个匹配特定id(区分大小写)的元素,而又因为一个id一般在一个页面中是唯一的.因此这是一个高效查找特定元素的方法.但是如果同一个页面中有.

上周有几天是在写一个响应式网站,在写到移动端交互时.遇到一个问题,就是点击下拉框的选项时,下拉框背后的元素也被点击了.其实这个就是著名的点击穿透现象,因此趁着周末的时间把这个问题梳理了一下.然后呢,也是参考了一些文章之后整理了这篇总结,也算是自己对这个问题的一个记录吧.所有参考链接都放在文末.大家有兴趣的话,也可以去看看.300ms延迟延迟产生原因300ms 延迟的由来,是当初07年初苹果发布首款iPhone之前,苹果工程师提出的一个为了优化交互体验的操作.因为当时的网站基本都是为PC等大屏幕设备.

Location对象包含有关当前URL的信息.它是Window对象的一部分,可通过window.location属性来访问.我的页面路径是 http://127.0.0.1:5501/html/index.html?id=123#test,在控制台键入window.location,返回一个Location对象.这其中有些是属性,有些是方法,我们来简单了解一下.对象属性我们按照上图中展开的Location对象,来说一说其中的一些属性属性描述hash锚点部分,以#开头.

今天早上在整理笔记的时候,发现了很久之前的有关ajax的相关内容.当时主要用的还是jQuery的$.ajax().现在jQuery也快要退出历史舞台了,所以今天我们就来讲讲原生的ajax吧.首先简单的介绍一下ajax,全称是Asynchronous JavaScript + XML(异步JavaScript和XML).这不是一个语言,也不是一种新技术,只是一个在2005年被提出来的新术语,其类似的技术手段最早可以追溯到上个世纪末,而最早大规模使用ajax技术的是Gmail.大家都知道,以前的网页提交数.

相信大家对函数的形参和实参都应该比较熟悉了.今天我们主要是来回顾一下其中的知识点,温故而知新,可以为师矣.最近的文章基本都是我在整理自己以前的笔记时,看到一些知识点的回顾总结.形参和实参是什么形参是形式参数(parameter),是指在函数定义时,预先定义用来在函数内部使用的参数实参是实际参数(arguments),是指在函数调用时,传入函数中用来运算的实际值function fn(a){ console.log(a)}fn('str')上面代码中,fn后面的这个定义在()中的a.

JS中的循环和遍历提供给我们一种简单快速的方法去做一些重复的事情.学会在不同的场景中使用不同的方法能够帮助我们有效的编写各类代码.在这里整理了一些常见的方法,今天就让我们大家一些来学习一波.forfor循环有3个表达式声明循环变量判断循环条件更新循环变量其中,三个表达式都是可以省略的,但是两个;却是不能省略的.let arr = ['a','b','c']for(let i = 0; i < arr.length; i++){ console.log(arr[i]) .

对于JSON,相信大家应该都蛮熟悉的.不管是前端还是后端的童鞋,应该每天都会和JSON打交道吧.JSON是 JavaScript Object Notation(JavaScript对象表示法)的缩写,是一种轻量级的文本数据交换格式,比xml更小,更快,更易于解析在JavaScript中,JSON对象包含两个方法,parse()和stringify(),前者用于反序列化,后者用于序列化.所谓的序列化,通俗的理解就是将一个对象变成字符串,而反序列化就是相对应相反的过程.今天我们主要来讲讲其中的stri.

UUID 是 通用唯一识别码 (Universally Unique Identifier)的缩写.其作用是让分布式系统中的所有元素,都能拥有唯一的辨识信息.目前最广泛的,是微软的全局唯一标识符(GUID).通常,我们一般使用的UUID是个36位的字符串,其格式如下:xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx其中第15位数是4,第20位是8到b这4个中的一个方法1:function UUID(){ let str = '0123456789abcdef' .

相信大家肯定见过下面这几个单词,但是有时候又是傻傻分不清楚,不知道这几个单词到底是做啥的,又有啥区别.今天我们就来好好的瞧一瞧,剖析剖析它们.它们分别是 prototyoe, __proto__, constructor.prototype在JavaScript中,每一个对象(除了null)在创建的时候都会与之关联另一个对象,这另一个对象就是我们所说的原型,每一个对象都会从原型"继承"属性.这里的继承并不是真继承.因为继承意味着复制操作,然而JavaScript默认并不会复制对象的属性.这里只是在两.

javascript中的数据类型分为基本类型和引用类型.我们平时所说的深浅拷贝都是针对引用类型而言的.对于基本类型,没有深浅拷贝的说法浅拷贝当我们在对象拷贝时,如果属性(假设为key)是对象(包括数组),这时我们传递的是一个地址(该地址指向key对象),即两个对象的属性值是同一个地址,指向了同一块内存空间.当通过其中一个对象去影响了这块内存空间的内容,相同的变化也会反映在另外一个对象上复制引用let obj = { a:1, b:{ c:2 }}// 浅拷贝实现函数fu.

EventTarget是一个DOM接口,由可以接收事件并且可以创建侦听器的对象实现Element,document,window是最常见的event target,但其他对象如XMLHttpRequest等构造函数创建一个新的EventTarget对象实例class T extends EventTarget { constructor(name){ super() this._name = name } get name(){ return this._na.

函数的防抖和节流在我们的工作中经常会用到,在面试中也经常会出现.因此今天我们来聊聊防抖和节流首先我们来看下面这张用竖线画成的图:正常执行: ||||||| |||||| |||||||||||||||| |||||||||| |||||||函数防抖: | | | |函数节流: | | | | | | | | .

this的中文意思是这,在javascript中指的是当前执行代码的环境对象.在非严格模式下,总是指向一个对象,在严格模式下可以是任意值.相信很多同学在看到这个this的时候,肯定是有点脑壳疼的.所以今天我就写了一篇有关this的小文章,来梳理梳理有关this的几种用法,希望对大家都能有所帮助事件调用环境谁触发事件,函数里面的this就指向谁<button id="btn1">click me</button>let btn1 = document.querySelec.

new在MDN上的定义是:new运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例在JavaScript中,new是一个关键字,创建了一个对this的绑定.而在面向对象的语言中,new关键字总是用于实例化一个类,如在Dart中:class Person {}var p = new Person()在JavaScript中,没有类的概念(ES6的class也只是语法糖而已),但是我们只要使用函数就能来生成对象.我们使用构造函数来创建一个对象,构造函数与一般的函数没有什么区别,.

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'而是.

我们大家都知道,JS有个很经典的浮点运算精度丢失问题,今天我们就来聊一聊这个问题产生的原因,以及该如何去解决它呢?先来看下面的代码,0.1+0.2的结果不等于0.3,这是不是超出了我们之前的认知呢?毕竟0.1+0.2=0.3可是我们小学就已经学会了的东西,到这里怎么就不一样了呢?0.1 + 0.2 //0.30000000000000004下面让我们先来了解它是如何产生的,然后再去解...

这两天在干活的时候,遇到了这么一个业务场景.就是后台接口返回的数据中有不少字段是我不需要的,而我只想保留几个我想要的数据字段,不想要整个对象赋值.我们假设后台返回的数据如下:{ "code" : "200", "msg" : "操作成功", "data" : { "name": "zhangsan", "age": 12, "job": "FE deve...

作为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...

js对象本质上是键值对的集合,但是只能用字符串作为键,虽然在定义的时候可以使用Number或者Boolean类型作为键名,但是却会改变它的类型const obj = { true:'value1', 2:'value2'}console.log(Object.keys(obj)) // ["2", "true"]发现 obj 这个对象的key已经全部都变成了字符串,那么,当...

在练习TypeScript的时候,在对比.ts文件和转换后的.js文件的时候://index.tsfunction getInfo(name:string, age:number=10):void { console.log(name) console.log(age)}下面是转换后的文件:// index.jsfunction getInfo(name, a...

1.Number => Number 原先是啥就是啥2.String => Number 数字字符串 => 对应数字 空字符串 '' => 0 其他的都是NaN3.Boolean => Number ture => 1 false => 04.null => Number null => 05.undefined =>...