JavaScript
文章平均质量分 84
JavaScript
小白张幺幺
这个作者很懒,什么都没留下…
展开
-
梳理一下JS中的继承方法
JS中的继承什么是继承?继承可以在一个对象中去访问另一个对象的方法或者属性,提高代码自由度。方法一、通过call继承1.解决引用类型继承问题例:// 父类 function Parent(name) { this.name = name; this.color = ['pink', 'red']; } // 子类 function Child() { Parent.call(thi原创 2020-11-17 20:46:14 · 550 阅读 · 0 评论 -
移动端的touch事件详解
移动端的touch事件触摸事件的起源随着智能手机和平板电脑的普及, 越来越多的人用移动设备浏览网页,我们平时在pc浏览器上用的鼠标事件,比如:click, mouseover等, 已经无法满足移动设备触摸屏的特点,触摸时代的到来,离不开那些触摸事件。触摸事件touchstart、touchmove和touchend的出现是因为iOS版Safari浏览器为了向开发人员传达一些信息而新添加的事件。因为ios设备既没有鼠标也没有键盘,所以在为移动Safari浏览器开发交互性网页的时候,PC端的鼠标和键盘事件原创 2020-11-10 20:18:53 · 2944 阅读 · 0 评论 -
JS中的继承(部分)
JS中的继承(部分)什么是继承?继承可以在一个对象中去访问另一个对象的方法或者属性,提高代码自由度。方法一、通过call继承1.解决引用类型继承问题例:// 父类 function Parent(name) { this.name = name; this.color = ['pink', 'red']; } // 子类 function Child() { Parent.call原创 2020-10-08 19:51:58 · 148 阅读 · 0 评论 -
JS原型中的constructor属性
JS原型中的constructor属性定义constructor 属性返回对创建此对象的数组函数的引用。语法object.constructorthis指向constructor,构造函数,对这个名字,我们都不陌生,constructor始终指向创建当前对象的构造函数。这里有一点需要注意的是,每个函数都有一个prototype属性,这个prototype的constructor指向这个函数,这个时候我们修改这个函数的prototype时,就发生了意外。例:function Person(n原创 2020-10-08 19:14:47 · 1256 阅读 · 0 评论 -
JS之原型的基本使用
JS中的原型js中的原型毫无疑问一个难点,对于这个难点我们都应该先熟练的使用,然后自己整理一套属于自己的理解说辞,才不会忘记。原型(对象属性)1.原型是function对象的一个属性,它定义了构函数制造出的对象的公共祖先,通过该构造函数的对象,可以继承该原型的属性和方法,原型也是对象使用构造函数创建对象:例Person.prototype.name = "小明"; function Person() { } var person = new Person();原创 2020-10-08 18:52:53 · 128 阅读 · 0 评论 -
JS中的同步任务和异步任务的概念以及区别
JS中的同步和异步单线程语言js是一门单线程语言,所谓"单线程",就是指一次只能完成一件任务。如果有多个任务,就必须排队,前面一个任务完成,再执行后面一个任务,以此类推。如果一个任务耗时过长,那么后面的任务就必须一直等待下去,会拖延整个程序,常见浏览器无反应,可能就是一段代码死循环,造成程序卡住在这个位置,无法继续。而js之所以会是单线程语言的原因和它的用途有很大的关系,我们都知道,JavaScript作为浏览器的脚本语言,主要用来实现与用户的交互,利用JavaScript,我们可以实现对DOM的各种各原创 2020-10-08 18:16:19 · 1382 阅读 · 0 评论 -
JavaScript中的Math类
JavaScript中的Math类Math类的简介最近在运用canvas(画布)的一些方法去绘制一些东西时,经常会搭配Math类来使用,所以就想来对Math类的方法来做一个总结。首先Math类是一个很有用的数学帮助类,使用也非常简单,这个类比较特殊,首先他和String类一样都是用final修饰,所以不能有子类,还有就是它的构造方法是私有的,也就是我们不能通过new的方法在其它类中构造Math对象,那么我们怎样调用它的方法,原来它的所有的方法都是静态方法,也就是可以直接使用类名就可以访问方法了。方法原创 2020-09-27 22:33:09 · 354 阅读 · 0 评论 -
JS中的事件流程以及DOM2级事件绑定与DOM0级事件绑定
JS中的事件流程以及DOM2级事件绑定与DOM0级事件绑定事件流程事件流程分为三个阶段:捕获阶段、目标阶段、冒泡阶段。捕获阶段:事件从最顶层元素开始执行,一层层往下,直到精确元素。目标阶段:事件在精确元素上执行。冒泡阶段:事件从精确元素开始执行,一层层往上,直到顶层元素(注:高级浏览器的顶层元素是window,ie8以下的浏览器顶层元素是document)DOM0级事件的绑定语法:box.onclick = function(){}//元素.事件行为=函数相当于给一个元素的属性赋值,只原创 2020-09-20 21:54:22 · 1648 阅读 · 0 评论 -
JS使用防抖和节流来减少影响性能的因素
JS中的防抖和节流什么是防抖和节流在前端开发中会遇到一些频繁的事件触发,例如input,keyup,keydown,scroll,resize,mousemove等,这非常影响性能,所以我们需要控制它们触发的频率,方法就是防抖与节流。防抖防抖的原理就是:要等你触发完事件 n 秒内不再触发事件,我才执行。 function debounce(func, wait) { var timeout; return function () { var conte原创 2020-09-20 20:56:12 · 319 阅读 · 0 评论 -
JS中的深拷贝(深克隆)和浅拷贝(浅克隆)
JS中的深拷贝(深克隆)和浅拷贝(浅克隆)一、浅拷贝:例:// 对象var obj1 = { a: 1, b: 2};var obj2 = obj1;obj2.a = 3;console.log(obj1); // {a: 3, b; 2}console.log(obj2); // {a: 3, b: 2}// 数组var arr1 = [1, 2, 3];var arr2 = arr1;arr2.push(4);console.log(arr1); /原创 2020-09-13 15:40:19 · 275 阅读 · 0 评论 -
JS定时器的使用方法详解
JS定时器的使用什么是定时器?定时器就是由JS提供了一些原生方法来实现延时去执行某一段代码。定时器的分类一、第一种是一次性的:setTimeout: 设置一个定时器,在定时器到期后执行一次函数或代码段使用方法:var timer=setTimeout(fun,毫秒数)清除的方法:clearTimeout(timer)二、第二种是周期性的:setInterval: 以固定的时间间隔重复调用一个函数或者代码段使用方法:var timer=setInterval(fun,毫秒数)清除的方原创 2020-09-13 14:52:17 · 3546 阅读 · 0 评论 -
JS中的作用域概念以及注意事项
JS中的作用域一.什么是作用域1.javaScript作用域:就是某个变量在某个范围内起作用和效果,目的是为了提高程序的可靠性更重要的是减少命名冲突。2.js的作用域分为(es6)之前:全局作用和局部作用域。例: <script> //1.全局作用域:整个script标签 或者是一个单独的js文件 var num = 10; //2.在函数内部就是局部作用域(函数作用域) 这个变量只在函数内部起效果和作用 functio原创 2020-09-06 20:11:45 · 624 阅读 · 1 评论 -
JS之代码简洁(补充)
JS之代码简洁(补充)前言我们在编写程序应该想到将为未来的自己和“其他人”编写代码,而不仅仅只编写当前能工作就行的代码。所以,在编写代码时一定要尽量让自己的代码更加的简洁,从而易于人理解的、易于更改或扩展。一.函数1.使用长而具有描述性的名称。考虑到函数表示某种行为,函数名称应该是动词或短语,用以说明其背后的意图以及参数的意图。函数的名字应该说明他们做了什么。//不好的方式function notif(user) { // ...}//好的方式function notifyUser(e原创 2020-09-06 18:05:29 · 129 阅读 · 0 评论 -
JS之代码简洁(部分)
JS之代码简洁(部分)前言我们在编写程序应该想到将为未来的自己和“其他人”编写代码,而不仅仅只编写当前能工作就行的代码。所以,在编写代码时一定要尽量让自己的代码更加的简洁,易于人理解的、易于更改或扩展的代码。1. 强类型检查用全等于( === ) 代替等于 ( == )。例:// 如果处理不当,它会极大地影响程序逻辑。就比如你要往东走,但是却由某种原因,让你往西走0 == false // true0 === false // false2 == "2" // true2 === "2"原创 2020-08-30 20:39:58 · 199 阅读 · 0 评论 -
js中的try-catch-finally和throw(错误的捕获和抛出)
js中的try-catch-finally和throw(错误的捕获和抛出)什么情况下适合使用错误的捕获和错误的抛出?我觉得应该捕获那些你确切地知道该如何处理的错误,捕获错误的目的在于避免浏览器以默认方式处理它们(比如不友好的提醒、代码终止,界面卡住或者崩溃),而抛出错误的目的在于提供错误发生具体原因的消息,以提示我们更准确的处理他们。方法捕获错误:try-catch-finally抛出错误:throw使用方法捕获例:try{ // 可能会导致错误的代码 // 如原创 2020-08-29 16:56:44 · 1012 阅读 · 0 评论 -
JS中如何判断一个对象是否为数组?
JS中如何判断一个对象是否为数组?为什么要判断一个对象是否为数组呢?首先,我们应该都知道typeof操作符对于一些常用类型的判断是非常轻松简便的,但是当它遇到null类型和Array对象这两个时,都会被判断为object例:console.log(typeof null); // objectconsole.log(typeof [1,2,3]); // objectconsole.log(typeof '这是一段字符串'); // stringconsole.log(typeof 1)原创 2020-08-23 20:18:55 · 3308 阅读 · 0 评论 -
JS中的replace()配合正则表达式使用的方法
JS中的replace()配合正则表达式使用的方法replace()方法的作用replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。replace()的语法string.replace(regexp,replacement);第一个参数regexp为:声明了要替换的模式的RegExp对象(正则表达式)。第二个参数replacement为:一个字符串,声明的是替换文本或生成替换文本的函数,比如声明为",",那么匹配到的字符会被替换为","replac原创 2020-08-22 16:50:41 · 3229 阅读 · 0 评论 -
JS中的正则表达式概念以及部分使用方法
JS中的正则表达式正则表达式的作用是什么?正则表达式用于定义一些字符串的规则,计算机可以根据这个规则,来检查一个字符串是否符合规则,将字符串中符合规则的内容匹配出来。如何创建一个正则表达式?创建一个正则表达式有两种方式:一、构造函数方式例:var reg = new RegExp('\d', 'gim');通过 new 构造一个正则表达式对象,其中第一个参数 ‘\d’ 是正则内容,第二个参数 ‘gim’ 是修饰符。两个参数皆为字符串类型。修饰符的作用是对匹配过程进行限定。i表示对匹配的内容原创 2020-08-15 17:02:46 · 186 阅读 · 0 评论 -
JS中的isNaN()方法详解
JS中的isNaN()方法isNaN存在的意义由于NaN是唯一一个不等于自身的值,所以它不像其他值,可以用相等操作符来判断是否等于自身。比如undefined == undefined和undefined === undefined都会返回true,而NaN == NaN和NaN === NaN都会返回false,所以isNaN()就诞生了,那么它可以用来干什么呢?下面就来介绍一下它的作用:判断原理isNaN函数接受一个参数,原理是先尝试将参数转换为数值型,调用的是Number()方法,再进行判断原创 2020-08-15 16:17:26 · 3207 阅读 · 0 评论 -
JS中改变this指向的两种方法
JS中改变this指向的两种方法thisthis是javascript的一个关键字,随着函数使用场合不同,this的值会发生变化。但是总有一个原则,那就是this指的是调用函数的那个对象。this一般指向的是当前被调用者,但也可以通过其它方式来改变它的指向,下面将介绍两种改变this指向的方式:1.call()call(thisObj[, arg1[, arg2[, …]]])第一个参数就是要更改this指向的对象,为必选参数; 之后的参数要根据调用的函数是否需要传入参数(为可选的)例:原创 2020-08-09 21:36:24 · 1313 阅读 · 0 评论 -
分析JS中的闭包
JS中的闭包什么是闭包?我们都知道,js的作用域分两种,全局和局部,基于我们所熟悉的作用域链相关知识,我们知道在js作用域环境中访问变量的权利是由内向外的,内部作用域可以获得当前作用域下的变量并且可以获得当前包含当前作用域的外层作用域下的变量,而外层作用域下无法获取内层作用域下的变量,同样在不同的函数作用域中也是不能相互访问彼此变量的,那么我们想在一个函数内部也有限权访问另一个函数内部的变量该怎么办呢?闭包就是用来解决这一需求的,我理解闭包的本质就是在一个函数内部创建另一个函数。从而达到能够读取其他函数原创 2020-08-09 14:23:47 · 104 阅读 · 0 评论 -
JS中的立即执行函数实现方法以及使用
JS中的立即执行函数为什么要使用立即函数?很多时候我们在js中定义一个函数后,只需要执行该函数一次,比如数据初始化函数。这种情况下,定义一个函数就会浪费内存空间,这是我们可以使用立即执行函数。立即函数是什么?如果书写一个函数表达式,然后将其立即调用,则该函数称之为立即执行函数 。立即函数的写法:立即函数通常有两种写法:例://第一种写法(function(){})();//第二种写法(function(){}());//错误的写法function (){}(); 第三种写法报错原创 2020-08-02 18:43:46 · 427 阅读 · 0 评论 -
JS数组中增和删的部分方法
JS数组中增和删的部分方法数组是什么?数组(Array)是按次序排列的一组值。其中每一个值都有一个下标(下标默认从0开始)。当我们存储一系列值的时候,通常情况下都会使用数组,这样无论是从存储还是从查询获取等方面都很便捷。这就是对数组的定义 ,那么下面我们来介绍数组中一些实现增删的方法。一、增1.push()可接收任意数量的参数,把它们按添加顺序添加至数组末尾,并返回修改后数组的长度。例:var arr1 = [];var arr2 = arr1.push(1);//添加元素1 设置一个变量来原创 2020-08-02 18:06:59 · 312 阅读 · 0 评论 -
JS数组的基础
JS数组的基础用法数组是什么?数组(Array)是按次序 排列的一组值。其中每一个值都有一个下标(下标默认从0开始)。当我们存储一系列值的时候,通常情况下都会使用数组,这样无论是从存储还是从查询获取等方面都很便捷。如何创建一个数组?方法有两种例:var arr1 = [1,2,3]; //字面量方式var arr2 = new Array(1,2,3) //构造函数方式注意:当只有一个数据时,两种创建方式的不同。例:var arr1 = [5]原创 2020-07-26 21:32:37 · 101 阅读 · 0 评论 -
JS逻辑运算符的与,或,非
JS-逻辑运算符的与,或,非1.逻辑非(!)定义:所谓非,就是取反,非真即假,非假即真。非运算符不仅仅只能用于布尔值,其他数据类型也是可以的,如下:1.如果操作数是一个对象,返回false2.如果操作数是一个空字符串,返回true3.如果操作数是一个非空字符串,返回false4.如果操作数是数值0,返回true5.如果操作数是任意非0数值(包括Infinity), 返回false6.如果操作数是null,返回true7.如果操作数是NaN,返回true8.如果操作数是undefined原创 2020-07-19 22:06:49 · 6589 阅读 · 0 评论 -
JS的语言特征
JS的语言特征前言JS是一种弱类型的,解释型的脚本语言弱类型和强类型弱类型?定义:在定义变量的时候,我们可以为变量赋值任何数据,变量的数据类型不是固定死的,这样的类型叫做弱类型。var a = 10;a = "abc";a = [];a = function(){};优点:弱类型使用简单,更灵活多变。缺点:因为不包含类型信息,所以在代码的上下文中,可能会进行隐含的类型转换,比如把字符串转整型,整型转字符串,这样会稍损性能,并且可能会不符合程序本意。注:(typescript可以稍原创 2020-07-19 21:28:28 · 486 阅读 · 0 评论 -
JS函数的理解和使用
JS函数的理解和使用什么是函数?用来实现特定功能的, n条语句的封装体。只有函数类型的数据是可以执行的, 其它的都不可以。为什么要用函数?提高复用性便于阅读交流函数也是对象instanceof Object===true;函数有属性::prototype函数有方法: call()/apply()可以添加新的属性/方法三种不同的函数一般函数 ::直接调用构造函数 :通过new调用对象:调用内部的属性/方法函数的作用域作用域是指变量存在的范围。Javascri原创 2020-07-26 20:46:48 · 158 阅读 · 0 评论