![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JavaScript
文章平均质量分 60
友人C君~
这个作者很懒,什么都没留下…
展开
-
判断JS数据类型的四种方法
在 ECMAScript 规范中,共定义了 7 种数据类型,分为 基本类型 和 引用类型 两大类,如下所示:基本类型:String、Number、Boolean、Symbol、Undefined、Null引用类型:Object基本类型也称为简单类型,由于其占据空间固定,是简单的数据段,为了便于提升变量查询速度,将其存储在栈中,即按值访问。引用类型也称为复杂类型,由于其值的大小...原创 2019-06-08 13:37:37 · 714 阅读 · 1 评论 -
ES5继承和ES6继承及其区别
ES5继承分别有以下几种原型链继承通过将对象的__proto__指向被继承构造函数的protopyte,使得新的对象在寻找属性和方法的时候能够通过__proto__向上查找原型链,用于定义实例间共享的属性或方法。这种方案最大问题就是子类无法通过父类创建私有属性。// 示例:function Parent() { this.name = ['写代码像蔡徐抻'] }Parent.prototype.getName = function() { return this.name.原创 2021-06-28 23:46:46 · 605 阅读 · 1 评论 -
手写JS代码
bind的实现Function.prototype.myCall = function(context,...args){ const ctx= context || window; // 需要绑定到的上下文环境,无则默认为window const func = Symbol(); // 使用Symbol定义,避免重复key值 ctx[func] = this; // 此时this为传入的待执行的函数,使用对象属性的方式存储起来 // 通过执行对象的函数,使得t原创 2021-05-30 14:46:06 · 374 阅读 · 0 评论 -
手写实现Promise
从一道让我失眠的 Promise 面试题开始,深入分析 Promise 实现细节转载 2021-04-12 20:06:14 · 220 阅读 · 0 评论 -
JS 实用代码片段
如何获取当前页面的滚动位置? constgetScrollPosition=(el=window)=>({ x:el.pageXOffset!==undefined?el.pageXOffset:el.scrollLeft, y:el.pageYOffset!==undefined?el.pageYOffset:el.scrollTop});//ExamplegetScrollPosition();/...原创 2021-01-26 10:20:46 · 175 阅读 · 0 评论 -
JS高阶函数(函数柯里化)
函数柯里化的好处有三个:可以将函数作为参数传递 (用于参数复用) 可以将函数作为返回值输出 (提前返回) 函数的延迟计算 (使用较少)缺点:【通用函数】解决了兼容性问题,但同时也会再来,使用的不便利性,不同的应用场景往,要传递很多参数,以达到解决特定问题的目的。有时候应用中,同一种规则可能会反复使用,这就可能会造成代码的重复性。总结:说白了柯里化就是用到了很多闭包,递归,参数展...原创 2020-04-30 12:25:23 · 1414 阅读 · 0 评论 -
JS排序算法
冒泡排序使用两重for循环,将数组中的元素进行逐个两两对比,第一重for循环用于次数统计,一共要循环arr.length-1次,第二重for循环用于元素两两比较,一共需要进行arr.length - i -1 次,其中, -i,因为之前排序好的元素(一轮比较下来最大或最小的元素)会放在数组的最末尾,因此不必比较 已排好的 i个,-1是因为在循环内取值是取 j和j+1项进行比较,因此需要-1不让...原创 2020-02-22 21:29:04 · 185 阅读 · 0 评论 -
JavaScript中函数参数的值传递和引用传递
JavaScript中函数参数的值传递和引用传递结论:对于数字、字符串等是将它们的值传递给了函数参数,函数参数的改变不会影响函数外部的变量。对于数组和对象等是将对象(数组)的变量的值传递给了函数参数,这个变量保存的指向对象(数组)的地址。当函数改变这个地址指向的对象(数组)的内容时,同时也改变了函数外部变量指向的对象(数组)的内容;当函数改变的是变量的地址时,实际就与函数外部的变量失去了...转载 2019-02-05 21:56:51 · 206 阅读 · 0 评论 -
js对象中属性名加引号和不加引号的区别
一般情况下属性名加引号和不加引号是都可以的,效果是一样的,比如下面age属性加不加引号都可以访问到的:#但是,不符合规范的属性名必须要加引号1.比如以数字打头的属性名:var obj = { name: 'wozien', 53age: 16}在chrome中会报错:2.数字开头的属性必须用obj[ ]方括号进行访问,如下:var obj = { n...原创 2019-01-27 22:39:14 · 3162 阅读 · 0 评论 -
JS事件循环——宏任务和微任务
首先说说结论,对于面试题和日常工作而言,常用的就是对 Promise 和 async/await 的使用了,尤其是面试题,更是会用各种组合来考验你对宏任务微任务的执行顺序。结论:执行完一个宏任务然后会将微任务队列的所有微任务执行完,然后再去异步定时器队列 去执行里面的定时器任务(即使定时器里有微任务,如then回调和async/await函数等)。 当Promise有多个then回...原创 2019-12-04 17:13:50 · 2192 阅读 · 1 评论 -
javascript防止全局变量污染和创建局部作用域的方式
防止局部变量污染:使用立即执行函数 使用闭包 创建对象,并把所有属性和函数封装到该命名空间下创建局部作用域:使用立即执行函数 function函数作用域 es6中的let创建变量...原创 2019-05-19 11:39:46 · 508 阅读 · 0 评论 -
javascript中字符串的操作方法汇总
var str="我是字符串abc ";console.log(str.charAt(0));//我 访问指定下标的字符console.log(str.charCodeAt(5));//97 访问指定下标的字符编码console.log(str.concat(str2="我是str2"));//我是字符串abc 我是str2 字符串拼接console.log(st...原创 2019-05-19 17:16:07 · 202 阅读 · 0 评论 -
javascript创建对象的方式(面试)
工厂模式:抽象了创建具体对象的过程,用函数来封装创建对象的细节。缺点:虽然方便了创建多个对象的问题,但却没有解决对象识别的问题。(无法知道一个对象的类型,都是Object类型)(js 工厂模式里面,所有的函数都只是Object的实例,这样的判断没有多大的意义; 而在构造函数里面,构造出来的函数不仅是Object的实例,也是构造函数的实例,而构造函数是我们自己定义的,相当于我们自己定义了...原创 2019-05-19 21:46:58 · 364 阅读 · 0 评论 -
原生js判断所包含的class值(转载)
【注意】以下方法只对class只有一个值的情况下操作*************************************************************结构部分:<div><p>1</p><p class="test">2</p><p>3</p><...转载 2019-05-11 10:28:56 · 1131 阅读 · 0 评论 -
javascript 参数按值传递的理解(转载)
定义在《JavaScript高级程序设计》第三版 4.1.3,讲到传递参数:ECMAScript中所有函数的参数都是按值传递的。什么是按值传递呢?也就是说,把函数外部的值复制给函数内部的参数,就和把值从一个变量复制到另一个变量一样。按值传递举个简单的例子:var value = 1;function foo(v) { v = 2; conso...转载 2019-06-06 17:27:07 · 300 阅读 · 0 评论 -
web前端的一道面试题
最近,有一道JavaScript面试题挺流行的,很多朋友去面试的时候都遇到了。这道题目大致是这个样子的:以下这段代码执行后,结果为什么不是依次输出0到9?如果要让它实现这样的输出,你会怎么来修改这段代码?for (var i = 0 ; i < 10; i++) { setTimeout(function () { console.log(i) })}那让...转载 2019-03-26 21:48:38 · 223 阅读 · 0 评论 -
javascript闭包和立即执行函数的关系(转载)
一直没搞清楚立即执行函数和闭包之间的关系,总结一下:闭包有很多种理解:访问不到内部作用域,函数就是这样,所以函数就是闭包; 闭包还有一种理解:通过把函数内部的变量和方法返回出来,这样外部作用域就可以访问内部作用域了 立即执行函数和闭包之间没有必然的联系,虽然它们经常结合一起使用; 立即执行函数只是一种函数的调用方式; 闭包的目的则是外部函数可以访问内部函数的作用域;立即执行函数(I...转载 2019-05-19 11:19:45 · 418 阅读 · 0 评论 -
javascript中作用域链和原型链的区别(转载)
作用域是针对变量的,比如我们创建了一个函数,函数里面又包含了一个函数,那么现在就有三个作用域 函数2作用域==>函数1作用域==>全局作用域作用域的特点就是,先在自己的变量范围中查找,如果找不到,就会沿着作用域往上找。如:var a = 1;function b(){ var a = 2; function c(){ var a =...转载 2019-05-19 10:26:16 · 413 阅读 · 0 评论 -
JSON用法
JSON规则1) 并列的数据之间用逗号(", ")分隔。2) 映射用冒号(": ")表示。3) 并列数据的集合(数组)用方括号("[]")表示。4) 映射的集合(对象)用大括号("{}")表示。<!DOCTYPE html><html><head><meta charset="utf-8"><title>J...原创 2019-05-06 21:37:51 · 163 阅读 · 0 评论 -
javascript的防抖和节流
防抖和节流是针对响应跟不上触发频率这类问题的两种解决方案。 在给DOM绑定事件时,有些事件我们是无法控制触发频率的。 如鼠标移动事件onmousemove, 滚动滚动条事件onscroll,窗口大小改变事件onresize,瞬间的操作都会导致这些事件会被高频触发。 如果事件的回调函数较为复杂,就会导致响应跟不上触发,出现页面卡顿,假死现象。 在实时检查输入时,如果我们绑定onkeyup事件发请求去...原创 2019-04-30 20:11:17 · 298 阅读 · 0 评论 -
转载——前端面试JS方法的各种实现代码
原文地址:http://caibaojian.com/js-interview-methods.html1.bind(改正)Function.prototype.bind2 = function () { var self = this,args = arguments; return function () { self.apply(args); ...转载 2019-04-29 18:10:32 · 122 阅读 · 0 评论 -
javascript创建对象的方式
1、标准创建对象模式var person = new Object();person.name = "Nicholas";person.age = 29;person.job = "Software Engineer";person.sayName = function(){alert(this.name);};2、字面量模式var person = { na...转载 2019-04-23 20:30:38 · 90 阅读 · 0 评论 -
javascript继承的方式(面试)
原型链继承基本思想就是利用原型让一个引用类型继承另一个引用类型的属性和函数(包括实例属性,函数和原型对象)。function Animal () { this.superType = 'Animal'; this.superSpeak=function(){ console.log('实例上的animal'); };}Animal.proto...原创 2019-05-21 16:32:56 · 347 阅读 · 0 评论 -
javascript中undefined和null的区别
目前,null和undefined基本是同义的,只有一些细微的差别。 null表示"没有对象",即该处不应该有值。典型用法是: (1) 作为函数的参数,表示该函数的参数不是对象。 (2) 作为对象原型链的终点。Object.getPrototypeOf(Object.prototype)// null undefined表示"缺少值",就是此处应该有一个值,但是还没有...转载 2019-02-28 19:50:33 · 141 阅读 · 0 评论 -
event对象中 target和currentTarget 属性的区别(转载)
首先本质区别是: event.target返回触发事件的元素 event.currentTarget返回绑定事件的元素 举个例子: 1 <ul id="ul">ul 2 <li>li<a href="">a</a></li> 3 <li>li&l...转载 2019-08-25 23:34:32 · 443 阅读 · 0 评论 -
ES6 数组拓展 Array.from()和 Array.of()函数(转)
一、 Array.from() : 将伪数组对象或可遍历对象转换为真数组1.何为伪数组如果一个对象的所有键名都是正整数或零,并且有length属性,那么这个对象就很像数组,语法上称为“类似数组的对象”(array-like object),即为伪数组。var obj = {0: 'a',1: 'b',2: 'c',length: 3};obj[0] // 'a'obj[...转载 2019-08-03 17:59:46 · 335 阅读 · 0 评论 -
js的四种for循环(转)
https://blog.csdn.net/tivon_594/article/details/78740679总结:1、普通for循环写起来比较繁琐,要根据数据长度遍历,且如果是稀疏数组,会让for循环做很多无用的遍历。2、for in 循环,适合对象属性的遍历,当使用 for in 遍历数组时候,它不仅遍历数组中的元素,还会遍历自定义的属性,甚至原型链上的属性都被访问到。而且,遍历...转载 2019-08-03 17:23:55 · 466 阅读 · 0 评论 -
setTimeout模拟setInterval的原因及实现(转载)
一、简介setTimeout 延迟一段时间执行一次 (Only one);用clearTimeout()终止setTimeout(function(){··· }, n); // n毫秒后执行functionsetInterval 每隔一段时间执行一次 (Many times);用clearInterval()终止setInterval(function(){··· },...转载 2019-06-08 14:35:18 · 1409 阅读 · 0 评论 -
client和offsetWidth的区别(转载)
clientWidth和clientHeigh 、 clientTop和clientLeftclientWidth的实际宽度 clientWidth =width+左右paddingclientHeigh的实际高度 clientHeigh = height + 上下paddingclientTop的实际宽度 ...转载 2019-06-13 17:38:13 · 313 阅读 · 0 评论 -
原生javascript中的DOM操作合集(转载)(精华)
原生JS中DOM节点相关API合集节点属性Node.nodeName //返回节点名称,只读Node.nodeType //返回节点类型的常数值,只读Node.nodeValue //返回Text或Comment节点的文本值,只读Node.textContent //返回当前节点和它的所有后代节点的文本内容,可读写Node.baseURI //返回当前网页的绝对...转载 2019-06-07 15:43:32 · 388 阅读 · 0 评论 -
javascript深入学习this指向问题(精华)
this 的指向在 ES5 中,其实 this 的指向,始终坚持一个原理:this 永远指向最后调用它的那个对象,来,跟着我朗读三遍:this 永远指向最后调用它的那个对象,this 永远指向最后调用它的那个对象,this 永远指向最后调用它的那个对象。记住这句话,this 你已经了解一半了。下面我们来看一个最简单的例子:例 1: var name = "windowsNam...转载 2019-06-06 20:25:14 · 332 阅读 · 0 评论 -
javascript深入学习原型到原型链(精华)
构造函数创建对象我们先使用构造函数创建一个对象:function Person() {}var person = new Person();person.name = 'Kevin';console.log(person.name) // Kevin在这个例子中,Person 就是一个构造函数,我们使用 new 创建了一个实例对象 person。很简单吧,接下来进入正题...转载 2019-06-06 16:03:58 · 251 阅读 · 0 评论 -
javascript获取时间
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> </head> <script type="text/javascript" src="js/jquery-3.3.1.js"> </...原创 2019-06-06 10:23:00 · 150 阅读 · 0 评论 -
javascript闭包中的this指向问题
关于this对象,它是基于当前运行环境所绑定的var name="The Window";var object={ name:"The Object", getName:function(){ return function(){ return this.name; } }}console.log(ob...原创 2019-05-22 14:30:23 · 770 阅读 · 0 评论 -
CORS原理及详细使用(转载)
CORS:全称"跨域资源共享"(Cross-origin resource sharing)。CORS需要浏览器和服务器同时支持,才可以实现跨域请求,目前几乎所有浏览器都支持CORS,IE则不能低于IE10。CORS的整个过程都由浏览器自动完成,前端无需做任何设置,跟平时发送ajax请求并无差异。so,实现CORS的关键在于服务器,只要服务器实现CORS接口,就可以实现跨域通信。请求类型:...转载 2019-05-02 21:52:32 · 6346 阅读 · 0 评论 -
原生Ajax和jQuery版本的使用
XMLHttpRequest对象的常用方法和属性。 open(“method”,”URL”) 建立对服务器的调用,第一个参数是HTTP请求 方式可以为GET,POST或任何服务器所支持的您想调用的方式。第二个参数是请求页面的URL,第三个参数默认为true,传入false会使得请求变为同步阻塞模式。 send()方法,发送具体请求 abort()方法,停止当前请...原创 2019-05-02 17:01:23 · 732 阅读 · 0 评论 -
理解HTML语义化
1、什么是HTML语义化? 根据内容的结构化(内容语义化),选择合适的标签(代码语义化)便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析。2、为什么要语义化?为了在没有CSS的情况下,页面也能呈现出很好地内容结构、代码结构:为了裸奔时好看; 用户体验:例如title、alt用于解释名词或解释图片信息、label标签的活用; 有利于SEO:和搜索引擎...转载 2019-02-26 20:48:27 · 132 阅读 · 0 评论 -
cookies,sessionStorage 和 localStorage 的区别
cookie是网站为了标示用户身份而储存在用户本地终端(Client Side)上的数据(通常经过加密)。cookie数据始终在同源的http请求中携带(即使不需要),记会在浏览器和服务器间来回传递。sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存。存储大小:cookie数据大小不能超过4k。sessionStorage和l...原创 2019-03-02 21:19:46 · 217 阅读 · 0 评论 -
javascript中的call()与apply()
每个函数都包含两个非继承而来的方法:apply()和call()。;call与apply都属于Function.prototype的一个方法,所以每个function实例都有call、apply属性;作用call()方法和apply()方法的作用相同:改变this指向。区别他们的区别在于接收参数的方式不同:call():第一个参数是this值没有变化,变化的是其余参数都直接传递...原创 2019-03-02 15:58:55 · 453 阅读 · 0 评论 -
prototype和__proto__的区别
prototype和__proto__的关系是什么所有的对象都拥有__proto__属性,它指向Object.prototype(Object是一个原生函数,所有的对象都是Object的实例)let obj = {}obj.__proto__ === Object.prototype // true所有的函数都同时拥有__proto__和protytpe属性 函数的__proto...转载 2019-03-02 15:34:45 · 841 阅读 · 0 评论