分类：JS

2020
09-24

JS中==、===你分清楚了吗

==、===都是相等运算符，这个大家应该都知道，但二者有什么区别呢？其实==是相等，===是严格相等，那他们有什么本质的区别呢？下面我就给大家细细道来。=：赋值运算符==：判断是否相等：忽略了类型进行值的比较。===：判断是否相等：先进行值的比较，如果值相等，再去比较类型。即带有类型的值的比较。==相等比较两个值的时候，有两种情况，一种如果两个值的类型相同，就直接比较；另一种如果两个值得类型不同，则会尝试改变... 继续阅读 >
2020
09-24

js数组相减简单示例【删除a数组所有与b数组相同元素】

本文实例讲述了js数组相减。分享给大家供大家参考，具体如下：<!DOCTYPEhtml><html><head><title>js数组相减</title></head><body><scripttype="text/javascript">functionarrChange(a,b){for(vari=0;i<b.length;i++){for(varj=0;j<a.length;j++){if(a[j]==b[i]){//如果是id相同的，那么a[j].id==b[i].ida.splice(j,1);j=j-1;}}}return... 继续阅读 >
2020
09-24

JS数组方法reduce的用法实例分析

本文实例讲述了JS数组方法reduce的用法。分享给大家供大家参考，具体如下：数组方法reduce用来迭代一个数组，并且把它累积到一个值中。使用reduce方法时，你要传入一个回调函数，这个回调函数的参数是一个累加器（比如例子中的previousVal)和当前值(currentVal）。reduce方法有一个可选的第二参数，它可以被用来设置累加器的初始值。如果没有在这定义初始值，那么初始值将变成数组中的第一项，而currentVal将从数组的... 继续阅读 >
2020
09-24

JS面向对象编程——ES6 中class的继承用法详解

本文实例讲述了ES6中class的继承用法。分享给大家供大家参考，具体如下：JS是一种基于对象的语言，要实现面向对象，写法跟传统的面向对象有很大的差异。ES6引入了Class语法糖，使得JS的继承更像面向对象语言的写法。此篇博客，分为：基本介绍、Vue使用案例基本介绍Class可以通过extends关键字实现继承，这比ES5的通过修改原型链实现继承，要清晰和方便很多；classFather{}classSonextendsFather{}代码定义了一个Son类，... 继续阅读 >
2020
09-24

JS常用排序方法实例代码解析

有些代码一两个月都会忘了，有空多做下总结，记录下来，等需要用到的时候可以来翻翻总结的博客。写技术博客，对自己是一种总结，对别人，是一种参考。1.sort()方法varar1=[2,4,6,8,1,3]varar2=[2,16,36,8,56]ar1.sort()ar2.sort()//这个方法值只能排序第一位数也可以字符串进行排序console.log(ar1)//[1,2,3,4,6,8]console.log(ar2)//[16,2,36,56,8]ar2.sort(function(a,b){returna-b//a-b为升序//returnb-a//b-a为... 继续阅读 >
2020
09-24

JS面向对象编程实现的Tab选项卡案例详解

JS面向对象编程实现的Tab选项卡案例详解 本文实例讲述了JS面向对象编程实现的Tab选项卡。分享给大家供大家参考，具体如下：Tab选项卡案例下面是一个简单面向过程的Tab选项卡。<!DOCTYPEhtml><html><head><style>#tabBoxinput{background:#F6F3F3;border:1pxsolid#FF0000;}#tabBox.active{background:#E9D4D4;}#tabBoxdiv{width:300px;height:250px;display:none;padding:10px;back... 继续阅读 >
2020
09-24

JS面向对象编程基础篇（三） 继承操作实例详解

本文实例讲述了JS面向对象编程继承操作。分享给大家供大家参考，具体如下：构造函数的继承上一篇JS面向对象编程封装操作，主要介绍了如何"封装"数据和方法，以及如何从原型对象生成实例。今天要介绍的是，对象之间的"继承"的五种方法。比如，现在有一个"动物"对象的构造函数。functionAnimal(){this.species="动物";   this.action="吃"}还有一个"猫"对象的构造函数。functionCat(name,color){this.name... 继续阅读 >
2020
09-24

JS面向对象编程基础篇（二） 封装操作实例详解

本文实例讲述了JS面向对象编程封装操作。分享给大家供大家参考，具体如下：Javascript是一种基于对象（object-based）的语言，你遇到的所有东西几乎都是对象。但是，它又不是一种真正的面向对象编程（OOP）语言，因为它的语法中没有class（类）。那么，如果我们要把"属性"（property）和"方法"（method），封装成一个对象，甚至要从原型对象生成一个实例对象，我们应该怎么做呢？封装一、生成实例对象的原始模式假定我们把猫看成... 继续阅读 >
2020
09-24

JS面向对象编程基础篇（一） 对象和构造函数实例详解

本文实例讲述了JS面向对象编程对象和构造函数。分享给大家供大家参考，具体如下：面向对象编程（ObjectOrientedProgramming，缩写为OOP）是目前主流的编程范式。它将真实世界各种复杂的关系，抽象为一个个对象，然后由对象之间的分工与合作，完成对真实世界的模拟。每一个对象都是功能中心，具有明确分工，可以完成接受信息、处理数据、发出信息等任务。对象可以复用，通过继承机制还可以定制。因此，面向对象编程具有灵活、代... 继续阅读 >
2020
09-24

js实现烟花特效

本文实例为大家分享了js实现烟花特效的具体代码，供大家参考，具体内容如下1.概述在网页背景中实现鼠标点击出现模拟烟花爆炸的特效2.思路1.获取鼠标点击位置，底端创建烟花节点。2.为烟花添加css属性，烟花节点从下至上运动。3.运动至鼠标位置时移除烟花节点，同时生成多个烟花碎片。4.为不同的烟花碎片随机生成不同的颜色、运动速度、运动方向。5.烟花碎片超出屏幕显示部分时移除。3.代码部分<!DOCTYPEhtml><htmllang="en"><he... 继续阅读 >
2020
09-24

JS造成内存泄漏的几种情况实例分析

本文实例讲述了JS造成内存泄漏的几种情况。分享给大家供大家参考，具体如下：介绍：js中的内存垃圾回收机制：垃圾回收器会定期扫描内存，当某个内存中的值被引用为零时就会将其回收。当前变量已经使用完毕但依然被引用，导致垃圾回收器无法回收这就造成了内存泄漏。传统页面每次跳转都会释放内存，所以并不是特别明显。Vue单页面应用中：WebApp与传统Web的区别，因为WebApp是单页面应用页面通过路由跳转不会刷新页面，导致内存... 继续阅读 >
2020
09-24

js中addEventListener()与removeEventListener()用法案例分析

本文实例讲述了js中addEventListener()与removeEventListener()用法。分享给大家供大家参考，具体如下：所有的DOM节点中都包含addEventListener()与removeEventListener()这两种方法，用于追加事件和删除追加。接受参数：要处理的事件名、作为事件处理程序的函数和一个布尔值。(3个)最后这个布尔值参数是true，表示在捕获阶段调用事件处理程序；如果是false，表示在冒泡阶段调用事件处理程序。默认为false;事件传递有两种方式：冒... 继续阅读 >
2020
09-24

js构造函数constructor和原型prototype原理与用法实例分析

本文实例讲述了js构造函数constructor和原型prototype原理与用法。分享给大家供大家参考，具体如下：所有引用类型（函数，数组，对象）都拥有__proto__属性（隐式原型）所有函数拥有prototype属性（显式原型）（仅限函数）原型对象：拥有prototype属性的对象，在定义函数时就被创建__proto__,prototype和constructor下面这三个属性的定义非常重要，始终贯穿在原型中。prototype：此属性只有构造函数才有，它指向的是当前构造函... 继续阅读 >
2020
09-24

原生js实现日历效果

本文实例为大家分享了js实现日历效果的具体代码，供大家参考，具体内容如下html代码<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><metahttp-equiv="X-UA-Compatible"content="ie=edge"><title>日历插件</title><linkrel="stylesheet"href="./css/reset.css"><linkrel="stylesheet"href="./css/index.css"></head><body><di... 继续阅读 >
2020
09-24

js中火星坐标、百度坐标、WGS84坐标转换实现方法示例

本文实例讲述了js中火星坐标、百度坐标、WGS84坐标转换实现方法。分享给大家供大家参考，具体如下：//定义一些常量varx_PI=3.14159265358979324*3000.0/180.0;varPI=3.1415926535897932384626;vara=6378245.0;varee=0.00669342162296594323;/***百度坐标系(BD-09)与火星坐标系(GCJ-02)的转换*即百度转谷歌、高德*/functionbd09togcj02(bd_lon,bd_lat){varx_pi=3.14159265358979324*3000.0/... 继续阅读 >