自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(21)
  • 收藏
  • 关注

原创 js继承有哪些方法

答案: 原型继承 构造继承 实例继承 call/apply继承(组合继承) ES6 使用class extends继承 详细解析:父类Animal//父类function Animal(name){ this.name = name; this.sum = function() { alert(this.name); }}Parent.prototype.age = 10; //给原型对象添加属.

2020-05-14 14:09:30 166

转载 前后端分离与前后端不分离的区别

前后端不分离 在前后端不分离的应用模式中,前端页面看到的效果都是由后端控制,由后端渲染页面或重定向,也就是后端需要控制前端的展示,前端与后端的耦合度很高。请求的数据交互如下图:前后端分离在前后端分离的应用模式中,后端仅返回前端所需的数据,不再渲染HTML页面,不再控制前端的效果。至于前端用户看到什么效果,从后端请求的数据如何加载到前端中,都由前端自己决定,网页有网页的处理方式,App有App的处理方式,但无论哪种前端,所需的数据基本相同,后端仅需开发一套逻辑对外提供数据即可。...

2020-05-26 22:32:56 1452

原创 for in与for of用法及区别

for in遍历的是数组的索引(即键名),而for of遍历的是数组元素值。for-in总是得到对象的key或数组、字符串的下标。for-of总是得到对象的value或数组、字符串的值,另外还可以用于遍历Map和Set。var arr=[{name:'张三'},{name:'李四'}];for (var i in arr){ console.log(i)}for (var i of arr){ console.log(i)}结果:...

2020-05-26 19:18:47 1049

原创 EventLoop

答案:了解几个概念:调用栈、同步/异步任务、宏任务/微任务JavaScript本身是单线程,也就是同一时刻只能干一件事,JS任务包含了同步任务和异步任务,遇到执行函数会将其放入调用栈(先进后出)中,遇到setTimeout/setInterval等异步任务时,会把它放入到消息队列中,等主线程的任务执行完成以后,再回过头执行消息队列中的异步任务,如果异步任务中仍然有异步任务,会继续放入消息队列,以此类推,便形成了一个事件循环。异步任务: setTimeout setInterv

2020-05-22 09:10:41 256

转载 观察者和发布订阅者区别

答案:他们都属于观察者模式,只不过有不同的实现方法。发布订阅相比于观察者多了一个调度中心,发布者通过调度中心向订阅者发布消息。观察者模式中目标和观察者相互依赖,观察者订阅目标主题,当目标发生变化后,会通知对应观察者。详细解析:设计模式的定义是:在面向对象软件设计过程中针对特定问题的一种解决方案。设计模式并不直接用来完成代码的编写,而是描述在各种不同情况下,要怎么解决问题的一种方案,他不是一个死的机制,他是一种思想,一种写代码的形式。观察者模式(Observer Pattern).

2020-05-20 10:39:20 665

原创 call/apply/bind作用和区别

答案:他们都可以改变函数的作用域。 call/apply 可以直接执行该函数,而 bind 不会立刻执行 fucntion.bind(thisArg, arg1, arg2, ...) call/apply 作用类似,都可以改变指针和执行函数,区别在于传参不同,call 需要单个传参,apply 通过数组传参 function.call(thisArg, arg1, arg2, ...)function.apply(thisArg, [arg1, arg2, ...]).

2020-05-19 14:06:29 2650 1

转载 DOM节点创建和修改有哪些常用API

答案:创建节点 createElement createTextNode createDocumentFragment(临时节点) 修改节点 appendChildparent.appendChild(child) insertBeforeparentNode.insertBefore(newNode,refNode); removeChildparent.removeChild(node) replaceChild 详细...

2020-05-18 11:10:08 456

原创 slice和splice区别

答案:slice表示截取,slice(start,end),不改变原数组,返回新数组。splice表示删除,splice(start,length,item),会改变原数组,从某个位置开始删除多个元素,并可以插入新的元素。详细解析:slice():从已有的数组中返回你选择的某段数组元素语法:arrayObject.slice(start,end)①:start表示从何处开始选取,end表示从何处开始结束选取,表示一个选取的范围②:start可以为负数,此时它规定从数组尾部开.

2020-05-17 13:24:14 1961 1

原创 数组有哪些常用方法

答案: push 末尾添加 pop 末尾删除 shift 首部删除 unshift 首部添加 concat 数组合并 join 数组元素 通过连接符 连接 reverse 数组反转 sort 数组排序 map/forEach/filter/indexOf/includes/slice/splice 详细解析:1. Array.push(),向数组的末尾添加一个或多个元素,并返回新的数组长度。原数组改变。.

2020-05-17 11:30:52 2300 1

原创 如何准确判断一个对象是数组

答案:Object.prototype.toString.call([]) 返回 "[object Array]"扩展答案 [].slice (能力判断 ) [] instanceof Array(类型判断) [].proto=== Array.prototype Array.isArray([]) 存在兼容问题 数组也是引用类型,通过 typeof 依然返回 object详细解析:背景 —— typeof {}和typeof []的结果都是o..

