草庐IT

2023高频前端面试题(持续更新 含答案)

吃土豆的程序猿 2023-04-03 原文

1,es6有哪些新特性?

ES6是2015年推出的一个新的版本、这个版本相对于ES5的语法做了很多的优化

let和const具有块级作用域,不存在变量提升的问题。新增了箭头函数,简化了定义函数的写法,同时
可以巧用箭头函数的this、(注意箭头函数本身没有this,它的this取决于外部的环境),新增了promise,解决了回调地域的问题,新增了模块化、利用import 、export来实现导入、导出。新增了结构赋值,ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构
(Destructuring)。新增了class类的概念,它类似于对象。

1-1,let声明变量和var一样,但是let不存在变量提升,存在块级作用域,块级作用域---很适合用在for循环中,使用let时for循环每循环一次就是一个单独的变量i只在当前花括内生效,而且不会泄露成全局的i,不能重复声明,不存在变量提升

1-2,const-声明常量,只要声明就必须初始化,不能重复声明,不存在变量提升,const只要声明就必须初始化

1-3,新增了箭头函数,简化了定义函数的写法,同时可以巧用箭头函数的this、(注意箭头函数本身没有this,它的this取决于外部的环境)

箭头函数和普通函数的区别:

  • this指向不同,因为箭头函数中没有this

  • 箭头函数不能使用arguments

  • 书写方式,箭头函数使用(=>)箭头定义函数

  • 箭头函数可以省略return

  • 箭头函数都是匿名函数

  • 箭头函数不能用于构造函数,不能使用new

  • call apply bind改变不了this指向

1-4,symbol

新增的数据类型,第七种数据类型,原始数据类型,表示独一无二的值

let sy=Symbol()
console.log(typeof sy);
// 数值是由symbol函数生成的,不能使用new
// 可以接受参数,用来描述数据
let sy=Symbol('a')
let sy1=Symbol('a')
console.log( sy===sy1);

1-5,集合-set

新增的数据结构 类似于数组,成员是不重复的,只有一个,可以接收参数,可以接收数组或者iteration接口的数据

// 可以去重
let s=new Set()
var arr=[1,2,3,1,2,3]
 arr.forEach(item=>{
    s.add(item)
})
console.log(s);
let s=new Set('aasdasd')
let s1=new Set(document.querySelectorAll('li'))
console.log(s1);

属性:

  • set.prototype.size :长度

  • set.prototype.constructor:指向构造函数

数据:

  • set.prototype.add(value)添加数据

  • set.prototype.delete(value)删除数据

  • set.prototype.has(value)检测数据是否存在,返回时布尔值

  • set.prototype.clear()将数据清空

遍历器:

  • set.prototype.keys()遍历属性名(键名)遍历器

  • set.prototype.values()遍历属性值(键值)遍历器

  • set.prototype.entries()遍历键值对的遍历器

  • forEach()遍历

1-6,map

类似对象 键值对的形式存在,不限制数据类型作为属性名,值---值

let m=new Map()
m.set(1,{name:'1'})
m.set([1,2,3],1)
console.log(m.get());

1-7,解构赋值

按照一定模式匹配相应的数据

数组的结构

var arr=[1,2,3]
var [a,b,c]=arr 
console.log(a,b,c)//1,2,3
//相当于:
[a,b,c]=[1,2,3]

对象的结构

var obj={
name:'zhang',
age:'19',
set:{
name:'lisi'
}
}
var {name:bar,age:a,set:{name:baz}}=obj
console.log(baz);

函数的解构赋值

// 参数的解构赋值
function fun([x,y],b,a,c){
    console.log(x,y);
}
fun([1,2],10,20)

1-8,严格模式

对代码进行限制规范,严格模式和普通没有区别

// 注意:- 将严格模式的语句放到代码的第一行
//       - ie 6 7 8 9不支持严格模式 

'use strict' // 全局开启

function fn() {
    'use strict' // 某个函数开启

}
  • 全局变量必须声明

  • 禁止使用 with

  • 创建 eval 作用域

  • 禁止 this 指向全局作用域

  • 函数参数不能重名

1-9, promise

异步编程的方式,可以解决回调地狱的问题

特点:有三个状态 pending(正在进行) fulfilled(已经成功)

rejected (已经失败)

结果只有两种可能:pending(正在进行)到 fulfilled(已经成功) --成功---resolve

