分类：JS

2021
06-09

原生JS中应该禁止出现的写法

块级函数严格模式下，在ES6之前应禁止使用。ES6开始可以使用，函数的作用域为声明该函数的块内部。非严格模式下应禁止使用。if(true){functiontest(){//块级函数console.log(1);}}test();直接修改对象的prototype原型浏览器对原型进行了优化，在调用实例之前，会为对象的方法提前规划内存位置。所以不可以直接修改prototype原型。以下两种方法都应禁止使用使用Object.setPrototypeOf修改原型function... 继续阅读 >
2021
06-08

详解Javascript实践中的命令模式

定义Encapsulatearequestasanobject,therebylettingyouparameterizeotherobjectswithdifferentrequests,queueorlogrequests,andsupportundoableoperations.“「命令模式」将「请求」封装成对象，以便使用不同的请求、队列或者日志来参数化其他对象，同时支持可撤消的操作。这里的「请求」的定义，并不是我们前端常说的「Ajax请求」，而是一个「动作请求」，也就是发起一个行为。例如，通过遥控器关闭电视，... 继续阅读 >
2021
06-08

浅谈JS和Nodejs中的事件驱动

事件驱动和发布-订阅事件驱动架构是建立在软件开发中一种通用模式上的，这种模式被称为发布-订阅或观察者模式。在事件驱动架构中，至少有两个参与者：主题（subject）和观察者（observer）。主题就像调频收音机一样，向有兴趣收听该主题所说内容的观察者进行广播。观察者可能只有一个，也可能有一百个，这都没有关系，只要主题有一些要广播的消息就够了。请记住，事件驱动、发布-订阅和观察者模式在实践中不是一回事，但在理想情况... 继续阅读 >
2021
06-08

如何制作自己的原生JavaScript路由

前言当你想到路由时，通常会想到类似react之类的库。但实际上，这些库和框架仍然使用vanillaJavaScript。那么该怎么实现呢？我希望这个“JavaScript路由教程”能够帮你了解如何用原生js写出自己的路由。简介我遇到了很多出于各种原因想要自己创建路由的人。既然你看到本文，那意味着你可能也是其中的一个！最重要的是，使用vanillajsrouter可以减少你对框架的依赖。只要你了解实现它所涉及的所有部分，就可以相对容易的在原生Java... 继续阅读 >
2021
06-08

Js模块打包exports require import的用法和区别

1、Commonjs之exports和require用法Commonejs规定每个文件是一个模块。将一个JavaScript文件直接通过script标签引入页面中，和封装成CommonJS模块最大的不同在于：前者的顶层作用域是全局作用域，在进行变量及函数声明时会污染全局环境；而后者会形成一个属于模块自身的作用域，所有的变量及函数只有自己能访问，对外是不可见的。1.1CommonJS导出之module.exports导出是一个模块向外暴露自身的唯一方式。在CommonJS中，通过modul... 继续阅读 >
2021
06-08

详解JS中的对象字面量

前言在ES6之前，js中的对象字面量(也称为对象初始化器)是非常基础的。可以定义两种类型的属性：键值对{name1:value1}获取器{getname(){..}}和设置器{setname(val){..}}的计算属性值varmyObject={myString:'value1',getmyNumber(){returnthis._myNumber;},setmyNumber(value){this._myNumber=Number(value);},};myObject.myString;//=>'value1'myObject.myNumber='15';myObje... 继续阅读 >
2021
06-08

浅谈JS前端模块化的几种规范

前言有这样一个场景，客户端运行很久，但是法务部和数据部需要收集用户的一些信息，这些信息收集好之后需要进行相应的数据处理，之后上报到服务端。客户端提供一个纯粹的js执行引擎，不需要WebView容器。iOS端有成熟的JavaScriptCore、Android可以使用V8引擎。这样一个引擎配套有一个SDK，访问Native的基础能力和数据运算能力，可以看成是一个阉割版的HybridSDK额外增加了一些数据处理能力。问题结束了吗？处理逻辑的... 继续阅读 >
2021
06-08

详解JS变量存储深拷贝和浅拷贝

变量类型与存储空间栈内存和堆内存基本数据类型string、number、null、undefined、boolean、symbol(ES6新增)变量值存放在栈内存中，可直接访问和修改变量的值基本数据类型不存在拷贝，好比如说你无法修改数值1的值引用类型ObjectFunctionRegExpMathDate值为对象，存放在堆内存中在栈内存中变量保存的是一个指针，指向对应在堆内存中的地址。当访问引用类型的时候，要先从栈中取出该对象的地址指针，然后再从堆内存中取得所需... 继续阅读 >
2021
06-08

详解JS ES6变量的解构赋值

1.什么是解构？ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构。它在语法上比ES5所提供的更加简洁、紧凑、清晰。它不仅能减少你的代码量，还能从根本上改变你的编码方式。2.数组解构以前，为变量赋值，我们只能直接指定值，比如leta=1;letb=2;letc=3;现在可以用数组解构的方式来进行赋值let[a,b,c]=[1,2,3];console.log(a,b,c);//1,2,3这是数组解构最基本类型的用法，还可以解... 继续阅读 >
2021
06-07

JavaScript实现时间范围效果

JavaScript实现时间范围效果 本文实例为大家分享了JavaScript实现时间范围效果的具体代码，供大家参考，具体内容如下当前时间往前的时间范围（六个月之前）效果图js文件代码片/*查询日期区间（当前时间往前）AddByVivian2020/12/04*///rangeVal:两个日期的间隔符num：隔多少timeType：相隔时间类型functionfunGetRangeDateByLess(rangeVal,num,timeType){varreturnVal="";varotherVal="";varotherTime="";varcurTime=newDate()... 继续阅读 >
2021
06-07

基于JavaScript实现网页计算器

基于JavaScript实现网页计算器 本文实例为大家分享了JavaScript实现网页计算器的扫雷游戏的具体代码，供大家参考，具体内容如下先看效果：此外，计算器还附有数字、运算符检查功能：下贴源码：<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title>计算... 继续阅读 >
2021
06-05

如何用JavaScript学习算法复杂度

概述在本文中，我们将探讨“二次方”和“nlog(n)”等术语在算法中的含义。在后面的例子中，我将引用这两个数组，一个包含5个元素，另一个包含50个元素。我还会用到JavaScript中方便的performanceAPI来衡量执行时间的差异。constsmArr=[5,3,2,35,2];constbigArr=[5,3,2,35,2,5,3,2,35,2,5,3,2,35,2,5,3,2,35,2,5,3,2,35,2,5,3,2,35,2,5,3,2,35,2,5,3,2,35,2,5,3,2,... 继续阅读 >
2021
06-05

JS不要再到处使用绝对等于运算符了

概述我们知道现在的开发人员都使用===来代替==，为什么呢？我在网上看到的大多数教程都认为，要预测JavaScript强制转换是如何工作这太复杂了，因此建议总是使用===。这些都导致许多程序员将该语言的一部分排除在外，并将其视为一种缺陷，而不是去扩大他们的对该过程的理解。下面通过两个使用案例，说明使用==的好处。1.测试空值if(x==null)vsif(x===undefined||x===null)2.读取用户的输入letuserInput=document.getEl... 继续阅读 >
2021
06-05

详解JavaScript进度管理

前言我们写程序的时候会经常遇到显示进度的需求，如加载进度、上传进度等。最常见的实现方式是通过记录已完成数量(loadedCount)和总数量(totalCount)，然后算一下就能得到进度了。这种方式简单粗暴，容易实现，但不好扩展，必须有个地方维护所有loadedCount和totalCount。本文将会基于上述实现方式，实现一种更容易扩展的进度管理方式。问题笔者在写WebGL应用，在应用预加载阶段需要计算加载进度。加载的内容包括：模型资源、贴... 继续阅读 >
2021
06-05

详解JavaScript私有类字段和TypeScript私有修饰符

JavaScript私有类字段和隐私需求在过去，JavaScript没有保护变量不受访问的原生机制，当然除非是典型闭包。闭包是JavaScript中许多类似于私有模式（如流行的模块模式）的基础。但是，近年来ECMAScript2015类被使用后，开发人员感到需要对类成员的隐私进行更多控制。类字段提案（在撰写本文时处于第3阶段）试图通过引入私有类字段来解决问题。让我们看看它们是什么样子的。一个JavaScript私有类字段的例子这是一个带有私... 继续阅读 >