JS
关注
分享
扫一扫
JavaScript、ES5/6/7...、TypeScript等等
huoren_no1
前端,从入门到???
展开
-
【转】JavaScript开发者应懂的33个概念
JavaScript开发者应懂的33个概念 简介这个项目是为了帮助开发者掌握 JavaScript 概念而创立的。它不是必备，但在未来学习（JavaScript）中，可以作为一篇指南。本篇文章是参照 @leonardomso 创立，英文版项目地址在这里。由于原版资源都要翻墙，所以本人创立一个中文版，附上关于这些概念在国内的一些文章和视频。若有觉得更好的文章或者视频，可以贡献出来，觉得有误的，请联系我删除。更新若有觉得更好的文章或者视频，可以贡献出来，觉得...转载 2020-09-16 20:19:34 · 1746 阅读 · 0 评论 -
一步一步来理解“软绑定”
1. WHAT-概念所谓软绑定，是和硬绑定相对应的一个词绑定规则有默认绑定、隐式绑定、显式绑定、new绑定等硬绑定是显式绑定中的一种，通常情况下是通过调用函数的apply()、call()或者ES5里提供的bind()方法来实现硬绑定的硬绑定之后无法再使用隐式绑定或者显式绑定来修改this的指向（使用new绑定改变硬绑定除外）软绑定让 this在默认情况下不再指向全局对象（非严格模式）或undefined（严格模式），而是指向两者之外的一个对象（这点和硬绑定的效果相同），但是同时又保留了隐式绑定原创 2020-09-06 15:34:05 · 722 阅读 · 0 评论 -
区分 window.URL.createObjectURL() 和 FileReader.readAsDataURL()
URL.createObjectURL()语法objectURL = URL.createObjectURL(object);参数用于创建 URL 的 File 对象、Blob 对象或者 MediaSource 对象返回值一个DOMString包含了一个对象URL，该URL可用于指定源 object 的内容作用该方法生成一个 URL 对象可以直接赋值给 DOM 元素的 src 属性该方法生成一个 URL 对象还可以作为 a 标签的 href 属性值，用于下载或原创 2020-09-01 13:05:59 · 1654 阅读 · 4 评论 -
防抖与节流的实现
概念防抖：在一定时间内持续触发事件，只执行一次节流：持续触发事件，每间隔一定时间执行一次作用一些高频事件（如：滚动页面、缩放窗口、鼠标移动等）的触发会带来性能问题，防抖或节流就是为了解决这种问题代码实现<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>防抖与节流</title> <style>原创 2020-08-29 14:55:11 · 428 阅读 · 0 评论 -
死磕 - JavaScript正则表达式
文章目录1. 字符匹配1.1 两种模糊匹配1.2 字符组1.3 量词1.4 多选分支1.5 案例2. 位置匹配2.0 修饰符2.1 如何匹配位置2.2 理解位置2.3 案例3. 括号的作用3.1 分组与分支结构3.2 分组引用3.3 反向引用3.4 非捕获括号3.5 案例参考资料感谢《JavaScript 正则表达式迷你书》作者1. 字符匹配1.1 两种模糊匹配横向：字符串的长度不是固定的示例：/ ab{2,5}c/纵向：字符串的内容不是确定的示例：/a[123]b/原创 2020-08-20 22:14:56 · 877 阅读 · 0 评论 -
一次弄清楚 JavaScript 对象的属性遍历问题
ES6 共有五种方法遍历对象的属性for...in循环遍历对象自身的和继承的可枚举属性（不含 Symbol 属性）Object.keys(obj)返回一个数组，包括对象自身的（不含继承的）所有可枚举属性（不含 Symbol 属性）的键名Object.getOwnPropertyNames(obj)返回一个数组，包含对象自身的所有属性（不含 Symbol 属性，但是包括不可枚举属性）的键名Object.getOwnPropertySymbols(obj)返回一个数组，包含对象自原创 2020-08-14 15:07:26 · 146 阅读 · 0 评论 -
浅拷贝 vs 深拷贝
// node xxx.js// babel-node xxx.js (ES6)// 浅拷贝（shallow copy）：只复制指向某个对象的指针，而不复制对象本身，新旧对象共享一块内存；// 深拷贝（deep copy）：复制并创建一个一摸一样的对象，不共享内存，修改新对象，旧对象保持不变// 数组浅拷贝：arr.slice(0)、arr.concat()// 数组深拷贝：[...arr2] = arr1;// 对象拷贝// Object.create() 、Object.assig原创 2020-07-05 19:14:49 · 217 阅读 · 0 评论 -
发现不一样的控制台 - Console
以前，只知道使用 console.log( ) 在控制台输出信息。直到有一天，我发现 console 可不只有 log 方法console 有 table 方法可以表格形式在控制台打印 Object 或 Array 类型的数据console 还有计时器可用来测试程序性能此外，log 方法也可以指定返回数据类型，规则基本与 python 的 printf 一致你甚至可以自定义打印样式废话不多说，直接上代码：console.log('%f', 123); // 浮点型 => 123原创 2020-07-04 10:52:35 · 263 阅读 · 0 评论 -
别再死记硬背 this 的指向了
文章目录前言何为 thisthis 指向改变this指向参考资料前言this 指向问题一直是 JavaScript 中的重点与难点，也是面试与笔试的高频考点。今天就来彻底弄清楚这个问题。何为 thisthis 是 JavaScript 中的关键字，在严格模式和非严格模式之间也会有一些差别。全局环境 无论是否在严格模式下，在全局执行环境中（在任何函数体外部）， this 都指向全局对象 浏览器环境下， this 指向 window函数（运行内）环境 在函数内部，thi原创 2020-07-03 20:23:05 · 216 阅读 · 0 评论 -
我所知道的前端性能优化知识
前端性能优化总结1. 基础知识1.1浏览器输入url到显示页面，发生了什么？1.2 优化思路2. 网络层面优化2.1 HTTP请求优化2.2 Web缓存（HTTP缓存）2.3 Web 缓存（浏览器缓存）3. CDN3.1 概念3.2 CDN 与前端性能优化4. 渲染层面优化4.1 浏览器渲染4.2 DOM 优化【参考资料】1. 基础知识1.1浏览器输入url到显示页面，发生了什么？整个过...原创 2020-04-03 15:48:50 · 845 阅读 · 0 评论 -
【前端】Event 事件那些事儿
前端 - Event 那些事儿一、事件1. 介绍2. DOM 0级事件与DOM 2级事件二、DOM 事件流1.DOM事件流三个阶段2. DOM事件流3.addEventListener三、事件对象1. 常见属性2. 获取对象四、事件委托（代理）1. 示例2. 效果图3.总结 (优点)【参考资料】一、事件1. 介绍事件是用来实现js和html之间交互的事件通常与函数配合使用，这样就可以通过...原创 2020-03-31 16:03:13 · 1500 阅读 · 0 评论 -
JavaScript高级程序之13——事件
第13章 事件1. 事件流事件流：描述页面接受事件的顺序事件冒泡流事件由目标元素接受，向上传播至document（部分浏览器会到window）事件捕获流事件由document对象（规范要求，但浏览器还是从window对象开始捕获）接收，向下传播搭配目标DOM事件流的三个阶段捕获阶段不接受事件（规范要求）实际上主流浏览器都会在捕获阶段触发事件对象上的事件2. 事件处理程序（事件侦听器）概念响应事件的函数就是事件处理程序事件处理程序名字以on开头为事件指原创 2020-07-05 11:25:34 · 1109 阅读 · 0 评论