pending(正在进行)到 rejected (已经失败)---失败---reject

接收一个回调函数 里面有两个参数

const p = new Promise(function (resolve, reject) {
setTimeout(function () {
    resolve(100)
}, 1000)

})
p.then(function(value){
console.log(value);
},function(error){
console.log(error);
})

catch

用来捕获失败,相当于then(undefined,function())或者then(null,function())

promise的状态不会一经确定就不会改变了

2,什么是递归,递归有哪些优点或缺点?

递归函数 -- 高阶函数

如果一个函数,是自己调用自己(直接调用或者间接调用) 这个函数就是递归

简单理解:函数内部自己调用自己, 这个函数就是递归函数

适合大量数据或者数据的反复计算

注意:必须有一个结束条件,结束了,才有结果

 function getSty(a){
     getSty([]) 
} 

优点:结构清晰、可读性强

缺点:效率低、调用栈可能会溢出,其实每一次函数调用会在内存栈中分配空间,而每个进程的栈的容

量是有限的,当调用的层次太多时,就会超出栈的容量,从而导致栈溢出。

3,谈谈你平时都用了哪些方法进行性能优化?

减少http请求次数、打包压缩上线代码、使用懒加载、使用雪碧图、动态渲染组件、CDN加载包。

4,什么是闭包?手写一个闭包函数? 闭包有哪些优缺点?

闭包指有权访问另一个函数作用域中变量的函数。简单理解就是 ,一个作用

域可以访问另外一个函数内部的局部变量。

function fn() {
var num = 10;
function fun() {
console.log(num); 
 }
return fun;
}
var f = fn(); 
f();

作用延长变量作用域、在函数的外部可以访问函数内部的局部变量,容易造成内层泄露,因为闭包中

的局部变量永远不会被回收

优点

1:变量长期驻扎在内存中;

2:避免全局变量的污染;

3:私有成员的存在 ;

缺点

会造成内存泄露

5,v-for 循环为什么一定要绑定key ?

页面上的标签都对应具体的虚拟dom对象(虚拟dom就是js对象), 循环中 ,如果没有唯一key , 页面上删除一条标签, 由于并不知道删除的是那一条,所以要把全部虚拟dom重新渲染, 如果知道key为x标签被删除掉, 只需要把渲染的dom为x的标签去掉即可

6,Js 中常见的内存泄漏?

1.意外的全局变量

2.被遗忘的计时器或回调函数

3.脱离 DOM 的引用

4.闭包

7,Get 和 post 有什么区别?

Get 是从服务器上获取数据,post 是向服务器传送数据

在客户端,get 通过 url 提交数据,数据在 url 中可以看到,post 方式,

数据放在 html header 中提交

安全性问题 原则上post肯定要比get安全,毕竟传输参数时url不可见

Get 提交数据最多只能有 1024 字节,post 没有限制

