首页 > 编程知识 正文

2020年web前端面试题(一)-简书,web前端开发面试题及参考答案

时间:2023-05-06 03:28:01 阅读:226588 作者:3695

1、JavaScript数组的常用方法有哪些?

答:push、pop、shift、unshift、join、sort、concat、reverse、splice、slice、indexOf等

详细资料:

JavaScript数组的常用方法总结:遍历,复制,反转,排序,添加,删除(前端常见面试题必考必问_勤动手多动脑少说多做-CSDN博客_js数组倒序输出1. Array.push()向数组的末尾添加一个或多个元素,并返回新的数组长度。原数组改变。一个:var fruits = ["Banana", "Orange", "Apple", "Mango"];var x=fruits.push("Kiwi");console.log(fruits)//(5) ["Banana", "Orange", "Apple", "Mango", "Kiwi"] console.log(x)//5 x是 新的数组长度多个:var fruits =https://blog.csdn.net/qq_22182989/article/details/120995392 2、 js中null和undefined区别?


1. 相同点
  if 判断语句中,两者都会被转换为false

2. 不同点
Number转换的值不同,Number(null)输出为0, Number(undefined)输出为NaN

null表示一个值被定义了,但是这个值是空值
作为函数的参数,表示函数的参数不是对象

作为对象原型链的终点 (Object.getPrototypeOf(Object.prototype))

定义一个值为null是合理的,但定义为undefined不合理(var name = null)      
undefined表示缺少值,即此处应该有值,但是还没有定义
变量被声明了还没有赋值,就为undefined

调用函数时应该提供的参数还没有提供,该参数就等于undefined

对象没有赋值的属性,该属性的值就等于undefined

函数没有返回值,默认返回undefined


描述new操作符具体干了什么?


题目解析

先看代码

var Func=function(){
};
var func=new Func ();
new共经过了4几个阶段

1、创建一个空对象

varobj=new Object();
2、设置原型链

obj.__proto__= Func.prototype;
3、让Func中的this指向obj,并执行Func的函数体。

var result =Func.call(obj);
4、判断Func的返回值类型:

如果是值类型,返回obj。如果是引用类型,就返回这个引用类型的对象。

if (typeof(result) == "object"){
  func=result;
}
else{
    func=obj;;
}


js中apply和call的作用和区别是什么?


1、call,apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例(就是每个方法)都有call,apply属性。既然作为方法的属性,那它们的使用就当然是针对方法的了,这两个方法是容易混淆的,因为它们的作用一样,只是使用方式不同。

2、语法:foo.call(this, arg1,arg2,arg3) == foo.apply(this, arguments) == this.foo(arg1, arg2, arg3);

3、相同点:两个方法产生的作用是完全一样的。

4、不同点:方法传递的参数不同。



列举js中的性能优化的方案


包括:
页面级优化和代码级优化。然后细分
页面级优化:比如:
1.减少 HTTP请求数
2.将外部脚本置底(将脚本内容在页面信息内容加载后再加载)
3.异步执行 inline脚本(其实原理和上面是一样,保证脚本在页面内容后面加载。)
4. Lazy Load Javascript(只有在需要加载的时候加载,在一般情况下并不加载信息内容。)
5. 将 CSS放在 HEAD中
6. 异步请求 Callback(就是将一些行为样式提取出来,慢慢的加载信息的内容)
7. 减少不必要的 HTTP跳转
8. 避免重复的资源请求

代码级优化:比如:

js写法
CSS选择符
HTML
Image压缩
参考:

前端性能优化方案都有哪些? - coober - 博客园前端是庞大的,包括 HTML、 CSS、 Javascript、Image 、Flash等等各种各样的资源。前端优化是复杂的,针对方方面面的资源都有不同的方式。那么,前端优化的目的是什么 ? 1. 从https://www.cnblogs.com/coober/p/8078847.html

5.cookies、sessionStorage和localStorage解释及区别
参考:

cookie、sessionStorage和localStorage的区别_浮生离梦的博客-CSDN博客一、 概念的理解webstorage本地存储1)webstorage是本地存储,存储在客户端,包括localStorage和sessionStorage2)localStorage生命周期是永久,这意味着除非用户显示在浏览器提供的UI上清除localStorage信息,否则这些信息将永远存在。存放数据大小为一般为5MB,而且它仅在客户端(即浏览器)中保存,不参与和服务器的通信3)ses...https://blog.csdn.net/weixin_42614080/article/details/90706499/

7.js延迟加载的方式有哪些?


一般有以下几种方式:

defer 属性
async 属性
动态创建DOM方式
使用jQuery的getScript方法
使用setTimeout延迟方法
让JS最后加载
参考:

es6解构赋值是什么意思?let{a}=B出现的

关于let{a}=B出现的解构赋值_前人挖坑,后人种(pen)-CSDN博客_let {}https://blog.csdn.net/shb2058/article/details/86155830?spm=1001.2101.3001.6650.1&utm_medium=distribute.pc_relevant.none-task-blog-2~default~CTRLIST~default-1.opensearchhbase&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2~default~CTRLIST~default-1.opensearchhbase

url输入到页面显示全过程?

 浏览器渲染的整个流程

浏览器的整个流程如上图所示。

1、  首先当用户输入一个URL的时候,浏览器就会发送一个请求,请求URL对应的资源。

2、  然后浏览器的HTML解析器会将这个文件解析,并且构建成一棵DOM树。

3、  在构建DOM树的时候,遇到JS和CSS元素,HTML解析器就换将控制权转让给JS解析器或者是CSS解析器。

4、  JS解析器或者是CSS解析器解析完这个元素时候,HTML又继续解析下个元素,直到整棵DOM树构建完成。

5、  DOM树构建完之后,浏览器把DOM树中的一些不可视元素去掉,然后与CSSOM合成一棵render树。

6、  接着浏览器根据这棵render树,计算出各个节点(元素)在屏幕的位置。这个过程叫做layout,输出的是一棵layout树。

7、  最后浏览器根据这棵layout树,将页面渲染到屏幕上去。
 

资料:

前端必会!四步带你吃透浏览器渲染基本原理_CSDN资讯-CSDN博客作者 |SHERlocked93责编 | 顺利的鱼大多数设备的刷新频率是60Hz,也就说是浏览器对每一帧画面的渲染工作要在16ms内完成,超出这个时间,页面的渲染就会出现卡顿现象,影响用户体验。前端的用户体验给了前端直观的印象,因此对B/S架构的开发人员来说,熟悉浏览器的内部执行原理显得尤为重要。浏览器主要组成与浏览器线程1.1 浏览器组件浏览器大体上由...https://blog.csdn.net/csdnnews/article/details/95267307

前端面试-浏览器渲染机制_C7-CSDN博客在开发WEB应用整一个流程中,用户体验通常都会被提及,而网站的性能,又是与用户体验直接挂钩,因此可以在项目需求规格文档中经常看到项目对性能的需求。WEB性能优化常见的入手点包括以下几点:1、  HTTP请求2、  服务器响应速度3、  浏览器响应速度其中浏览器响应速度包括渲染速度和代码执行的速度。而本篇文章的目标主要集中在第三点,先整体了解一下浏览器的渲染机制,再通过这个机https://blog.csdn.net/cde7070/article/details/50619853

 

 

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。