JavaScript 技巧大全

前言 这篇文章不会分享很高深的问题,只是把平时在前端开发中很常用到的东西整理出来,让经历过的东西有个家。 类型判断 console.log(Object.prototype.toString.call([1,2])); // [object Array] console.log(Object.prototype.toString.call({})); // [object Object] console.log(Object.prototype.toString.call("Hellow")); // [object String] console.log(Object.prototype...

2018
07-02

判断对象是否含有某个属性

前言 这其实没什么好说的,本文章只作记录。各位看官可以作选择性阅读。 hasOwnProperty() 方法 const obj = { name:"前端技术", age:"3年2月20日" } console.log(obj.hasOwnProperty("name")); // true 不管对象的属性是否可枚举,hasOwnProperty() 方法都能检测到。 注意: 如果我们使用的话,有一种情况是不可用的,就是当我们像下面通过 Object.create(null,{……}) 这...

2018
06-06

JavaScript 中的可枚举属性与继承的可枚举属性解密

前言 这篇文章主要是分享一下什么是可枚举属性和继承属性,可枚举属性和继承属性这两个词估计你已经在网上看到无数次了,但网上对于这两个东西的解释很多都不是很详细,一笔带过的居多,特别是继承属性的介绍。基本都是只见【继承属性】这四个字眼,却极少看到有关这个名词的相关介绍,所以才有了这篇文章。 可枚举属性 什么才算是可枚举属性?我们不妨回想一下,在平时的开发中我们是如何定义一个对象...

2018
06-05

原生 JavaScript 做一个接地气的富文本编辑器

前言 这里不分享富文本编辑器都有哪些,哪些富文本编辑好用,而是简单地分享一下如何做一个比较接地气的而已很简单但很实用的富文本编辑器。当然这里也不是把这个富文本编辑器做很多强大,因为也没必要,并且也不是一天两天可以做得完的,为此是这里只是想通过一个简单的例子来说明如何做一个更加贴心的富文本编辑器。 在开始之前我们先来看一看效果图: 富文本编辑器之旅 这里我先把代码贴出来,是好...

2018
05-30

字符串和数组方法整理

前言 字符串和数组两个所涉及的方法也不是很多,但不知道为什么,需要用某些方法的时候脑子里竟然不知道对应的方法叫什么,或者知道这个方法怎么写,但里面的参数,以及返回值,还是是很清楚。所在对于我自己来说,有必要整理出来。 字符串方法 startsWith() endsWith() includes() 这三个方法用法简单: const str = "hello yunkus.com!" const res = str.startsWith("hello"); // true con...

2018
05-25

JavaScript 中的 Math.max() 和 Math.min()

前言 在 JS 中,求最大值或者最小值在平时的前端开发中极其地常见,所以这个技能我们不能没有,除了在平时撸码中很常用,在面试中也是时有出现。那么下面我们就来看看怎么求,本文主要是分享 JavaScript 中原生的方法 Math.max() 和 Math.min() ,除此之面的其它方法在这里就不说了,比如:第三方框架提示的方法,毕竟原生有的方法,我们为什么不用? 首先我们先来看看 Math.max() 和 Math.min() 的定义...

2018
03-11

ES6 中的 super 关键字

前言 关于 ES6 中的 super 关键字估计大家跟我一样还见得比较少,不过没关键,在文我们就来初探下 super 关键字。 super 关键字 在讲 super 关键字之前,我们先来看一段超简单的代码: class parent{ constructor(){} } class children extends parent{ constructor(){} } 其实在上面什么都没有做的类中的 constructor 构造方法我们也可以不写,因为类中如果没有显式地定义构造函数的话...

2018
02-01

JavaScript 中的定时器执行机制大解密

前言 JavaScript 中的定时器你一定用了不少,比如 setTimeout、setInterval 等。但我们对他的了解又有多少呢?我承认我以前一直用它只是因为他能为我延迟几秒执行某些操作,它确确实实为我解决了不少问题,还有一些比较“奇葩”(由于技术水平有限,未能找出原来)的问题也是通过定时器来解决的。但我慢慢地发现,我对定时器的了解也只是表面上的,而它的运行机制我却不闻不问,也就是我只看到了它成功的一...

2018
01-28

前端开发中的各种宽高获取整理

获取可视区的宽高 document.documentElement.clientWidth document.documentElement.clientHeight 获致滚动条滚动距离 // 主流浏览器中,用下面的代码获取值 document.documentElement.scrollTop document.documentElement.scrollLeft // 搜狗浏览器、360 浏览器、IE 浏览器中,用下面的代码获取值 document.body.scrollTop document.body.scrollLeft // 兼容写法 document.documentElemen...

2017
12-28

JavaScript 获取 Select 下拉框的值

为什么这么简单的一个东西,我还得单独一篇文章记录下来?其实理由很简单,就是时刻提醒像我这种眼高手低的,基础知识不牢固的人,基础就是一切,基础可以创造一切。在做《Canvas 实现炫丽的粒子运动效果(粒子生成文字)》这个效果时,需要用到下拉框,来动态改变粒子运动效果。但尴尬的是,下拉框写好了却不知道怎么获取选中的值,于是网上找了下,并记录成文。 写好的HTML代码: HTML 代码 <!DOCTYP...

2017
11-12