
javascript
文章平均质量分 86
「零一」
公众号:「前端印象」,前端从0到1,因为热爱,没有意外
我是「零一」,非科班、三非学校,自学前端一年进入字节跳动担任前端开发。热爱写博客、记录成长过程中的点点滴滴,请大家见证我从0到1的过程吧
展开
-
JavaScript即将推出新的两个原始数据类型
JavaScript即将推出两个新的数据类型:Record 和 Tuple ,这俩是啥呢?其实就是一个只读的 Object 和 Array,其实在其它语言中已经有类似的数据类型了,例如 Python 中也有 Tuple(元祖)这一类型,作用也是一个只读的数组(在Python里叫只读的列表),一起来了解一下基础写法// Recordsconst myRecord = #{ name: '01', age: 23}// Tupleconst myTuple = #['1',原创 2022-05-09 11:52:31 · 1593 阅读 · 0 评论 -
28个在线游戏编程学习网站
大家好,我是零一,经常有读者问我:自学怎么学,要学的知识那么多,根本记不住怎么办?我一般刚开始回答的时候都是说要多做笔记总结,更重要的就是要上手敲代码实践,如果抛开任何场景在那学习知识,不光记不住,说不定对知识应用的掌握程度也不够另外,学习也是需要靠兴趣的,希望你们在上手实践敲代码的过程中能感受到乐趣所以,今天我给大家推荐28个辅助你学习巩固知识的网站,让你边玩边学边记!本文大致的目录结构如下:CSS相关的学习网站1 xxxx2 xxxxn xxxxJavaScript相关的学习原创 2021-09-15 08:45:47 · 4066 阅读 · 1 评论 -
终于有人对 jQuery下手了,一键移除项目对它的依赖
大家好,我是零一。虽然现在很多前端项目都在用Vue、React,但依赖jquery的项目也不少,尤其是年代比较久远的项目,那些还正在维护jquery项目的你,是否想将jquery从你的项目中移除?毕竟这个库那么大,你能用到的代码也就只有15%~30%,而且jquery对各个浏览器的兼容性也做了很大的处理(代码量up up),但其实很多老项目也不会去考虑兼容很边缘的浏览器了,所以其实jquery中兼容处理的代码也没太大必要最近新发现了一个有意思的工具,仅上线2周,就有600+的Star,它说能帮助你的项目脱原创 2021-09-16 10:16:25 · 2226 阅读 · 1 评论 -
到底什么是Event Loop?那就来了解一下JavaScript分别在浏览器和Node环境下的运行机制吧
浏览器中的各种Web API为异步的代码提供了一个单独的运行空间,当异步的代码运行完毕以后,会将代码中的回调送入到Task Queue(任务队列)中去,等到调用栈空时,再将队列中的回调函数压入调用栈中执行,等到栈空以及任务队列也为空时,调用栈仍然会不断检测任务队列中是否有代码需要执行,这一过程就是完整的Event Loop 了原创 2020-10-24 09:21:29 · 19179 阅读 · 106 评论 -
异步编程Ajax的详解,并对其进行封装整理
对于Ajax,肯定很多小伙伴都听过甚至用过了,那么没听过的也不用着急,本文会对Ajax进行讲解,其次,一定还有一些人只用过JQuery封装好了的Ajax却对原生的Ajax并不了解,那么也不用着急,本文从最基本的Ajax开始讲起,然后最后会尽可能得模仿JQuery对其进行封装,让我刚才提到的两类人能对Ajax有进一步的了解。公众号:Lpyexplore的编程小屋关注我,不定时更新前端面试题关注还有更多电子书、前端面试题、数据结构与算法代码等你来拿异步编程——Ajax一、什么是Ajax二、Ajax的原创 2020-10-12 09:03:37 · 20547 阅读 · 53 评论 -
ES6新特性实现面向对象编程,上万字详解用class语法定义类
ES6中出现 class 语法,只是创建构造函数的一种语法糖,那为何要新增一种语法去实现同一个功能呢?其实目的还是为了跟上一些主流编程语言的脚步,例如 java 、C++ 、Python,他们内部都是用 class 语法来实现的面向对象编程,所以咱们的 JavaScript 也不能落后,不然很多学习过 java c++ python 的小伙伴跑来学习 js时,就很难理解构造函数这一概念了。原创 2020-08-13 13:29:08 · 14348 阅读 · 53 评论 -
最全的JavaScript常见的操作数组的函数方法宝典,不收藏绝对后悔
JavaScript在其内部封装了一个Array对象,使得我们可以方便地使用数组这种简单的数据结构,同时,也在 Array对象的原型上定义了一些常用并且很有用的操作数组的函数。本文就将详细介绍一下每个操作数组的函数是如何使用的先点赞,再看博客,顺手可以点个关注。微信公众号搜索【Lpyexplore的编程小屋】,关注我,带你在python爬虫的过程中学习前端回复 “领取前端电子书”,领取前端相关的电子版书籍回复 “前端常考面试题”,领取前端面试题以及相应答案JavaScritp常见的操作数组的原创 2020-07-19 09:37:52 · 14155 阅读 · 82 评论 -
匿名函数闭包模仿块级作用域,轻松解决开发中的两大难题
大家都知道在ES6之前,JavaScript是没有块级作用域的,但其实我们是可以通过匿名函数的闭包来模仿实现一个块级作用域。先点赞,再看博客,顺手可以点个关注。微信公众号搜索【Lpyexplore的编程小屋】,关注我,带你在python爬虫的过程中学习前端回复 “领取前端电子书”,领取前端相关的电子版书籍回复 “前端常考面试题”,领取前端面试题以及相应答案匿名函数闭包模仿块级作用域一、引言二、什么是块级作用域三、如何模仿块级作用域一、引言首先,还没有了解过作用域链和闭包的小伙伴可以点击下面原创 2020-07-09 16:13:18 · 14182 阅读 · 84 评论 -
解析面试常问题之JavaScript中的闭包概念及应用,顺便普及一下大家口中常说的内存泄漏问题
JavaScript中的闭包是一个面试中经常被考到的问题,大家可能都对这个概念多多少少都有一些模糊的概念或者一点都不了解,那么今天就来给大家讲解一下。先点赞,再看博客,顺手可以点个关注。微信公众号搜索【Lpyexplore的编程小屋】,关注我,带你在python爬虫的过程中学习前端公众号回复 “领取前端电子书”,领取前端相关的电子版书籍JavaScript之闭包一、引言二、闭包的定义三、体验闭包一、引言首先在这里我得说一下,要了解闭包一定要有作用域链的相关概念,这里我放上一篇文章,希望大家花原创 2020-07-04 21:51:22 · 19302 阅读 · 93 评论 -
JavaScript的垃圾回收机制,清除无用变量,释放多余内存,展现更好的性能
JavaScript中的垃圾回收机制和闭包的实现机制引言正文一、垃圾回收机制(1)标记清除(2)引用计数引言本篇文章将从javascript的垃圾回收机制讲起,然后再来介绍函数闭包的实现机制。同时,我们必须先具备作用域链的概念,不懂的小伙伴可以先花5分钟观看一下这篇文章,简单了解一下作用域链的知识——从零开始讲解JavaScript中作用域链的概念及用途正文一、垃圾回收机制在JavaScript中,具有自动垃圾回收机制,也就是说执行环境会自动负责管理代码执行过程中的内存使用情况,会自动清除一些没有原创 2020-06-23 08:59:40 · 14113 阅读 · 66 评论 -
从零开始讲解JavaScript中作用域链的概念及用途
从零开始讲解JavaScript中作用域链的概念及用途引言正文一、执行环境二、作用域链引言之前我写过一篇关于JavaScript中的对象的一篇文章,里面也提到了作用域链的概念,相信大家对这个概念还是没有很深的理解,并且这个概念也是面试中经常问到的,因为这个概念实在太重要了,在我们平时写代码时,也可能会因为作用域链的问题,而出现莫名其妙的bug,导致我们花费大量的时间都查找不出原因。所以我就准备单独写一篇关于作用域链的文章,来帮大家更好地理解这个概念。正文一、执行环境首先,我们要引入一个概念,叫做执原创 2020-06-18 21:17:11 · 14175 阅读 · 69 评论 -
千万别再一直无脑使用ES6的箭头函数了,它虽然很有用但并不是万能的
ES6函数扩展之箭头函数的详细介绍引言正文一、箭头函数的基本使用二、箭头函数的作用引言相信很多小伙伴自从知道了ES6的箭头函数以后,都疯狂得使用,渐渐的淡忘了普通函数的使用。不过确实,箭头函数看起来比较简洁,用起来也舒服,不过它的出现是为了解决某一部分问题的,并不是用来替代普通函数的,所以我们不能在每一个地方都使用箭头函数。正文一、箭头函数的基本使用我们先来看看箭头函数是如何使用的吧let fn1 = function () { console.log('我是普通函数')}let fn2原创 2020-06-13 21:26:06 · 5950 阅读 · 60 评论 -
浏览器中的JavaScript核心BOM(浏览器对象模型)对象Navigator和Screen的简单了解
浏览器中内置对象Navigator和对象Screen的简单了解引言正文一、Navigator对象二、Screen对象结束语引言想必大家很奇怪,为什么本文是简单了解。其实BOM虽然提供了很多对象供我们去使用,但是有些对象其实是不那么重要的,例如本文要将的两个对象——Navigator和Screen。所以大家只需要看一看,了解一下有这样的属性和用法就可以啦正文一、Navigator对象Navigator对象主要是用来帮助我们获取浏览器的一些信息的,例如浏览器的名称 、浏览器编译版本 、浏览器的语言 、原创 2020-06-08 07:13:54 · 2577 阅读 · 1 评论 -
浏览器中的JavaScript核心BOM(浏览器对象模型)重点掌握对象之History对象的属性与方法
浏览器中内置对象History属性与方法详解引言正文一、History对象引言在学过JavaScript之后,我们都知道对象分为内置对象 、宿主对象 、自定义对象,我们经常用到的浏览器中的内置对象就是宿主对象的一种,浏览器的内置对象有很多,本文就来详细讲解一下History对象的属性与方法吧。正文因为把浏览器的所有内置对象逐个详细讲解,文章篇幅会很长,所以我把每个对象的讲解都放在不同的文章中,大家如果还想了解其他的浏览器内置对象,可以划到文章最后一部分,那里有跳转链接。一、History对象Hi原创 2020-06-07 16:13:26 · 2641 阅读 · 3 评论 -
浏览器中的JavaScript核心BOM(浏览器对象模型)重点掌握对象之Location对象的属性与方法
Windows对象在客户端中的属性详解引言引言我们知道javascript是运行在浏览器上的,并且浏览器提供了原创 2020-06-07 14:46:31 · 2217 阅读 · 2 评论 -
浏览器中的JavaScript核心BOM(浏览器对象模型)重点掌握对象之Window对象的属性与方法
浏览器中常用内置对象之Window引言正文一、Window对象的方法(1)计时器(2)打开窗口和关闭窗口二、Window对象的属性引言我们从这一篇开始逐个讲解浏览器上的内置对象的属性和方法。常见的浏览器内置对象有:Window 、Location 、Navigator 、History 、Screen……本篇文章,我们就从最大的对象Window开始讲起正文Window对象在客户端JavaScript中扮演着核心的角色,它是客户端的一个全局内置对象。我们可以使用 window 来引用这个对象,比如当原创 2020-06-06 20:55:22 · 3376 阅读 · 0 评论 -
JavaScript正则表达式的模式匹配教程,并且附带充足的实战代码
JavaScript正则表达式的模式匹配引言正文一、正则表达式定义引言其实我写这篇文章的话,主要是想自己重新复习一遍正则表达式。我们也知道正则表达式在很多语言中都是通用的,所以学好这个好处很多。接下来,就跟我一起来学习一下正则表达式,从0到入门吧。正文一、正则表达式定义正则表达式(regular expression)是一个描述字符模式的对象,简单点来讲就是通过正则表达式规定的模式,...原创 2020-06-05 20:14:40 · 3709 阅读 · 43 评论 -
充分了解JavaScript中的对象,顺便弄懂你一直不明白的原型和原型链
JavaScript——对象引言正文一、对象的定义二、引言相信很多小伙伴学习了javascript,但是对于对象只是有一个初步的认识,并且对于对象的原型和原型链之类的概念还没有很好的认识吧,本篇文章带你们一步步了解对象。正文相信很多小伙伴都是冲着原型和原型链的概念进来的,那么你们可以直接跳到………………一、对象的定义对象是JavaScript的基本数据类型,对象内部是由一个个的名/值对组成的,例如下面我们常见的。{ name: '张三', fn: function() { return 1原创 2020-06-02 17:06:27 · 4817 阅读 · 42 评论 -
细讲前端设置cookie, 储存用户登录信息
细讲前端设置cookie引言正文一、 设置cookie引言我们都知道如果想做一个用户登录并使浏览器保存其登录信息,使得用户下次再访问网页的时候无需再次进行登录操作,我们需要用到 cookies , 今天我们就来讲讲前端如何给客户端设置 cookie正文一、 设置cookie设置 cookie 其实很简单,只需要这样一行代码<script> document.cookie = 'name=张三'</script>我们来看看浏览器上 cookie 的信息, 可以原创 2020-05-27 10:29:22 · 10420 阅读 · 4 评论 -
前端性能优化之防抖与节流,大幅度降低你的事件处理性能
JavaScript代码优化——防抖和节流引言正文引言看到这个标题就懵了, 你会有以下几个问题: 什么是防抖? 什么是节流? 什么时候需要用到防抖和节流? 为什么要用防抖和节流? 那我们就围绕这几个问题来讲一讲防抖与节流的两个概念和简单应用吧~ 我会在正文中给大家逐个解答问题正文首先,在正文开始之前我们来看一个例子,来了解一下应用防抖和节流的初衷。先放代码<!DOCTYPE html><html lang="en"><head> <meta原创 2020-05-26 09:30:40 · 2795 阅读 · 1 评论 -
JavaScript 用七种方式教你判断一个变量是否为数组类型
JavaScript 如何判断一个变量是否为数组类型引言正文方法一方法二方法三结束语引言我们如何判断一个变量是否为数组类型呢? 今天来给大家介绍三种方式,别走开, 这肯定会被问到的~继续往下看吧正文方法一使用 instanceof 运算符, 该运算符左边是我们想要判断的变量, 右边则是我们想要判断的对象的类, 例如:let arr = [1, 2, 3]console.log(arr instanceof Array)// true 返回true,说明变量arr是数组类型方法原创 2020-05-25 20:26:13 · 14870 阅读 · 2 评论 -
面试题被问到再也不慌,深究JavaScript中的深拷贝与浅拷贝
浅显易懂的介绍Javascript中的深拷贝和浅拷贝引言正文一、简单介绍引言JavaScript中的深拷贝和浅拷贝是前端面试中频繁被问到的一道题, 于是我也自己去查阅了一些资料, 然后动手敲了代码测试了一下。那么我就用我的理解,给大家来讲解一下这个深拷贝和浅拷贝吧。正文一、简单介绍...原创 2020-05-22 16:55:50 · 4524 阅读 · 17 评论 -
深入了解Promise对象,写出优雅的回调代码,告别回调地狱
深入浅出了解Promise引言正文一、Promise简介二、Promise的三种状态三、基本用法引言我们都知道,一个好的代码是有很强的维护性、阅读性的, 但是在Jacascript中的回调函数的量一增多, 很容易影响代码的阅读性,导致代码难以维护, 这种现象就叫做回调地狱, 为了解决这现象, ES6将Promise写进了语言标准里, 专门用来解决这个回调地狱的现象, 那么就让我们来了解一下吧。正文一、Promise简介Promise 是异步编程的一种解决方案, 他能使得各种异步操作,都用同样的方式原创 2020-05-22 10:22:53 · 4131 阅读 · 1 评论 -
一个简单的例子让你很轻松地明白JavaScript中apply、call、bind三者的用法及区别
JavaScript中apply、call、bind三者的用法及区别引言正文一、apply、call、bind的共同用法二、 apply三、 call四、 bind五、其他应用场景六、总结结束语引言这是我的第一篇前端面试题文章,也是用来帮助自己巩固复习知识, 在之后希望拿到自己满意的offer,这第一篇讲的就是一道常见的面试题,关于JavaScript中apply、call、bind三者的用法及区别。正文如果有不想看过程的小伙伴可以直接跳到 总结一、apply、call、bind的共同用法先将一原创 2020-05-21 10:24:33 · 3602 阅读 · 1 评论 -
ES6中的变量的解构赋值, 解放我们的双手,实现变量的批量赋值
ES6(2)—— 变量的解构赋值引言正文数组的解构赋值解构失败有几种情况会解构失败引言变量的解构赋值, 听起来很复杂, 简单点说可以理解成批量操作变量赋值,先有个印象, 下面慢慢来看正文变量的解构赋值一共分为以下几种:数组的解构赋值 、对象的解构赋值 、字符串的解构赋值 、数组的解构赋值先来看一下我们平时对很多个变量赋值是如何操作的:let a = 1let b = 2let c = 3let d = 4那么我们看一下如何批量命名这些变量:let [a, b, c, d] = [1原创 2020-05-19 22:16:13 · 5205 阅读 · 2 评论 -
还没有理解let 和 const的用法和区别吗,几百字让你立马搞懂
ES6——变量原创 2020-05-19 21:21:39 · 5348 阅读 · 1 评论 -
javascript 数组的组合
javascript 数组的组合一、前言二、数组的组合concat()方法push(...items)其他方法三、结束语一、前言今天在开发项目过程中,遇到了一个需求,先请求了30个数据,放在一个列表中,并渲染展示出来,然后又请求了另外的30个数据,放在一个列表中,想在前一个数据的后面继续展示,即将第二次请求的来的数据列表跟第一次请求的数据列表做一个合并,需要用到数据的合并,接下来给大家介绍一...原创 2020-05-02 14:34:07 · 4321 阅读 · 0 评论