
前端
文章平均质量分 66
码上行舟
接受自己的普通,然后全力以赴的出众
展开
-
es6异步async函数
async 和 await 是用来处理异步的。即你需要异步像同步一样执行,需要异步返回结果之后,再往下依据结果继续执行。async 是“异步”的简写,而 await 可以认为是 async wait 的简写。async 用于申明一个 function 是异步的,而 await 用于等待一个异步方法执行完成。一句话,它就是 Generator 函数的语法糖。原创 2023-02-10 09:30:36 · 332 阅读 · 0 评论 -
es6生成器函数Generator
Generator 是 ES6 引入的实现异步操作的一种新方法,在 Generator 出现之前,不管哪种方法,异步操作都是使用回调函数来实现的。只从出现了 Generator 之后,开发人员可以使用同步调用的逻辑来实现异步操作,只要在需要等待的地方,使用 yield 语句放弃运行即可。原创 2023-02-09 14:32:42 · 218 阅读 · 0 评论 -
es6数据结构Map键值对
Object 都有自己的原型,原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。JavaScript 的对象(Object),本质上是键值对的集合(Hash 结构),但是传统上只能用字符串当作键。这给它的使用带来了很大的限制。一个Object的键只能是字符串或者 Symbols,但一个 Map 的键可以是任意值,包括函数、对象、基本类型。Map 中的键值是有序的,而添加到对象中的键则不是。如果 Map 的键是一个简单类型的值(数字、字符串、布尔值),则只要两个值严格相等,Map 将其视为一个键。原创 2023-02-09 12:27:25 · 368 阅读 · 0 评论 -
es6数据结构Set集合
Set对象是值的集合,你可以按照插入的顺序迭代它的元素。 Set中的元素只会出现一次,即 Set 中的元素是唯一的。Set是一个集合,他的元素不会重复,每个元素都是唯一且无序的。ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。原创 2023-02-08 18:53:33 · 504 阅读 · 0 评论 -
es6模块化语法
凡是开发大型应用程序,模块必然是不可或缺的一部分。那么什么是模块化呢?其实模块化就是将一个复杂的系统分解成多个独立的模块的代码组织方式。在很长的一段时间里,前端只能通过一系列的标签来维护我们的代码关系,但是一旦我们的项目复杂度提高的时候,这种简陋的代码组织方式便是如噩梦般使得我们的代码变得混乱不堪。所以,在开发大型Javascript应用程序的时候,就必须引入模块化机制。原创 2023-02-08 09:41:31 · 217 阅读 · 0 评论 -
es6解构赋值
ES6 提供了一个称为破坏赋值的新特性,它允许我们从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)在 ES6 之前,没有直接的方法可以将返回数组的元素分配给多个变量,例如 x、y 和 z。) 将数组的所有剩余元素放入一个新数组中。如果只想取两个值,可以丢弃剩余的元素或使用。解构不仅可以用于数组,还可以用于对象。要获得个人分数,我们需要这样做。对象的解构也可以指定默认值。创建一个数组保存分数。原创 2023-02-07 15:18:23 · 150 阅读 · 0 评论 -
es6异步操作Promise
Promise的英语意思就是“承诺”,表示只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。Promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理和更强大。它由社区最早提出和实现,ES6 将其写进了语言标准,统一了用法,原生提供了Promise对象。对象的状态不受外界影响一旦状态改变,就不会再变,任何时候都可以得到这个结果pending(进行中)fulfilled(已成功)rejected(已失败)原创 2023-02-07 14:44:52 · 417 阅读 · 0 评论 -
es6反射Reflect
为什要叫做反射?因为它能做的事情,和其他语言(Java、python等)中的反射很相似。其他语言中都叫做反射了,那就共鸣。Reflect对象与Proxy对象一样,也是 ES6 为了操作对象而提供的新 API。Reflect对象的设计目的有这样几个。将Object对象的一些明显属于语言内部的方法(比如Object.defineProperty),放到Reflect对象上。现阶段,某些方法同时在Object和Reflect对象上部署,未来的新方法将只部署在Reflect对象上。原创 2023-02-06 16:45:58 · 583 阅读 · 0 评论 -
es6代理proxy
什么是代理?刚开始入行的同学可能就会问了。我们可以这样说,代理Proxy是一个构造函数,它可以接受两个参数:目标对象(target) 与句柄对象(handler) ,返回一个代理对象Proxy,主要用于从外部控制对对象内部的访问。原创 2023-02-06 16:24:34 · 244 阅读 · 0 评论 -
es6模板文字
在JavaScript ES6之前,您将使用 + 运算符将字符串中的变量和表达式连接起来。模板文字(模板字符串)允许您使用字符串或字符串形式的嵌入式表达式。它们包含在反引号``中原创 2023-02-05 09:58:24 · 232 阅读 · 0 评论 -
es6符号symbol
ES5 的对象属性名都是字符串,这容易造成属性名的冲突。比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法(mixin 模式),新方法的名字就有可能与现有方法产生冲突。,Symbol数据就是一个全局唯一的值,全局唯一的作用就是避免冲突。您可以使用创建自己的符号,表示独一无二的值。这是ES6中的一种新的原始数据类型。ES6 数据类型除了 Number 、 String 、 Boolean 、 Object、 null 和 undefined ,还新增了 Symbol。符号是不可变和唯一的。原创 2023-02-05 09:48:55 · 295 阅读 · 0 评论 -
es6类基础用法
ECMAScript6中终于引入了类的特性,在此以前只能经过其余方法定义并关联多个类似的对象,固然了,ES6中的类与其余语言中的仍是不太同样,其语法的设计实际上借鉴了JavaScript的动态性。ES6类比基于原型的OO模式更简单。拥有一个方便的声明性表单可以使类模式更易于使用,并鼓励互操作性。类支持基于原型的继承、超级调用、实例和静态方法以及构造函数。getter 与 setter 必须同级出现。通过 extends 实现类的继承。原创 2023-02-04 15:01:46 · 557 阅读 · 0 评论 -
es6箭头函数
对于普通函数来说,内部的this指向函数运行时所在的对象,但是这一点对箭头函数不成立。也就是说,箭头函数内部的this指向是固定的,相比之下,普通函数的this指向是可变的。另外,如果函数体很复杂,有许多行,或者函数内部有大量的读写操作,不单纯是为了计算值,这时也不应该使用箭头函数,而是要使用普通函数,这样可以提高代码可读性。如果箭头函数的代码块部分多于一条语句,就要使用大括号将它们括起来,并且使用return语句返回。不可以当作构造函数,也就是说,不可以对箭头函数使用new命令,否则会抛出一个错误。原创 2023-02-04 14:31:02 · 607 阅读 · 0 评论 -
es6——let和const
ES6 新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。用相同名称声明变量将引发,意在修复重新分配变量并丢失传递到其他地方的引用的错误。在大多数情况下不会破坏用户代码,通常情况下也不会破坏您想要的代码。是已吊装到区块顶部,而var声明被提升到函数顶部(变量提升)一旦声明,常量的值就不能改变。let不允许在相同作用域内,重复声明同一个变量。也是块范围的、提升的,并受TDZ语义的约束。是块范围的,而不是词汇范围的功能。变量必须使用初始值设定项声明,原创 2023-02-03 16:07:49 · 582 阅读 · 0 评论 -
ECMAScript6介绍
ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在 2015 年 6 月正式发布了。它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。另外,一些情况下ES6也泛指ES2015及之后的新增特性,虽然之后的版本应当称为ES7、ES8等。原创 2023-02-03 15:50:44 · 182 阅读 · 0 评论 -
dom截图——探究长截图的极限
问题:使用dom-to-image和html2canvas来进行长截图会出现一个问题,如果图片非常长,一些图片会只加载一半,如果图片再长一些,截图就会为空。核心思想:把如下图所示拆分的dom分别使用dom-to-image截图,再通过canvas合并图片,最后下载。方法一:按理说应该能无限长的,但是浏览器扛不住,我的测试结果是截图大小在18mb左右,再大一些就不输出了。图片缺失这个情况还可以优化,可以想办法把dom进行拆分,再分别截图,最后拼接图片。目前我测试的结果:截图的大小在8mb出现图片缺了的情况。原创 2023-01-03 16:54:41 · 1557 阅读 · 3 评论 -
dom截图的几种实现方式
前端要实现dom截图的功能,现在比较常用的是使用以下两个库,如果想自己写一个dom截图的可以参考下面几个库。原创 2023-01-03 15:54:56 · 2074 阅读 · 0 评论 -
层级数据存储
文章目录数据表设计算法设计完整代码要存储的数据如下图所示要求:把下面的数据存储到 mysql 数据库中,并能把数据库中读取数据转换成原来的数据data: [{ label: '一级 1', children: [{ label: '二级 1-1', children: [{ label: '三级 1-1-1' }] }]}, { label: '一级 2', children: [{原创 2021-09-07 16:57:05 · 480 阅读 · 0 评论