1.解释 JavaScript 中的作用域与变量声明提升?
参考答案:
我对作用域的理解是只会对某个范围产生作用,而不会对外产生影响的封闭空间。在这样的一些空间里,外部不能访问内部变量,但内部可以访问外部变量。
所有申明都会被提升到作用域的最顶上
同一个变量申明只进行一次,并且因此其他申明都会被忽略
函数声明的优先级优于变量申明,且函数声明会连带定义一起被提升
2.Node. js 的适用场景?
参考答案:比如:RESTFUL API、实时聊天、客户端逻辑强大的单页 APP,具体的例子比如说:本地化的在线音乐应用,本地化的在线搜索应用,本地化的在线 APP 等。
3.bind、call、apply 的区别
call 和 apply 其实是一样的,区别就在于传参时参数是一个一个传或者是以一个数组的方式来传。
call 和 apply 都是在调用时生效,改变调用者的 this 指向。
bind 也是改变 this 指向,不过不是在调用时生效,而是返回一个新函数。
4.使用构造函数的注意点
参考答案:
- 一般情况下构造函数的首字母需要大写,因为我们在看到一个函数首字母大写的情况,就认定这是一个构造函数,需要跟new关键字进行搭配使用,创建一个新的实例(对象)
- 构造函数在被调用的时候需要跟new关键字搭配使用。
- 在构造函数内部通过this+属性名的形式为实例添加一些属性和方法。
- 构造函数一般不需要返回值
5.数组的常用方法
参考答案:
- Array. map()
此方法是将数组中的每个元素调用一个提供的函数,结果作为一个新的数组返回,并没有改变原来的数组 - Array. forEach()
此方法是将数组中的每个元素执行传进提供的函数,没有返回值,直接改变原数组,注意和 map 方法区分 - Array. filter()
此方法是将所有元素进行判断,将满足条件的元素作为一个新的数组返回 - Array. every()
此方法是将所有元素进行判断返回一个布尔值,如果所有元素都满足判断条件,则返回 true,否则为 false - Array. some()
此方法是将所有元素进行判断返回一个布尔值,如果存在元素都满足判断条件,则返回 true,若所有元素都不满足判断条件,则返回 false - Array. reduce()
此方法是所有元素调用返回函数,返回值为最后结果, 传入的值必须是函数类型 - Array. push()
此方法是在数组的后面添加新加元素,此方法改变了数组的长度 - Array. pop()
此方法在数组后面删除最后一个元素,并返回数组,此方法改变了数组的长度 - Array. shift()
此方法在数组后面删除第一个元素,并返回数组,此方法改变了数组的长度 - Array.unshift()
此方法是将一个或多个元素添加到数组的开头,并返回新数组的长度 - Array.isArray()
判断一个对象是不是数组,返回的是布尔值 - Array.concat()
此方法是一个可以将多个数组拼接成一个数组
6.字符串常用操作
参考答案:
- charAt(index): 返回指定索引处的字符串
- charCodeAt(index): 返回指定索引处的字符的 Unicode 的值
- concat(str1, str2, … ): 连接多个字符串,返回连接后的字符串的副本
- fromCharCode(): 将 Unicode 值转换成实际的字符串
- indexOf(str): 返回 str 在父串中第一次出现的位置,若没有则返回-1
- lastIndexOf(str): 返回 str 在父串中最后一次出现的位置,若没有则返回-1
- match(regex): 搜索字符串,并返回正则表达式的所有匹配
- replace(str1, str2):str1 也可以为正则表达式,用 str2 替换 str1
- search(regex): 基于正则表达式搜索字符串,并返回第一个匹配的位置
- slice(start, end):返回字符索引在 start 和 end(不含)之间的子串
- split(sep,limit):将字符串分割为字符数组,limit 为从头开始执行分割的最大数量
- substr(start,length):从字符索引 start 的位置开始,返回长度为 length 的子串
- substring(from, to):返回字符索引在 from 和 to(不含)之间的子串
- toLowerCase():将字符串转换为小写
- toUpperCase():将字符串转换为大写
- valueOf():返回原始字符串值
7.作用域的概念及作用
参考答案: - 作用域 : 起作用的一块区域
- 作用域的概念: 对变量起保护作用的一块区域
- 作用: 作用域外部无法获取到作用域内部声明的变量,作用域内部能够获取到作用域外界声明的变量。
8.作用域的分类
参考答案:块作用域、词法作用域、动态作用域
解析:
1 块作用域 花括号 {}
2 词法作用域(js 属于词法作用域) 作用域只跟在何处被创建有关系,跟在何处被调用没有关系
3 动态作用域 作用域只跟在何处被调用有关系,跟在何处被创建没有关系
9. js 属于哪种作用域
参考答案:词法作用域(函数作用域)
10.自执行函数? 用于什么场景?好处?
参考答案:
自执行函数: 1、声明一个匿名函数 2、马上调用这个匿名函数。
作用:创建一个独立的作用域。
好处:防止变量弥散到全局,以免各种 js 库冲突。隔离作用域避免污染,或者截断作用域链,避免闭包造成引用变量无法释放。利用立即执行特性,返回需要的业务函数或对象,避免每次通过条件判断来处理
场景:一般用于框架、插件等场景
11.多个页面之间如何进行通信
参考答案:有如下几个方式:
- cookie
- web worker
- localeStorage 和 sessionStorage
12.css 动画和 js 动画的差异
参考答案:
- 代码复杂度,js 动画代码相对复杂一些
- 动画运行时,对动画的控制程度上,js 能够让动画,暂停,取消,终止,css 动画不能添加事件
- 动画性能看,js 动画多了一个 js 解析的过程,性能不如 css 动画好
13.如何做到修改 url 参数页面不刷新
参考答案:
HTML5 引入了 history.pushState() 和 history.replaceState() 方法,它们分别可以添加和修改历史记录条目。
14.数组方法 pop() push() unshift() shift()
参考答案:
- arr. pop() 从后面删除元素,只能是一个,返回值是删除的元素
- arr. push() 从后面添加元素,返回值为添加完后的数组的长度
- arr. unshift() 从前面添加元素, 返回值是添加完后的数组的长度
- arr. shift() 从前面删除元素,只能删除一个 返回值是删除的元素
15.事件绑定与普通事件有什么区别
参考答案:
- 用普通事件添加相同事件,下面会覆盖上面的,而事件绑定不会
- 普通事件是针对非 dom 元素,事件绑定是针对 dom 元素的事件
16.IE 和标准下有哪些兼容性的写法
参考答案:
var ev = ev || window.event;
document.documentElement.clientWidth || document.body.clientWidth;
var target = ev.srcElement || ev.target;
17.如何阻止冒泡与默认行为
参考答案:
- 阻止冒泡行为:非 IE 浏览器 stopPropagation(),IE 浏览器 window. event. cancelBubble = true
- 阻止默认行为:非 IE 浏览器 preventDefault(),IE 浏览器 window. event. returnValue = false
18.js 中 this 闭包 作用域
参考答案:
this:指向调用上下文
闭包:定义一个函数就开辟了一个局部作用域,整个 js 执行环境有一个全局作用域
作用域:一个函数可以访问其他函数中的变量(闭包是一个受保护的变量空间)
19.javascript 的本地对象,内置对象和宿主对象
参考答案:
- 本地对象
ECMA-262 把本地对象(native object)定义为“独立于宿主环境的 ECMAScript 实现提供的对象"。简单来说,本地对象就是 ECMA-262 定义的类(引用类型)。它们包括:Object、Function、Array、String、Boolean、Number、Date、RegExp、Error、EvalError、RangeError、ReferenceError、SyntaxError、TypeError、URIError - 内置对象
JS中内置了17个对象,常用的是Array对象、Date对象、正则表达式对象、string对象、Global对象 - 宿主对象
由ECMAScript实现的宿主环境提供的对象,可以理解为:浏览器提供的对象。所有的BOM和DOM都是宿主对象。
20. 事件冒泡与事件捕获
参考答案:
事件冒泡:由最具体的元素(目标元素)向外传播到最不具体的元素
事件捕获:由最不确定的元素到目标元素
21.复杂数据类型如何转变为字符串
参考答案:
- 首先,会调用 valueOf 方法,如果方法的返回值是一个基本数据类型,就返回这个值
- 如果调用 valueOf 方法之后的返回值仍旧是一个复杂数据类型,就会调用该对象的 toString 方法
- 如果 toString 方法调用之后的返回值是一个基本数据类型,就返回这个值,
- 如果 toString 方法调用之后的返回值是一个复杂数据类型,就报一个错误。
22.javascript 中 this 的指向问题
参考答案:
- 全局环境、普通函数(非严格模式)指向 window
- 普通函数(严格模式)指向 undefined
- 函数作为对象方法及原型链指向的就是上一级的对象
- 构造函数指向构造的对象
- DOM 事件中指向触发事件的元素
23.call 与 apply 区别
参考答案:第二个参数的类型不同
解析:
- call 和 apply 的作用,完全一样,唯一的区别就是在参数上面。
- call 接收的参数不固定,第一个参数是函数体内 this 的指向,第二个参数以下是依次传入的参数。
- apply 接收两个参数,第一个参数也是函数体内 this 的指向。第二个参数是一个集合对象(数组或者类数组)
24.异步加载 js 的方法
参考答案:
方案一:
25.去除字符串里面的重复字符
参考答案:
最简单的方式
[...new Set("ababbc")].join(""); // "abc"
26.求数组的最大值
参考答案:Math. max. apply(null, 数组)
var a = [1, 2, 3, 5];
alert(Math.max.apply(null, a)); //最大值
alert(Math.min.apply(null, a)); //最小值
27.原型的作用 以及什么是原型
参考答案:作用:实现资源共享
什么是原型: 实例在被创建的那一刻,构造函数的 prototype 属性的值。
28. javascript 里面的继承怎么实现,如何避免原型链上面的对象共享
参考答案:用构造函数和原型链的混合模式去实现继承,避免对象共享可以参考经典的 extend()函数,很多前端框架都有封装的,就是用一个空函数当做中间变量
29.说说你对作用域链的理解
参考答案:作用域链的作用是保证执行环境里有权访问的变量和函数是有序的,作用域链的变量只能向上访问,变量访问到 window 对象即被终止,作用域链向下访问变量是不被允许的。
30.JavaScript 原型,原型链 ? 有什么特点?
- 原型对象也是普通的对象,是对象一个自带隐式的 proto 属性,原型也有可能有自己的原型,如果一个原型对象的原型不为 null 的话,我们就称之为原型链。
- 原型链是由一些用来继承和共享属性的对象组成的(有限的)对象链。
31.js 延迟加载的方式有哪些?
参考答案:defer 和 async、动态创建 DOM 方式(用得最多)、按需异步载入 js
32.分别阐述 split(), slice(), splice(), join()?
参考答案:
- join()用于把数组中的所有元素拼接起来放入一个字符串。所带的参数为分割字符串的分隔符,默认是以逗号分开。归属于 Array
- split()即把字符串分离开,以数组方式存储。归属于 Stringstring
- slice() 方法可从已有的数组中返回选定的元素。该方法并不会修改数组,而是返回一个子数组。如果想删除数组中的一段元素,应该使用方法 Array. splice()
- splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目。返回的是含有被删除的元素的数组。
33.document. write 和 innerHTML 的区别?
参考答案:
document. write 是重写整个 document, 写入内容是字符串的 html 2. innerHTML 是 HTMLElement 的属性,是一个元素的内部 html 内容
34.让你自己设计实现一个 requireJS,你会怎么做?
参考答案:核心是实现 js 的加载模块,维护 js 的依赖关系,控制好文件加载的先后顺序
35.requireJS 的核心原理是什么?(如何动态加载的?如何避免多次加载的?如何缓存的?)
参考答案:核心是 js 的加载模块,通过正则匹配模块以及模块的依赖关系,保证文件加载的先后顺序,根据文件的路径对加载过的文件做了缓存
36.用原生 JavaScript 的实现过什么功能吗?
参考答案:轮播图、手风琴、放大镜、3D动画效果等,切记,所答的一定要知道实现原理!,不知道还不如不说!
37.BOM 对象有哪些,列举 window 对象?
参考答案:
1、window对象 ,是JS的最顶层对象,其他的BOM对象都是window对象的属性;
2、document对象,文档对象;
3、location对象,浏览器当前URL信息;
4、navigator对象,浏览器本身信息;
5、screen对象,客户端屏幕信息;
6、history对象,浏览器访问历史信息;
38.什么是三元表达式?“三元”表示什么意思?
参考答案:三元如名字表示的三元运算符需要三个操作数。
语法是 条件 ? 结果1 : 结果2; . 这里你把条件写在问号(?)的前面后面跟着用冒号(:)分隔的结果1和结果2。满足条件时结果1否则结果2。
39.我们给一个 dom 同时绑定两个点击事件,一个用捕获,一个用冒泡,你来说下会执行几次事件,然后会先执行冒泡还是捕获
参考答案:所有事件的顺序是:其他元素捕获阶段事件 -> 本元素代码顺序事件 -> 其他元素冒泡阶段事件 。
40.知道什么是 webkit 么? 知道怎么用浏览器的各种工具来调试和 debug 代码么?
参考答案:Webkit 是浏览器引擎,包括 html 渲染和 js 解析功能,手机浏览器的主流内核,与之相对应的引擎有 Gecko(Mozilla Firefox 等使用)和 Trident(也称 MSHTML,IE 使用)。 对于浏览器的调试工具要熟练使用,主要是页面结构分析,后台请求信息查看,js 调试工具使用,熟练使用这些工具可以快速提高解决问题的效率
41.JavaScript 的循环语句有哪些?
参考答案:while for do while forEach
42.作用域-编译期执行期以及全局局部作用域问题
参考答案:js 执行主要的两个阶段:预解析和执行期
43.如何添加 html 元素的事件,有几种方法?请列举
参考答案:直接在标签里添加;在元素上添加、使用事件注册函数添加
44.事件绑定的方式
参考答案:
嵌入 dom
<button onclick="func()">按钮</button>
直接绑定
btn.onclick = function() {};
事件监听
btn.addEventListener("click", function() {});