2020-05-16 11:17:46 517

原创 什么是深/浅拷贝,有哪些实现方式

答案:JS数据类型分为基本数据类型和引用数据类型,基本数据类型保存的是值,引用类型保存的是引用地址(this指针)。浅拷贝共用一个引用地址,深拷贝会创建新的内存地址。浅拷贝方法 直接对象复制 Object.assign 深拷贝 JSON.stringify转为字符串再JSON.parse 深度递归遍历 详细解析:基本数据类型:string、number、boolean、undefined、null引用数据类型:object、array、funct.

2020-05-15 14:41:18 1345 2

原创 如何理解JS中的闭包及其优缺点

答案:简单理解就是函数中嵌套函数。我们都知道局部变量我们是无法访问的,但是通过闭包可以做到。// 正常访问var lan = 'zh';function hello(){ var name = '前端';}console.log(name) //很明显'undefined'// 换成闭包function hello(){ var name = '前端'; function demo(){ console.log(name) //打印:前端 }

2020-05-13 14:13:53 639

原创 如何理解原型链

答案:每个函数都拥有一个prototype属性,每个函数实例对象都拥有一个__proto__属性,而这个属性指向了函数的prototype,当我们访问实例对象的属性或者方法时,会先从自身构造函数中查找,如果没有就通过__proto__去原型中查找,这个查找的过程我们称之为原型链。(跟作用域链有点像)// 定义动物 - 父类function Animal(){ this.age = 10; this.say = function(){ return 'hello t

2020-05-12 13:50:39 255

转载 如何理解作用域链

前沿知识:js代码执行前会创建上下文环境,这个上下文环境包含了变量、作用域链和this.答案:简单理解就是从当前环境向父级一层一层查找变量的过程称之为作用域链。varname='前端';functionhello(){console.log(name);}解释:当我们在函数hello里面打印name的时候,会先在hello作用域中查找,如果没有找到就去hello的父级作用域中查找。详细解析:一、作用域在 Javascript 中,作用域分为...

2020-05-11 10:26:48 633

原创 如何理解JS执行上下文

JavaScript执行上下文(context)主要指代码执行环境的抽象概念。执行上下文分为三种: 全局执行上下文 函数执行上下文 eval执行上下文 每一段js代码执行,都会先创建一个上下文环境。...

2020-05-10 21:42:48 659

原创 transition和animation的区别及详细解析

答案:他们虽然都可以做出动画效果,但是transition主要做简单的过渡效果,而animation可以做复杂的动画效果,在语法和用法上有非常大的区别。transition是过渡属性,强调过渡,他的实现需要触发一个事件(比如鼠标移动上去,焦点,点击等)才执行动画,过渡只有一组(两个:开始-结束)关键帧。animation是动画属性,他的实现不需要触发事件,设定好时间之后可以自己执行,且...

2020-05-08 14:13:11 5312

原创 w3c标准盒子模型和IE盒子模型

答案:盒模型分为:IE盒模型 和 标准w3c盒模型w3c标准盒子模型:宽度 = 内容宽度(content)+ padding + border + margin低版本IE盒子模型:宽度 = 内容宽度(content + padding + border)+ margin注意:IE盒模型的内容宽度包含了padding和border,w3c盒模型宽度就是内容宽度。详细解析:...

2020-05-07 12:39:21 639

转载 ES6数组遍历之forEach,map和filter

循环数组,通常使用的是for循环,去循环数组的下标,而在ES6中提供了一种新的方式进行遍历数组!在看这个之前我们先对比一下之前的遍历方式let phone = ['小米','三星','苹果','一加','乐视','OPPO','VIVO','魅族','联想'];for(var i=0; i<=phone.length; i++){ console.log(phone[i])...

2020-05-06 14:19:50 1449

原创 CSS实现三列布局的3种方法及解析

CSS浮动 第一个float:left,第二个float:right,第三个设置margin-left和margin-right 绝对定位法 第一个定位到left,第二个定位到right,第三个设置margin-left和margin-right flex布局 .left{ width:200px; 或者 flex:0 0 200px;}.right{...

2020-05-05 13:08:48 3734

原创 CSS选择器优先级及解析

答案:!important > 内联样式(style) > ID选择器 > 类/属性/伪类 > 元素/关系详细解析:

2020-05-03 23:20:07 212

原创 CSS清除浮动4种方法及详细解析

问题所在:子盒子浮动导致父盒子的内高度为0,父级盒子不能被撑开,发生高度坍塌的情况。如下图所示:答案:1. 给父级元素设置合适的高度,手动撑开2. 给父元素添加样式 overflow:hidden/auto (这个属性相当于触发BFC,让父级紧贴内容,包括使用了浮动的盒子)3. 在浮动元素结尾增加空的div盒子,添加样式 clear:both4. 给父元素添加伪类 :aft...

2020-05-02 23:22:37 425

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除