
前端面试题
收集一些自己总结的前端面试问题。
Hell's Angel
一个前端工作者
展开
-
事件监听、事件模型
想了解更多 参照以下链接:事件监听:https://blog.youkuaiyun.com/weixin_40122996/article/details/82533223事件模型:https://www.cnblogs.com/hngdlxy143/p/9068282.html原创 2020-09-14 00:25:42 · 169 阅读 · 0 评论 -
面试题——js之垃圾回收、 内存泄漏
Javascript具有周期性的自动垃圾收集机制,执行环境会负责管理代码运行过程中使用的内存。常用的垃圾收集方式是 标记清除(mark-and-sweep)。当变量进入环境,就将这个变量标记为“进入环境”。离开环境就标记“离开环境”。工作流程:垃圾收集器在运行时给内存中的所有变量加上标记。去掉环境中的变量和被环境中的变量引用的变量标记。后来再加上的变量会被视为准备删除的变量。销毁带标记的值并回收他们所占用的空间。引用计数:不太常用的垃圾收集策略(reference counting)。原创 2020-09-13 22:08:39 · 291 阅读 · 0 评论 -
数组的扁平化
参考地址 https://www.cnblogs.com/wind-lanyan/p/9044130.html原创 2020-09-10 23:54:07 · 125 阅读 · 0 评论 -
数组去重的方法
一、利用es6 Set 方法去重:function unique (arr) { return Array.from(new Set(arr))}var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];console.log(unique(arr)) //[1, "true", true, 15原创 2020-09-09 20:27:36 · 207 阅读 · 0 评论 -
es6和es5相比新增哪些数组方法?
先看一下es5中的array方法把valuedesciptionevery()检测数值元素的每个元素是否都符合条件。some()检测数组元素中是否有元素符合指定条件filter()检测数值元素,并返回符合条件所有元素的数组。foreach()数组每个元素都执行一次回调函数。map()通过指定函数处理数组的每个元素,并返回处理后的数组。indexOf搜索数组中的元素,并返回它所在的位置。lastIndexOf搜索数组中的元素,并返回它最后原创 2020-09-08 23:37:20 · 225 阅读 · 0 评论 -
异步操作——async、await的用法
async:用于申明一个异步的function。await async和await的简称 用于等待一个异步函数的完成具体用法:async:在一个函数前面加上一个单词 async,这就把一个普通函数变成了异步函数。如://基本用法的async函数let asyncFun = async function(){ return 1}console.log(asyncFun())//会返回一个promise对象//使用场景//摇色子方法function dice(){ .原创 2020-09-06 20:54:40 · 675 阅读 · 0 评论 -
es6中的generator
说到 generator,其实就不得不说 iterator,iterator是什么?跟generator有什么关系?迭代器 (iterator):是一种特殊对象,它具有一些专门为迭代过程设计的专有接口,所有的迭代器对象都有一个next()方法,每次调用都返回一个结果对象。结果对象有两个属性:一个是value,表示下一个将要返回的值;另一个是done,它是一个布尔类型的值,当没有更多可返回数据时返回true。迭代器还会保存一个内部指针,用来指向当前集合中值的位置,每调用一次next()方法,都会返回下.原创 2020-09-06 20:49:10 · 215 阅读 · 0 评论 -
promise是什么?
promise: 是一个异步操作的对象 ,有三种状态:Pending(进行中)、Resolved(已完成)和Rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。状态的改变有两种情况:Pending->Resolved,Pending->Rejected。可以看到Promise是一个构造函数,他本身有 all, reject, resolve 方法,在他的原型上有 then, catch方法.Promise构造函数接受一个函数作为参数,原创 2020-09-06 16:15:58 · 312 阅读 · 0 评论 -
var let const的区别
首先想知道三者的区别,需要要对ECMAscript有一定了解。ECMAscript5.0中有 全局作用域和函数作用域,却没有块级作用域,于是es6中就引进了 let和const弥补了es5的不足。let:块级作用域暂时性死区变量不允许多次声明不存在变量提升/*for循环,for循环里面是父级作用域,循环体内是另一个*/for( let i = 0 ; i < 3 ; i++ ){ let i = 'abc' //用var替代let会报错提示已经定义,若没有任何关键字原创 2020-09-06 15:27:03 · 143 阅读 · 0 评论 -
vuex是什么?
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。与react中的redux类似,可以对组件的中的状态进行一个统一集中的管理。应用场景:登录注册、购物车、组件中复杂的逻辑。核心概念:state(唯一的状态管理对象)getters(计算属性,对state中的属性做进一步的处理)mutations(读写state)actions(触发mutations)modules(对以上属性的封装)state: { userinfo: [], token: '',原创 2020-09-03 23:56:51 · 169 阅读 · 0 评论 -
js继承,实现继承的几种方式
继承是javascript中一个重要的概念,实现继承有这几种常用的方式。首先定义一个父类:// 定义一个动物类function Animal (name) { // 属性 this.name = name || 'Animal'; // 实例方法 this.sleep = function(){ console.log(this.name + '正在睡觉!'); }}// 原型方法Animal.prototype.eat = function(food) { co原创 2020-09-02 23:32:46 · 247 阅读 · 0 评论 -
this, call,apply,bind三者的区别
参考 call apply bind的区别相同点:1、都是用来改变函数的this对象的指向的。2、第一个参数都是this要指向的对象。3、都可以利用后续参数传参。 var xw = { name : "小王", gender : "男", age : 24, say : function() {原创 2020-09-01 21:18:32 · 281 阅读 · 0 评论 -
判断javascript数据类型
javascript中有几种判断数据类型的基本方法:1、 typeof: 非常方便,应对一个变量是 字符串、数值、布尔值或是undefined完全没问题!但是当遇到 特殊值 null 的时候,无论什么都返回 object对象。并且 当typeof检测函数时 ,返回结果是function2、instanceof(基于原型链):可以检测引用数据类型。obj instanceof Object,左边操作数obj为对象(如果不小心写成基本类型 比如数字啥的,就会返回false),右边操作数Objec原创 2020-08-31 20:41:08 · 188 阅读 · 0 评论 -
js有哪些数据类型 ?如何判断?
在ECMAscript中数据类型大致分为两大类:分别是 基本数据类型、引用数据类型。基本数据类型指的是简单的数据段,引用数据类型指的是有多个值构成的对象。5种常见的基本数据类型:NumberSringBooleannullundefinedeg: let a=10 let b=a console.log(b) // b=10 基本数据类型是按值访问的,我们可以直接操作保存在变量中的值。变量的交换相当于在一个新的作用域开创一.原创 2020-08-31 20:39:16 · 359 阅读 · 0 评论 -
css flex 弹性盒布局
css flex 弹性盒布局:1、css弹性盒是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分配空白空间。弹性盒由弹性容器(flex-container)和弹性子元素(flex-item)构成。 弹性盒通过给父元素设置 display:flex 使之成为弹性盒容器。弹性盒有以下几个属性:设置在父元素上的属性:flex-direction(定义项目的排列方式原创 2020-08-27 13:59:31 · 140 阅读 · 0 评论 -
css怪异盒和标准盒模型
1、css怪异盒和标准盒模型w3c中定义的是标准盒模型,而IE中的是怪异盒模型标准盒模型 即 width=content width+padding+margin+border怪异盒模型 width=content width(padding+border)+margin图片元素的垂直对齐方式: 标准模式下: vertical-align的默认值是:baseline 怪异模式下:vertical-align的默认值则是bottomTable元素中的字体:原创 2020-08-27 14:49:16 · 191 阅读 · 0 评论 -
对面向对象和面向过程的理解
javascript中面向对象和面向过程的理解:面向对象就是一种以对象为中心的编程思想 特性是多态继承 抽象封装 *面向对象是把构成问题事务分解成各个对象,建立对象的目的不是为了完成一个步骤,而是为了描叙某个事物在整个解决问题的步骤中的行为。*面向过程 就是一种以事件为中心的编程思想 这些都是以正在发生的事情作为目标进行编程面向过程 就是分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现,使用的时候一个一个依次调用就可以了。...原创 2020-06-23 17:20:17 · 366 阅读 · 0 评论