目录
一、WebAPI
1.列举DOM元素增删改查API:
2.BOM中有哪些常用的对象?
3.列举几个常见的浏览器兼容问题?
4.什么是事件委托?
本应该注册给子元素的事件,注册给父元素。
5.事件委托的原理是什么?
事件冒泡,因为有事件冒泡的存在,所以子元素的事件会向外冒泡,触发父元素的相同事件,根据事件对象可以找到真正触发事件的事件源。
6.JavaScript有几种定时器,有什么区别?
7.DOM和BOM?
JavaScript基础分为三个部分:
-
ECMAScript:JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。
-
DOM:文档对象模型,操作网页上的元素的API。比如让盒子移动、变色、轮播图等。
-
BOM:浏览器对象模型,操作浏览器部分功能的API。比如让浏览器自动滚动。
二、JavaScript高级
1.什么是原型对象?
每一个构造函数都有一个prototype属性,这个属性的值是一个对象,这个对象就叫做构造函数的原型对象,一般建议将构造函数的成员属性绑定在原型对象prototype上,因为原型对象prototype身上的属性默认可以通过实例对象访问到,这样可以保证在每次通过new关键字创建实例对象的时候,这些方法不会被重复在内存中创建。
2.什么是原型链?
实例对象和原型对象之间的关系叫做原型链,这个关系通过--proto--联系。
每个构造函数都有一个prototype属性,即原型对象,通过实例对象的--proto--属性也可以访问原型对象;而原型对象本身也是一个对象,是对象就有自己的原型对象,最终形成的链状结构称为原型链。
3.什么是构造函数?
构造函数本身也是函数,只不过这个函数在定义的时候首字母一般需要大写,构造函数在调用的时候必须通过一个new关键字来调用,一般不直接使用构造函数,而是通过构造函数创建实例对象。构造函数时js面向对象的一个重要组成部分。
4.js中实现继承的方式?
ES6之前官方并没有提供一种实现继承的方法,所以大部分继承方式都是程序员通过代码在模拟,常见的继承方式有:
借用构造函数继承:
组合继承
ES6之后通过extends关键字实现继承:
5.什么是闭包,有什么作用,使用时候要注意哪些问题?
闭包是一个跟函数有关的概念,表现形式是一个父函数内部,嵌套了一个子函数,子函数可以直接或间接的被返回给外部作用域,并且子函数中会使用到父函数局部作用域中的变量,当我们在外面调用这个函数时,就会发生闭包现象。
闭包的作用:闭包可以延展一个函数的作用域,缓存数据,延长作用域链,缺点就是没有及时释放
注意:不能滥用闭包,会导致内存泄露
6.什么是内存泄露,哪些操作会引起内存泄漏?
内存泄漏是指本应该被垃圾回收机制回收的内存空间由于某种特殊原因没有即使被回收,称之为内存泄露。
滥用全局变量和滥用闭包都会导致内存泄漏。
7.什么是预解析?
JS代码在执行之这桑·前,解析引擎会对代码进行一个预先的检查,主要会对变量和函数的声明进行提升,将变量和函数的声明提升到代码的最前面,变量只提升声明,不提升赋值。
8.说说对this关键字的理解?
this在不同场景下指向不太一样,主要分为以下几种情况:
9.call/apply/bind的区别?
相同点:
这三个方法都是函数这个特殊对象的方法,通过这三个方法可以改变this的指向。
不同点:
apply和call会调用一次函数,是调用的时候改变this指向
bind不会调用函数,只会在内存中创建一个函数的副本,是复制一份的时候改变this指向
call第二个参数开始需要一个参数列表
apply第二个参数需要是一个数组
10.new操作符具体干了什么操作?
第一步:创建一个空的对象
第二步:将this指向空对象
第三步:动态给刚创建的对象添加成员属性
第四步:隐式返回this
11.caller和callee的区别?
函数fun.caller返回调用fun的函数对象,即fun的执行环境,如果fun的执行环境为window,则返回null;
callee是函数的arguments这个特殊对象的一个属性,指向函数本身。
三、JavaScript基础
1.js中有哪些数据类型?
Number,String,Boolean,Null,Undefined,Object
2.typeof和instanceof的区别?
3.怎么判断两个对象相等?
4.js中有哪些函数定义的方式?
5.js中函数有哪些调用方式?
普通函数,对象的方法,事件处理函数,构造函数,回调函数
6.‘==’和‘===’的区别?
==只会对值进行比较
===不仅会对值进行比较,还会对数据类型进行比较
7.js中常用的内置对象有哪些?并列举该对象的常用方法?
Data、Math、Array、Object
8.列举和数组操作相关的方法?
9.列举和字符串操作相关的方法?
10.document.write和innerHTML的区别?
document.write是指定在整个页面区域的内容,直接将内容写入页面的内容流,会导致页面的重绘;
innerHTML将是指定某一个元素的内容,将内容写入某个DOM节点,不会导致页面的重绘;
11.分别阐述split() slice() splice() join()?
12.列举3种强制类型转换和2种隐式类型转换?
强制类型转换:
隐式转换:
13.如何判断foo是否是数组?
四、css
1.px em rem这三个长度单位的区别?
2.css3新增的伪类有哪些?
3.谈谈cs选择器优先级顺序以及判定标准?
优先级从低到高:
通配符选择器<标签选择器<类选择器<ID选择器
行内样式使用!important修饰的属性优先级最高
如果两个选择器同时命中一个元素,并且权重一样,则书写顺序会影响优先级,后一个选择器的属性会覆盖前一个选择器中相同的属性。
4.position几个属性的作用?
position的常见四个属性值:relative absolute fixed static;
5.position设置为absolute和fixed有什么区别?
absolute是绝对定位,绝对定位参考的是有明确定位的父元素,如果直接父元素没有明确定位会一直向上查找,如果父元素都没有明确定位,则参考body标签;
fixed是固定定位,参考对象是浏览器。
6.在一个页面中给多个元素设置相同的id,会导致什么问题?
会导致通过js获取dom元素的时候,只能获取到第一个元素,后面的元素都无法正常获取。
7.清楚浮动有哪些常见方式?
8.让两个块级元素在一块显示的做法?
9.如何设置一个元素在垂直方向居中?
10.图片懒加载的原理?实际开发中使用过哪些图片懒加载的插件?
img标签在加载图片的时候,是通过src属性所指向的文件来加载图片的,那如果img标签本身没有src属性的话,那么img标签在渲染的时候就不会加载图片。
所以图片的懒加载的原理就是将img标签的src属性给暂时先改成一个自定义的属性,这样页面已记载就会不去加载图片,当img标签进入屏幕的可视区域后,从存放图片路径的自定义属性中获取图片的地址并动态的设置给对应的img标签的src属性,这样浏览器就会自动帮助我们去请求对应的图片资源,也就实现了所谓的图片懒加载。
图片懒加载的插件:vue-lazyload。
11.display:none;visibility:hidden的区别?
display:none----->隐藏元素后不占位
visibility:hidden----->隐藏元素后占位
联系:
都能让元素不可见
区别:
12.less是什么?
Less是一种css预处理语言,在less中可以定义一些变量和表达式以及使用嵌套语法,less中使用@定义变量(@basecolor:pink);后期可以通过一些编译工具less将less编译成浏览器能直接识别的css样式。所以less只是在开发阶段使用的一种中间语言,使用less的目的是提高开发效率以及提高代码的可维护性。
13.Scss是什么?
scss是一种css预处理语言,在less中可以定义一些变量和表达式以及使用嵌套语法,scss中使用$定义变量($basecolor:pink)后期可以通过一些编译工具将less编译成浏览器能直接识别的css样式,所以scss只是在开发阶段使用的一种中间语言,使用scss的目的是提高开发效率以及提高代码的可维护性。
14.Stylus是什么?
stylus是一种css预处理语言,在stylus中可以定义一些变量和表达式以及使用嵌套语法,stylus中是使用缩进的语法表示嵌套关系,后期可以通过编译工具将stylus编译成浏览器能直接识别的css样式,所以stylus只是在开发阶段使用的一种中间语言,使用stylus的目的是提高开发效率以及提高代码的可维护性。
五、Html
1.Html5新增了哪些标签?
布局标签:header section footer article aside
表单标签:datalist input:type="week|date|time|datetime|number|search|url|tel|color|email|range"
多媒体标签:audio(音频) video(视频)
其它标签:progress(进度条) meter(度量器)
Html5新属性:
hidden(隐藏元素) required(必填)minlength(最小长度) maxlength(最大长度) pattern(正则表达式) placeholder(提示文本) autocomplete(自动填充)autofocus(自动获取焦点)
2.行内元素和块级元素的区别?
3.列举几个块级标签和行内标签?
4.简述readonly与disabled的区别?
5.哪些标签都存在伪元素?
6.伪元素可以用js来操作吗?
7.Html的网页为什么只需要写<!DOCTYPE HTML>?
8.src和href的区别?
它们都是HTML中特定元素的属性
src是source的缩写,它通常用于img video audio script等元素,可以指定外部资源的来源地址;
href是hyper reference的缩写,意味着超引用,它通常用于a,link等元素,通过href属性,可以标识文档中引用的其他超文本。
9.谈谈对标签语义化的理解?
(1)html语义化就是让页面的内容结构化,便于对浏览器、搜索引擎解析
(2)在没有样式css情况下也以一种文档格式来显示,容易阅读
(3)搜索引擎的爬虫依赖于标签来确定上下文和各个关键字的权重,利于SEO
(4)使阅读源代码的人对于网站更容易将网站分块,便于阅读和维护。
10.谈谈对WEB标准和W3C标准的理解?
WEB标准简单来说分为结构、表现、行为。
W3C是一个定制各种标准的非盈利组织,标准包括了HTML/CSS/XHTML等,WEB标准定制后的优点:
11.div+css布局较于table布局有什么特点?