Weichanglu

你知道的越多,你不知道的越多

JavaScript 中检查对象中是否存在属性

在事情成功之前,一切总看似不可能。——<纳尔逊·曼德拉> 当您必须检查对象中是否存在某个属性时,您可能执行以下操作: 12345var myObject = { name: '@tips_js'};if (myObject.name) { ... } 对于这种情况,有两种本机方式,即inoperator和Object.hasOwnProp......

JavaScript 中将节点列表转换为数组

在事情成功之前,一切总看似不可能。——<纳尔逊·曼德拉> querySelectorAll 方法返回一个称为节点列表的类似数组的对象。这些数据结构被称为 “类数组”,因为它们看起来像一个数组,但不能与诸如 map 和的数组方法一起使用forEach。这是一种将节点列表转换为DOM元素数组的快速,安全且可重用的方法: 1234567const nodelistToArray = A......

JavaScript 中strict

预测未来最好的方法就是去创造未来。——<亚伯拉罕·林肯> 严格模式的 JavaScript 使开发人员更容易编写 “安全” JavaScript。 默认情况下,JavaScript允许程序员非常粗心,例如,当我们第一次引入变量时,不需要我们用“ var”声明变量。尽管这对于没有经验的开发人员来说似乎是一种便利,但是当变量名拼写错误或意外引用超出其范围时,它也是许多错误的根源。 程......

JavaScript 中数组和单个元素编写单个方法

万物皆有其美,但并非人人都能发现。——<安迪.沃霍尔> 与其编写单独的方法来处理数组和单个元素参数,不如编写函数使它们可以同时处理这两个参数。这类似于某些jQuery函数的工作方式(css将修改选择器匹配的所有内容)。 您只需要先将所有内容合并到一个数组中即可。Array.concat将接受数组或单个元素。 123456function printUpperCase(words)......

JavaScript 中undefined和null之间的区别.md

