javascript
文章平均质量分 75
杨树林er
前端资深讲师,主攻原生JavaScript方向,以最白话的方式,解释复杂的专业术语和概念。
展开
-
JavaScript数组(Array)方法 - toReversed、toSorted、toSpliced
最近发现几个数组方法(toReversed、toSorted、toSpliced),是一些常规方法的升级版,比较有意思,分享给大家原创 2024-05-10 16:00:59 · 235 阅读 · 0 评论 -
JavaScript字符排序规则(编码排序、字典排序)
前端日常使用的排序规则主要有:**编码排序**、**字典排序**。在常规程序中,默认的排序规则大部分都是编码排序,也就是所谓的 Unicode编码。比如在 js 中,数组的 sort 方法,默认排序规则就是编码排序。原创 2024-05-09 14:31:15 · 1201 阅读 · 1 评论 -
聊聊前端中异步与副作用
前端领域中关于异步的知识对架构师而言非常重要,未来的趋势前端很多工作是设计 pipeline 串各个服务和数据的推进器,我们需要和各个服务打交道就必然会有各种异步处理,今天让我们一起看看前端中的异步转载 2024-03-12 16:49:26 · 97 阅读 · 0 评论 -
canvas基础使用2【入门教程】
canvas基础使用,canvas入门教程,从0开始快速入门原创 2023-08-03 10:00:00 · 326 阅读 · 0 评论 -
canvas基础使用1【入门教程】
canvas基础使用,canvas入门教程,从0开始快速入门原创 2023-08-01 09:00:00 · 829 阅读 · 0 评论 -
面试题:业务需要分10次请求10个接口,每个接口请求后等待2s再进行下一次请求,在不借助任何JavaScript框架或者库的前提下实现。(阿里前端面试题)
业务需要分10次请求10个接口,每个接口请求后等待2s再进行下一次请求,在不借助任何JavaScript框架或者库的前提下实现。原创 2023-06-29 12:02:49 · 802 阅读 · 0 评论 -
面试题:写一个find方法,根据id查找data树中的任意一项。(阿里前端面试题)
如题:写一个find方法,根据id查找data树中的任意一项。原创 2023-06-29 00:36:28 · 986 阅读 · 0 评论 -
JavaScript垃圾回收机制
在JavaScript中,垃圾回收(Garbage Collection)是一种自动内存管理机制,它可以自动地识别不再使用的变量和对象并将它们从内存中清除,以释放内存空间。原创 2023-05-23 17:15:22 · 6832 阅读 · 0 评论 -
一文读懂什么是Event Loop
本文将深入介绍Event Loop的工作原理、任务分类以及应用场景,帮助读者更加全面深入地了解这个概念。原创 2023-04-18 18:09:41 · 2113 阅读 · 1 评论 -
Promise基础入门
Promise基础入门原创 2022-10-24 02:34:38 · 910 阅读 · 1 评论 -
关于计算机中浮点数的精度计算问题
文章目录一、问题二、原理三、解决一、问题在计算机中我们可能偶尔会遇到一些小数的计算,得到的结果并不是我们想要的结果,如:console.log(0.1 + 0.2); // 0.30000000000000004console.log(0.1 + 0.7); // 0.7999999999999999console.log(0.1 * 3); // 0.30000000000000004以上代码中,0.1加0.2,结果应该是0.3,但这里却多出了0.000000000000000原创 2022-02-22 01:28:10 · 1058 阅读 · 3 评论 -
js循环练习题
question:1. 一张纸的厚度是0.0001米,将纸对折,对折多少次厚度超过珠峰高度8848米。2. 有一对幼兔,幼兔1个月后长成小兔,小兔1个月后长成成兔并生下一对幼兔,问8个月后有多少对兔子,幼兔、小兔、成兔对数分别是多少。3. 羽毛球拍15元,球3元,水2元。200元每种至少一个,有多少可能4. 球从100米的高度落地,每次落地弹起原高度的一半再落下,求在第10次落下时,共经过了多少米?第10次的反弹了多高?5. 猴子吃桃:第一天有若干个桃子,每天吃掉所有现存桃子的一半再多一个,第1原创 2021-04-23 08:44:16 · 1910 阅读 · 3 评论 -
call和apply的使用-扩展篇
一、回顾在上篇文章call和apply的使用-基础篇中,我们已经提到了call和apply的功能和语法,这里稍作回顾:介绍: call和apply都是函数的方法,需要加在函数体后执行。功能: 都是用来修改函数的执行上下文(this)。语法:call(thisObj,arg1,arg2,arg3,……)apply(thisObj,argArr)说明:call和apply的主要区别就是:call可以接受一个或以上的参数,当接受多个参数时,从第二个参数开始,后面所有的参数都会改变原函数的参数;ap原创 2021-03-22 16:08:00 · 563 阅读 · 0 评论 -
call和apply的使用-基础篇
在使用call和apply之前,我们需要先做一些知识储备:一、window对象window对象是js中的顶层对象,所有全局变量和全局函数都被绑定在了window对象身上,如何证明呢,我们可以先声明一个全局变量和函数,然后来观察window对象。如代码1-1:var a = 10; //全局变量function abc(){ //全局函数 console.log("Young");}console.log(window); //此时原创 2021-03-22 16:03:57 · 1227 阅读 · 2 评论 -
什么是JSON
一、什么是json?json的全称为:JavaScript Object Notation,是一种轻量级的数据交互格式。它基于 ECMAScript (欧洲计算机协会制定的js规范)的一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。【以上来自于百度百科】简单来说:json就是一种在各个编程语言中流通的数据格式,负责不同编程语言中的数据传递和交互。类似于:国际通用语言 - 英语中国56个民族不同地区的通用语言 - 普通话。但真要说json到底是什么,以及json的作用,我们总是难以原创 2021-03-22 15:59:17 · 2634 阅读 · 0 评论 -
js中伪数组转真数组
一、什么是真数组(数组)所谓真数组,其实可以直接称为:数组。当一个对象具有以下特点时,可以称为数组:可以按照索引的方式,存储多个数组具有length属性,表示数组内数据的长度(个数)对象的原型属性__proto__,指向Array类,且可以使用Array的原型对象prototype身上的属性和方法,如:push,pop等。如图1:二、什么是伪数组所谓伪数组,当一个对象具有以下特点:具有length(长度)属性;可以使用索引对数据进行操作;但是不能使用数组的方法,如push,pop原创 2021-03-22 15:54:47 · 2036 阅读 · 0 评论 -
JavaScript的起源、发展和组成
一、JavaScript的起源JavaScript因为互联网而生,紧随着浏览器的出现而问世。回顾它的历史,就要从浏览器的历史讲起。此处我们使用时间线的形式,简单回顾这段辉煌的历史:1990年底,欧洲核能研究组织,发明了万维网(World Wide Web)。1992年底,美国国家超级电脑应用中心(NCSA),开发了第一个浏览器,Mosaic。1994年10月,Mosaic通信公司成立,不久后改名为Netscape。开始开发面向普通用户的新一代的浏览器 Netscape Navigator。199原创 2021-03-22 15:51:46 · 1210 阅读 · 0 评论 -
JavaScript函数防抖
一、前言没有前言,就是想整理一篇《函数防抖》和《函数节流》的相关知识,当然在工作和面试中遇到的可能性也是比较大的。废话不多,上正题:二、什么是函数防抖**我们设想一个坐电梯的场景:**有一个电梯,容量无限大,但是一次同时只能进入一个人,在打开电梯门之后,5秒就会自动关闭,在第4秒时需要进来多个人,可能刚进一个,电梯门就关了,此时需要重新将电梯门打开,让剩下的人通过。如果一直维持这个进入情况,那么电梯门就会重复关闭再打开,会产生抖动的情况,安全隐患大。**解决方法,可以设定为:**电梯门打开之后,如原创 2021-02-23 17:44:23 · 397 阅读 · 1 评论 -
JavaScript函数节流
一、前言相对于函数防抖来说,函数节流的应用场景和频次更大一些。当然,如果想复习函数防抖,请点击《函数防抖》。废话不多,上正题:二、什么是函数节流我们设想一个进地铁站过闸机的场景:每位乘客在刷卡进入之后,大约2秒后门关闭,下一个乘客才能刷卡进入。如果上一个乘客刷卡之后还没有进入或者闸机还未关闭,此时另一个乘客在当前闸机是刷不上卡的。这就是一种节流的操作。节流函数:不管事件的触发频率有多高,只会间隔设定的时间执行一次目标函数。简单来说:每隔单位时间,只执行一次三、为什么要函数节流某些情况下,浏览器的原创 2021-02-23 17:42:35 · 449 阅读 · 0 评论 -
JavaScript数组去重
在实际工作或面试中,我们经常会遇到“数组去重”问题,接下来就是使用js实现的数组去重的多种方法:将数组的每一个元素依次与其他元素做比较,发现重复元素,删除 var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5,5]; console.log(arr); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5, 5, 5, 5] function noRepeat1(arr) { for(var i =原创 2021-01-28 08:43:24 · 867 阅读 · 0 评论 -
cookie,localStorage,sessionStorage 的区别
一、概念介绍cookie是在HTML4中使用的给客户端保存数据的,也可以和session配合实现跟踪浏览器用户身份;而webstorage(包括:localStorage和sessionStorage)是在HTML5提出来的,纯粹为了保存数据,不会与服务器端通信。WebStorage两个主要目标:提供一种在cookie之外存储会话数据的路径提供一种存储大量可以跨会话存在的数据的机制二、cookie 的特点只能使用文本文件文件有大小限制4K左右不可跨域时效限制(默认会话级,可指定)每原创 2021-01-25 20:39:10 · 350 阅读 · 0 评论 -
JavaScript数组(Array)方法大全(一)
js中数组的方法种类众多,有ES5之前版本中存在的,ES5新增,ES6新增等;并且数组的方法还有原型方法和从object继承的方法,这里我们只介绍数组原型方法。原创 2021-01-22 12:03:28 · 5018 阅读 · 6 评论 -
jQuery动画的easing插件Demo
一、前言从jQuery API 文档中可以知道,jQuery自定义动画的函数$().animate( properties [, duration] [, easing] [, complete] )有四个参数:properties:一组包含作为动画属性和终值的样式属性和及其值的集合duration(可选):动画执行时间,其值可以是三种预定速度之一的字符串(“slow”, “normal”, or “fast”)或表示动画时长的毫秒数值(如:1000)easing(可选):要使用的过渡效果的名称,原创 2021-01-21 17:03:47 · 581 阅读 · 0 评论 -
详解requestAnimationFrame,并模拟setInterval效果
一、前言由于最近在做一些新尝试,瞄上了HTML5的新特性requestAnimationFrame,发现真是好用,比计时器好了不知…但话不能说太满,各有各的好处吧…,下面就来大致详细简单聊聊requestAnimationFrame到底是个啥?怎么用?有啥特色?二、概述requestAnimationFrame字面意思:请求动画帧。官方解释:帧动画。就是可以一帧一帧的执行动画。那么问题来了,这个一帧的执行频率是多久?答案是:与屏幕的刷新频率同步。也可以认为:让浏览器在显示器屏幕下次刷新时,执行一帧原创 2021-01-18 16:48:50 · 1729 阅读 · 0 评论 -
JavaScript对象的拷贝
本文主要介绍js对象的拷贝,包括浅拷贝和深拷贝,侧重实际方式,简单介绍概念。一、js数据类型js数据有不同的划分方式,此处以数据在内存中的储存形式划分,可以分为两种类型:基本类型和复杂类型基本类型主要包括:string,number,boolean,undefined,null,symbol复杂类型主要包括:object,array,function二、js中的栈堆在js引擎中对数据的存储主要有两种位置,堆内存和栈内存。栈内存主要用于存储各种基本类型的变量,包括string,number,原创 2021-01-16 22:43:34 · 897 阅读 · 1 评论 -
彻底搞懂javascript中的this的指向
一、前言我们知道this关键字是一个非常重要的语法。毫不夸张的说不理解它的含义,大部分开发任务,都无法完成。在编写js程序的时候也会经常见到或者用到它,但是有一部分开发朋友对this可能一知半解,下面我们一起来探讨javascript中this的具体含义。本文分为四部分:函数的声明和执行this(这里)是哪里变化多端的this亘古不变的this二、函数的声明和执行回顾函数的声明和执行,因为一般 this 都是在函数中进行使用函数的声明:使用function关键字声明:functi原创 2021-01-16 22:41:42 · 692 阅读 · 2 评论 -
原生js使用FileReader将文件转成base64
一、FileReader介绍FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容。可以使用File对象指定要读取的文件。File对象可以是来自用户在一个type类型为file的input元素上选择文件后返回的FileList对象。注意: FileReader仅用于以安全的方式从用户(远程)系统读取文件内容,它不能用于从文件系统中直接使用路径名简单地读取文件。二、FileReader的使用FileReader是一个构造函数,原创 2021-01-14 17:18:33 · 5920 阅读 · 8 评论 -
原生javascript面试题:给定一个有序数组,如果数组内容是连续的,使用->符号,连接连续数字的第一个和最后一个
如题:给定一个有序数组,如果数组内容是连续的,使用->符号,连接连续数字的第一个和最后一个。原数组:[1, 2, 3, 4, 5, 7, 8, 9, 12, 14, 15, 16]返回新数组:[“1->5”, “7->9”, 12, “14->16”] let input = [1, 2, 3, 4, 5, 7, 8, 9, 12, 14, 15, 16]; let output = []; let len = input.length; let原创 2021-01-13 20:05:47 · 628 阅读 · 0 评论