ES6
文章平均质量分 52
这里是 ECMAScript 6.0 的专栏,都是作者实战工作经验总结,图文并茂,力求通俗易懂,希望对你有所帮助! 原价99.9,限19.9🔥火爆订阅中(七日后恢复为49.9)
huangfuyk
自己应为之事,勿求他人;今日应为之事,勿待明日。
展开
-
Ant Design of Vue月度选择框(MonthPicker)、前端获取到当前时间,把1-9月份拼“0”后赋值给月度选择框(扩展运算符、padStart)
做项目过程中遇到这样的问题:获取当前默认时间时,月份为一位数(如 2021-6),但是后端需要的是这样的(如 2021-06)。① 页面样式如下:② 传参如下:③ 此时就需要把获取道到的认时间进行操作,然后赋值给Ant Design of Vue的月度选择框代码如下:let defaultYear = `${new Date().getFullYear()}-${((new Date().getMonth() + 1).toString()).padStart(2, '0')}`④ 效果原创 2021-06-16 12:23:45 · 2093 阅读 · 0 评论 -
JS padStart()方法和padEnd()方法(ES6新增方法)
在日常开发中,有时候会遇到字符串填充的问题,常见的如:时间不足两位数补“0”等。padStart() 用于补全头部padEnd() 用于补全尾部str.padStart(targetLength,string):padStart() 方法用另一个字符串填充当前字符串(如果需要的话,会重复多次),以便产生的字符串达到给定的长度。从当前字符串的左侧开始填充。两个参数:targetLength:当前字符串需要填充到的目标长度。如果这个数值小于当前字符串的长度,则返回当前字符串本身。padSt.原创 2021-06-07 18:02:31 · 4388 阅读 · 0 评论 -
实用的JS小技巧,无比丝滑(简化 if true...else、向下取整、Object.entries()、解构赋值、switch 简化、给多个变量赋值、模板字面量、箭头函数等)
以下方法,可以助我们的代码更加的优雅。目录带有多个条件的 if 语句返回当前的时间(年月日时分秒)简化 if true...else向下取整判断奇偶数 & 1获得滚动条的滚动距离单声明声明变量判断元素有没有子元素null、undefined 和空值检查给多个变量赋值if 判断值是否存在用于多个条件判断的 && 操作符for 循环比较后返回箭头函数简短的函数调用switch 简化隐式返回模板字面量将字符串转成数字解构赋值Object.entries()Object.values(.原创 2021-06-06 08:34:32 · 670 阅读 · 1 评论 -
Vue超出文本框显示省略号,鼠标滑过显示全部;Vue动态绑定title属性;使用ES6新增模板字符串进行拼接(反引号)
1. title定义和基础用法:title 属性规定关于元素的额外信息。这些信息通常会在鼠标移到元素上时显示一段工具提示文本(tooltip text)。提示:title 属性常与 form 以及 a 元素一同使用,以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性众所周知,基础用法如下:例:<html> <body> <p title="鼠标滑过 我就显示啦">Hello Word</p>原创 2021-04-30 13:10:46 · 1329 阅读 · 2 评论 -
ES6数组方法find()、findIndex()的总结
本文主要讲解ES6数组方法find()与findIndex(),关于JS的更多数组方法,可参考以下:①JavaScript 内置对象之-Array②ES5新增数组方法(例:map()、indexOf()、filter()等)③ES6新增字符串扩张方法includes()、startsWith()、endsWith()1. find()该方法主要应用于查找第一个符合条件的数组元素,即...原创 2020-04-22 13:21:19 · 25279 阅读 · 58 评论 -
常用的JS数组去重方法大全
写在前面:我们要想使用数组去重,那就必须对数组有一定的了解,关于JS数组的一些方法以及使用,可参考:①JavaScript 内置对象之-Array②ES5新增数组方法③浅谈JavaScript中ES6新增的Set和Map结构以及Array.from方法下面进入正题:利用JS的数组实现去重的目的 &n...原创 2020-04-04 13:43:45 · 9656 阅读 · 59 评论 -
面试官竟然问我JavaScript中var、let和const有什么区别这样简单的问题?
这几天逛CSDN论坛,发现在一些前端模块发的问题大都是因为var、let和const搞不清楚导致的,今天我来浅析下,希望对看到这篇博客的童鞋有所帮助~What we know is that…(英语作文万能开头) :在JavaScript中有三种声明变量的方式:var、let、const。目录1.var2. let3. const1.var(1)var定义的变量在之后可以修改,如果不初始...原创 2020-03-23 20:57:01 · 11277 阅读 · 43 评论 -
浅谈JavaScript中ES6新增的Set和Map结构以及Array.from方法
1、SetES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。Set 本身是一个构造函数,用来生成 Set 数据结构。只能接受数组,采用new的方式来实例化使用。创建Set机构时,可以立即设置内容,但Set必须接受数组作为参数。常用的属性和方法有:size 属性: 获取该数据结构中,数据的数据个数add() 方法: 向该数据结构中,追加新增...原创 2020-03-18 13:15:07 · 5211 阅读 · 25 评论 -
ajax封装函数(引入了ES6中的Promise)
function ajax(ops){ ops.type = ops.type || "get"; ops.data = ops.data || {}; var str = ""; for(var key in ops.data){ str += `${key}=${ops.data[key]}&`; } if(ops.typ...原创 2020-03-13 14:16:06 · 3694 阅读 · 3 评论 -
ES6之Promise解决回调地狱
目录回调函数:回调地狱:Promise介绍:Promise解决回调地狱:回调函数: 在一个函数里面以形参的方式调用一个传递进来的函数。例如:function a(callback){ callback();}a(function(){})回调地狱: &nbs...原创 2020-03-13 13:55:30 · 6640 阅读 · 5 评论 -
JavaScript中类的继承(ES6、class、extends、super)
Class 可以通过extends关键字实现继承 这比 ES5 的通过修改原型链实现继承,要清晰和方便很多。如下:class Test{}class ColorTest extends Test{} 上面代码定义了一个Col...原创 2020-03-07 18:16:47 · 6010 阅读 · 2 评论 -
JS中Generators生成器与yield 表达式
1.Generators生成器函数 Generator 函数是 ES6 提供的一种异步编程解决方案,语法行为与传统函数完全不同。 Generator 函数有多种理解角度。语法上,首先可以把它理解成,Generator 函数是一个状态机,封装了多...原创 2020-03-07 18:04:06 · 4891 阅读 · 2 评论 -
一个小例子理解ES6的bind()方法
bind方法用于将函数体内的this绑定到某个对象,然后返回一个新函数。var obj ={ name:'wangcai', age:18, fn:function(){ console.log(this); }}var person = {name:'张三'}var res = obj.fn.bind(person);res();上面...原创 2020-03-05 19:18:45 · 4676 阅读 · 0 评论 -
JS基础之解决Math方法不能传入非数值问题
我们知道,在ES6之前,例如:Math.min、Math.max等这些方法不能传入非数字。如果有任一参数不能被转换为数值,则会返回NaN。 如下代码,在Math.max方法中传入一个数组:var arr = [1,2,3];va...原创 2020-03-05 12:13:28 · 3485 阅读 · 0 评论 -
对ES6中class、constructor、static的介绍
在ES6中,提供了更接近传统语言的写法,class(类)作为对象的模板被引入,可以通过 class 关键字定义类。class 的本质是 function。它可以看作一个语法糖,让对象原型的写法更加清晰、更像面向对象编程的语法。 1、在JS 语言中,是通过传统构造函数方法生成实例对象的,比如下面这这样...原创 2020-03-03 18:22:22 · 5877 阅读 · 0 评论 -
浅谈ES6变量解构,即解构赋值
解构赋值语法是一种 JS表达式。ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构。通过解构赋值, 可以将属性/值从对象/数组中取出,赋值给其他变量。 在ES6解构赋值出现之前,我们需要为变量赋值的时候,只能直接指定值。 &n...原创 2020-03-03 14:00:13 · 3537 阅读 · 0 评论 -
ES6新增字符串扩张方法includes()、startsWith()、endsWith()
当有人问到用来确定一个字符串是否包含在另一个字符串中有哪些方法时,我们会不假思索回答道:indexOf方法。其实,ES6 又提供了三种新方法includes()、startsWith()、endsWith(),也是比较好用的。 in...原创 2020-03-02 13:53:13 · 3821 阅读 · 1 评论 -
ES6模板字符串,即反引号(`)之详解
模板字符串(template string)也就是模板字面量,是增强版的字符串,用反引号(`)来表示。它既可以当作普通字符串来使用,也可以在字符串中嵌套变量。注意:在模板字符串中嵌入变量的时候,需要将变量名写在${}中。 传统...原创 2020-03-02 13:21:39 · 8680 阅读 · 0 评论 -
ES6的let、const命令
1、let命令: ES6 新增了let命令,用来声明变量。它的用法类似于var,但是 let 所声明的变量,只在let命令所在的代码块内有效。 代码如下:{ let a = 1; var b = 2; }consol...原创 2020-02-29 16:30:58 · 3441 阅读 · 0 评论 -
ES6箭头函数
ES6 允许使用“箭头”(=>)定义函数。 如下所示:var s= fn =>fn;// 等同于 ↓var s = function (fn) { return fn;}; 当箭头函数不需要参数或需要多个参数时,可以使用一个圆括号代表参数...原创 2020-02-28 20:16:38 · 4695 阅读 · 1 评论 -
ES6新增数据类型 Symbol
Symbol是ES6新增的一种数据类型,根据单词的语义化我们就可以得知此单词表示独特的,独一无二的。它是继undefined、null、布尔值(Boolean)、字符串(String)、数值(Number)、对象(Object)之后的第七种属于js语言的数据类型。 &...原创 2020-02-28 14:28:11 · 3730 阅读 · 12 评论