有关2023高频前端面试题(持续更新 含答案)的更多相关文章

  1. ruby-on-rails - 如何验证 update_all 是否实际在 Rails 中更新 - 2

    给定这段代码defcreate@upgrades=User.update_all(["role=?","upgraded"],:id=>params[:upgrade])redirect_toadmin_upgrades_path,:notice=>"Successfullyupgradeduser."end我如何在该操作中实际验证它们是否已保存或未重定向到适当的页面和消息? 最佳答案 在Rails3中,update_all不返回任何有意义的信息,除了已更新的记录数(这可能取决于您的DBMS是否返回该信息)。http://ar.ru

  2. ruby-on-rails - 使用 rails 4 设计而不更新用户 - 2

    我将应用程序升级到Rails4,一切正常。我可以登录并转到我的编辑页面。也更新了观点。使用标准View时,用户会更新。但是当我添加例如字段:name时,它​​不会在表单中更新。使用devise3.1.1和gem'protected_attributes'我需要在设备或数据库上运行某种更新命令吗?我也搜索过这个地方,找到了许多不同的解决方案,但没有一个会更新我的用户字段。我没有添加任何自定义字段。 最佳答案 如果您想允许额外的参数,您可以在ApplicationController中使用beforefilter,因为Rails4将参数

  3. 华为OD机试用Python实现 -【明明的随机数】 2023Q1A - 2

    华为OD机试题本篇题目:明明的随机数题目输入描述输出描述:示例1输入输出说明代码编写思路最近更新的博客华为od2023|什么是华为od,od薪资待遇,od机试题清单华为OD机试真题大全,用Python解华为机试题|机试宝典【华为OD机试】全流程解析+经验分享,题型分享,防作弊指南华为o

  4. jenkins部署1--jenkins+gitee持续集成 - 2

    前置步骤我们都操作完了,这篇开始介绍jenkins的集成。话不多说,看操作1、登录进入jenkins后会让你选择安装插件,选择第一个默认的就行。安装完成后设置账号密码,重新登录。2、配置JDK和Git都需要执行路径,所以需要先把执行路径找到,先进入服务器的docker容器,2.1JDK的路径root@69eef9ee86cf:/usr/bin#echo$JAVA_HOME/usr/local/openjdk-82.2Git的路径root@69eef9ee86cf:/#whichgit/usr/bin/git3、先配置JDK和Git。点击:ManageJenkins>>GlobalToolCon

  5. Hive SQL 五大经典面试题 - 2

    目录第1题连续问题分析:解法:第2题分组问题分析:解法:第3题间隔连续问题分析:解法:第4题打折日期交叉问题分析:解法:第5题同时在线问题分析:解法:第1题连续问题如下数据为蚂蚁森林中用户领取的减少碳排放量iddtlowcarbon10012021-12-1212310022021-12-124510012021-12-134310012021-12-134510012021-12-132310022021-12-144510012021-12-1423010022021-12-154510012021-12-1523.......找出连续3天及以上减少碳排放量在100以上的用户分析:遇到这类

  6. objective-c - 在设置 Cocoa Pods 和安装 Ruby 更新时出错 - 2

    我正在尝试为我的iOS应用程序设置cocoapods但是当我执行命令时:sudogemupdate--system我收到错误消息:当前已安装最新版本。中止。当我进入cocoapods的下一步时:sudogeminstallcocoapods我在MacOS10.8.5上遇到错误:ERROR:Errorinstallingcocoapods:cocoapods-trunkrequiresRubyversion>=2.0.0.我在MacOS10.9.4上尝试了同样的操作,但出现错误:ERROR:Couldnotfindavalidgem'cocoapods'(>=0),hereiswhy:U

  7. ruby-on-rails - Rails Associations 的更新方法是什么? - 2

    这太简单了,太荒谬了,我在任何地方都找不到关于它的任何信息,包括API文档和Rails源代码:我有一个:belongs_to关联,我开始理解当您没有关联时您在Controller中调用的正常模型方法与您有关联时调用的方法略有不同。例如,我的关联在创建Controller操作时运行良好:@user=current_user@building=Building.new(params[:building])respond_todo|format|if@user.buildings.create(params[:building])#etcetera但我找不到关于更新如何工作的文档:@user

  8. ruby-on-rails - OSX Yosemite 更新破坏了 pow.cx - 2

    升级到OSXYosemite后,我现有的pow.cx安装不起作用。升级到最新的pow.cx无效。通过事件监视器重新启动它也没有成功。 最佳答案 卸载(!)并重新安装解决了这个问题。curlget.pow.cx/uninstall.sh|shcurlget.pow.cx|sh 关于ruby-on-rails-OSXYosemite更新破坏了pow.cx,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/q

  9. ruby - 将 Gitlab 从 9.3.7 更新到 9.3.8 安装 re2 时出错 - 2

    我们在Ubuntu14.04和Gitlab9.3.7上运行,运行良好。我们正在尝试更新到Gitlabv9.3.8的最新安全补丁,但它给我们这个错误:Gem::Ext::BuildError:ERROR:Failedtobuildgemnativeextension.currentdirectory:/home/git/gitlab/vendor/bundle/ruby/2.3.0/gems/re2-1.0.0/ext/re2/usr/local/bin/ruby-r./siteconf20170720-19622-15i0edf.rbextconf.rbcheckingformain(

  10. ruby - Sinatra session 未按预期持续 - 2

    我正在尝试使用Sinatra中的重定向和session在网站周围传递一些数据。这是一个简化的示例,使用PrettyPrint进行调试:require'pp'require'rubygems'require'sinatra'enable:sessionsget'/'dosession[:foo]='12345'puts'session1'ppsessionredirectto('/redir')endget'/redir'doputs'session2'ppsession'helloworld'end查看Thin的输出,我看到:>>Listeningon0.0.0.0:4567,CTRL

随机推荐