每天做一件自己害怕的事。——<埃莉诺·罗斯福> 1. null 值 null 特指对象的值未设置。它是 JavaScript 基本类型 之一,在布尔运算中被认为是false。 12345678910function getVowels(str) { const m = str.match(/[aeiou]/gi); if (m === null) { ......

JavaScript 中粗箭头功能

创新需要勇气。——<亨利·马蒂斯> 作为 ES6 中的新功能引入的粗箭头功能可以作为方便的工具来用更少的行编写更多的代码。该名称来自其语法,=>与细箭头相比,它是“胖箭头” ->。一些程序员可能已经从不同语言(例如Haskell),“lambda表达式” 或 “匿名函数” 中了解了这种类型的函数。之所以称为匿名,是因为这些箭头函数没有描述性的函数名称。 有什么好处......

JavaScript 中参数传递给回调函数

创造力是智力的乐趣。——<阿尔伯特·爱因斯坦> 默认情况下,您不能将参数传递给回调函数。例如: 12345function callback() { console.log('Hi human');}document.getElementById('someelem').addEventListener('click', callback); 您可以利用Ja......

JavaScript 中的短路评估

一个人的价值,应该看他贡献什么,而不应当看他取得什么。 ——<阿尔伯特·爱因斯坦> 短路评估表明,仅当第一个参数不足以确定表达式的值时,才执行或评估第二个参数:当 AND(&&) 函数的第一个参数评估为false时,总值必须为false;否则,该值必须为false。并且当OR(||)函数的第一个参数的计算结果为true时,总值必须为true。 对于以下test条件......

三个有用的JS技巧

​ 人只有献身于社会,才能找出那短暂而有风险的生命的意义。——<阿尔伯特·爱因斯坦> 原文链接 https://www.jstips.co/en/javascript/three-useful-hacks/ 1、从后到前获取数组项 如果要从后到前获取数组项,只需执行以下操作: 123456var newArray = [1, 2, 3, 4];​console.log(newAr......

使用 tap 快速 debug

一个人的价值,应该看他贡献什么,而不应当看他取得什么。 ——<阿尔伯特·爱因斯坦> 在这里 tap 是一个可以用来快速调试、链式调用、匿名函数,还可以打印任何你想打印的东西的函数。 1234function tap(x) { console.log(x); return x;} 为什么我们不用 console.log 这个老方式了?让我来示范一个......

window.location备忘录

在事情成功之前,一切总看似不可能。——<纳尔逊·曼德拉> 作者:Samantha Ming 译者:cl9000 来源:medium 原文:https://morioh.com/p/b444d291bdfb 如果你想获取站点的URL信息,那么window.location对象什么很适合你!使用其属性获取有关当前页面地址的信息,或使用其方法进行某些页面重定向或刷新。 http......

basicScroll – 独立视差滚动

使用 CSS 变量改变动画的移动端和桌面端的独立视差滚动。 basicscroll - https://basicscroll.electerious.com/ basicScroll - https://github.com/electerious/basicScroll basicScroll 可以根据 CSS 变量来改变滚动位置。你可以在 CSS 中使用变量来制作想要的动画效果。......

Pressure.js – 用于处理Force Touch,3D Touch的JS库

干就完了 – pressurejs - https://pressurejs.com/ pressurejs - https://github.com/stuyam/pressure Pressure.js 是一个用于处理 web 上的 Force Touch ,3D Touch 和指针压力的 JavaScript 库。 安装 可以从 GitHub 下载 pressure.min......

Plyr 是一个简单、轻量级、可定制的HTML5播放器

​ Plyr 是一个简单的可定制的 HTML5 媒体播放器,使用原生 JavaScript 没有其他依赖。支持 YouTube 和 Vimeo 。 特性 ​ 📼 HTML视频和音频,YouTube和Vimeo -支持主要格式 💪 可访问-充分支持VTT字幕和屏幕阅读器 🔧 Customizable -用你想要的标记让播放器看起来像你想要的样子 😎 干净的HTML -使用正确的元......

JavaScript中的Async/Await

达到完美境界并不是无以复加,而是无可去除。——<安托万·德·圣·埃克苏佩里> 作者:Ashish Lahoti 译者:cl9000 来源:https://codingnconcepts.com/javascript/async-await-in-javascript/ Async 函数和 Await 关键字是 ECMAScript 2017 发布的最新 JavaScript ......

JavaScript中的Promises

那些疯狂到认为自己能够改变世界的人,才能真正改变世界。——<史蒂夫·乔布斯> 作者:Ashish Lahoti 译者:cl9000 来源:https://codingnconcepts.com/javascript/promises-in-javascript/ Promises 是在 ES6 中原生引入的。它们与我们的 Promises 非常相似。当我们遵守或违背 Prom......

Bespoke.js–基于浏览器的演示文稿微框架

好好工作,搞好身体,互相帮助 Bespoke.js - http://markdalgleish.com/projects/bespoke.js/ Bespoke.js 非常小(压缩后只有1KB),它的核心库提供简单的 API 和 事件管理,其他功能都使用插件(它有自己的插件生态链)来实现。 官方提供的套件: Bespoke.js 生成器 - https://github.com/bes......

Driver.js–页面分步引导

好好工作,搞好身体,互相帮助 — 一个轻量级(约4kb gzip)但强大的JavaScript引擎,帮助您驱动用户的注意力在页面上。 一些示例用例可以创建强大的特性介绍、动作调用组件、焦点转移器等。 通过 Driver.js ,你可以突出显示页面上的项目,以吸引用户的注意力。你也可以在网站改版后,使用它来引导用户展示新功能。 特色功能: 突出显示页面上的任何任何项目 锁定用户交互 创建功......

你可能不知道你可以用Chrome的开发者控制台做的事情

做任何事情,先模仿,再创新,会更快成功 – 译者:cl9000 原文:https://medium.freecodecamp.org/10-tips-to-maximize-your-javascript-debugging-experience-b69a75859329 Chrome自带内置的开发工具。它具有各种各样的特性,比如元素、网络和安全性。今天,我们将100%关注它的JavaS......

JavaScript中的call,bind和apply方法

人只有献身于社会,才能找出那短暂而有风险的生命的意义。 ——<阿尔伯特·爱因斯坦> 作者:Ashish Lahoti 译者:cl9000 来源:https://codingnconcepts.com/javascript/call-vs-bind-vs-apply/ 这是JavaScript面试中经常被问到的问题。这篇文章描述了函数原型方法call()、apply()和bin......