javascript
文章平均质量分 87
赵天明
前端工作
展开
-
MutationObserve的使用和应用
MutationObserve的使用和应用前言最近接到一个项目需求,就是把另一个项目嵌入到当前项目中。要求很简单,让人看不出这是嵌入过来的。本来觉得这也没什么,因为以前也做过一次。方案无非就是通过iframe嵌入,通过postMessage进行通信(ps:两个项目都是我们自己的,可以修改代码)。其他的一切都ok,就有个一个问题困扰了。我们当前的项目是一个典型的圣杯布局,头部和底部都要显...原创 2019-11-23 16:58:06 · 3456 阅读 · 0 评论 -
JavaScript的执行机制
JavaScript的执行机制在理解JavaScript(以下简称js)的执行机制之前,先要理解几个概念:js是单线程语言为什么要将js设计为单线程,原因是js最初是专门为浏览器设计的。可以想象一下,如果js是多线程的,那么当你对同一个dom进行不同操作时,浏览器会不知道如何执行。比如,一个线程你要删除dom,另一个线程你要修改dom,同时给浏览器下达命令,这时浏览器该如何执行呢?...原创 2019-08-20 21:03:26 · 211 阅读 · 0 评论 -
JavaScript数据类型的转换
文章目录前言强制转换Number()String()Boolean()自动转换第一种情况,不同类型的数据互相运算。第二种情况,对非布尔值类型的数据求布尔值。第三种情况,对非数值类型的值使用一元运算符(即`+`和`-`)。自动转换为布尔值自动转换为字符串自动转换为数值前言关于JavaScript(以下简称js)的数据类型的转换,我们先来看以下几个例子。例1:const A = 1 + '1'...原创 2019-08-20 21:01:31 · 227 阅读 · 0 评论 -
前端如何实现文件下载功能
文章目录前端如何实现文件下载功能结合后端实现两种实现方式第一种、直接下载服务器的静态资源第二种、前端传参,后端生成文件实现思路:优缺点优点缺点纯前端实现数据来源实现思路第一步、将数据生成对应得`data:URLs`或`blob:URL`生成`data:URLs`生成`BlobURLs`第二步、处理下载(或叫导出)方式优缺点优点缺点前端如何实现文件下载功能对于如何实现文件下载功能,根据实现的技术...原创 2019-08-04 16:20:17 · 25581 阅读 · 2 评论 -
chrome中直接使用import
现在我们在开发项目时都是基于构建工具(像webpack)上进行开发,所以在使用import时得心应手。但今天在chrome中直接使用import时,发现不知道如何使用?chrome中直接使用import三个条件:浏览器版本需要支持,浏览器的支持情况:使用<script type="module">必须在服务器环境下才运行(可以通过全局下载npm包http-...原创 2019-06-22 19:23:34 · 5012 阅读 · 1 评论 -
javascript中的对象属性迭代
创建案例对象先通过继承来创建对象:function Parent (name, age) { this.name = name || 'parent' this.age = age || 60}function Self (name, age, gender) { Parent.call(this, name, age) this.gender = gender...原创 2019-01-16 20:52:32 · 3275 阅读 · 0 评论 -
DOM事件的删除
DOM事件的删除根据事件处理程序的分类有两种DOM0级事件处理程序的事件删除监听事件element.onclick = function () {}删除事件element.onclick = nullDOM2级事件处理程序的事件删除DOM2级的事件删除,必须保证删除的事件函数与监听的事件函数是同一函数,也就是说指针是一样。所以DOM2级的事件处理函数必须是命...原创 2019-01-09 09:27:27 · 2664 阅读 · 0 评论 -
理解getBoundClientRect()
概念getBoundingClientRect用于获取某个元素相对于视窗的位置集合。集合中有top, right, bottom, left等属性。用法语法:这个方法没有参数。rectObject = object.getBoundingClientRect();object就是当前元素返回值类型:rectObject.top:元素上边到视窗上边的距离;rectObjec...原创 2018-12-27 15:25:48 · 7750 阅读 · 0 评论 -
async/await的使用和理解
ES2017 标准引入了 async 函数,使得异步操作变得更加方便。首先我们要理解async函数的几个要点:返回值是Promise不管是否return,都会返回一个Promise对象。相当于执行:return Promise.resolve(value)// 如果函数没有return,则value是undefined使用了await命令,则一定要await后面的代码执行完...原创 2018-11-17 19:40:16 · 1310 阅读 · 0 评论 -
async/await函数的执行顺序的理解
最近遇到一个关于async函数使用的Bug,因代码涉及太多业务,所以模拟了代码, 如下:let testArr = [1, 2, 3]let flag = falseconst func = (res) => { return new Promise((resolve, reject) => { if (res) { resolve(res) }...原创 2018-11-17 18:36:29 · 5163 阅读 · 1 评论