关于javascript:js面试题进阶梳理

1、undeclared 与 undefined的区别？

undefined：申明了变量，然而没有赋值undecalared：没有申明变量就间接应用var a; //undefinedb;    // b is not defined

2、let & const与 var 的区别？

var存在变量晋升，可反复申明同一变量，申明的变量均可改let没有变量晋升，不可反复申明同一变量，申明的变量均可改const没有变量晋升，不可反复申明同一变量，申明的根本数据类型不可改，援用类型可改属性，不可只申明变量而不赋值

3、获取DOM元素有哪些办法？

4、操作DOM元素有哪些办法

5、DOM的类型有哪几种？

元素节点              Node.ELEMENT_NODE(1)属性节点              Node.ATTRIBUTE_NODE(2)文本节点              Node.TEXT_NODE(3)CDATA节点             Node.CDATA_SECTION_NODE(4)实体援用名称节点       Node.ENTRY_REFERENCE_NODE(5)实体名称节点          Node.ENTITY_NODE(6)解决指令节点          Node.PROCESSING_INSTRUCTION_NODE(7)正文节点              Node.COMMENT_NODE(8)文档节点              Node.DOCUMENT_NODE(9)文档类型节点          Node.DOCUMENT_TYPE_NODE(10)文档片段节点          Node.DOCUMENT_FRAGMENT_NODE(11)DTD申明节点            Node.NOTATION_NODE(12)

6、JS的作用域及作用域链
什么是作用域呢？

在 Javascript 中，作用域分为 全局作用域 和 函数作用域全局作用域：代码在程序任何中央都能拜访，window对象的内置属性都属于全局作用域函数作用域：在固定的代码片段能力被拜访

什么是作用域链？

个别状况下，变量取值到 创立 这个变量 的函数的作用域中取值然而如果在以后作用域中没有查到值，就会向下级作用域去查，直到查到全局作用域，这么一个查找过程造成的链条就叫做作用域链var x = 10;function fn(){    console.log(x);}function show(f){    var x = 20;    f();    // 10 }show(fn);

7、数组的splice 与 slice 的区别？

8、substr 和 substring 的区别？

9、includes 比 indexOf好在哪？

includes能够检测NaN，indexOf不能检测NaN，includes外部应用了Number.isNaN对NaN进行了匹配

10、上面代码输入的后果？

for(var i = 0; i < 3; i++){  setTimeout(function(){      console.log(i);     },0); };

答案：3，3，3

解决办法

for(let i = 0; i < 3; i++){  setTimeout(function(){      console.log(i);     },0); };// 0 1 2

for (var i = 0; i < 3; i++) {  (function(i) {    setTimeout(function () {      console.log(i);    }, 0, i)  })(i)};// 0 1 2

11、什么是async/await？解决了什么问题？

是generator + Promise的语法糖，次要的作用是用同步形式执行异步操作，await只能在async函数中应用，async函数执行会返回一个Promise，值由函数的return值所决定

12、JS提早加载的办法有哪些？

1、<script async src="script.js"></script>：给script标签加async属性，则加载和渲染后续文档元素的过程将和 script.js 的加载与执行并行进行（异步）2、<script defer src="script.js"></script>：给script标签加defer属性，加载后续文档元素的过程将和 script.js 的加载并行进行（异步），然而 script.js 的执行要在所有元素解析实现之后，DOMContentLoaded 事件触发之前实现3、动态创建script标签：等到DOMContentLoaded 事件触发时，生成一个script标签，渲染到页面上上4、setTimeout定时器提早代码执行

13、new操作符为什么能创立一个实例对象？

剖析一下new的整个过程：1、创立一个空对象2、继承构造函数的原型3、this指向obj，并调用构造函数4、返回对象简略实现一下new：function myNew (fn, ...args) {    // 第一步：创立一个空对象    const obj = {}    // 第二步：继承构造函数的原型    obj.__proto__ =  fn.prototype    // 第三步：this指向obj，并调用构造函数    fn.apply(obj, args)    // 第四步：返回对象    return obj}

14、什么是文档碎片？
是什么：一个容器，用于临时寄存创立的dom元素，应用document.createDocumentFragment()创立
有什么用：将须要增加的大量元素先增加到文档碎片中，再将文档碎片增加到须要插入的地位，大大减少dom操作，进步性能

var oFragmeng = document.createDocumentFragment(); for(var i=0;i<10000;i++){     var op = document.createElement("span");     var oText = document.createTextNode(i);     op.appendChild(oText);     //先附加在文档碎片中    oFragmeng.appendChild(op);  } //最初一次性增加到document中document.body.appendChild(oFragmeng); 

15、宏工作与微工作有哪些？

宏工作

微工作

16、Object.defineProperty(target, key, options)，options可传什么参数？

value：给target[key]设置初始值get：调用target[key]时触发set：设置target[key]时触发writable：默认false，为true时此属性能力被赋值运算符批改enumerable：默认false，为true时此属性能力被枚举configurable：默认为false，为true时此属性的描述符能力被批改，能力被删除

17、什么是防抖？什么是节流？

18、什么是高阶函数？简略实现一个？

高阶函数：JavaScript的函数其实都指向某个变量。既然变量能够指向函数，函数的参数能接管变量，那么一个函数就能够接管另一个函数作为参数，这种函数就称之为高阶函数。// 简略的高阶函数function add(x, y, f) {    return f(x) + f(y);}//用代码验证一下：add(-5, 6, Math.abs); // 11像数组的map、reduce、filter这些都是高阶函数

19、什么是函数柯里化？简略实现一个？

柯里化，是把承受多个参数的函数变换成承受一个繁多参数（最后函数的第一个参数）的函数，并且返回承受余下的参数而且返回后果的新函数的技术。// 一般的add函数function add(x, y) {    return x + y}// Currying后function curryingAdd(x) {    return function (y) {        return x + y    }}add(1, 2)           // 3curryingAdd(1)(2)   // 3

益处

1、参数复用

// 失常正则验证字符串 reg.test(txt)// 一般状况function check(reg, txt) {    return reg.test(txt)}check(/\d+/g, 'test')       //falsecheck(/[a-z]+/g, 'test')    //true// Currying后function curryingCheck(reg) {    return function(txt) {        return reg.test(txt)    }}var hasNumber = curryingCheck(/\d+/g)var hasLetter = curryingCheck(/[a-z]+/g)hasNumber('test1')      // truehasNumber('testtest')   // falsehasLetter('21212')      // false

2、提早执行 其实Function.prototype.bind就是科里化的实现例子

function sayKey(key) {  console.log(this[key])}const person = {  name: 'Sunshine_Lin',  age: 23}// call不是科里化sayKey.call(person, 'name') // 立刻输入 Sunshine_LinsayKey.call(person, 'age') // 立刻输入 23// bind是科里化const say = sayKey.bind(person) // 不执行// 想执行再执行say('name') // Sunshine_Linsay('age') // 23

20、箭头函数与一般函数的区别？

1、箭头函数不能作为构造函数，不能new2、箭头函数没有本人的this3、箭头函数没有arguments对象4、箭头函数没有原型对象

21、Symbol的利用场景？

应用Symbol充当属性名应用Symbol充当变量应用Symbol实现公有属性

22、AMD 和 CMD 的区别？

23、Commonjs 和 ES6 Module的区别？

1、前者是拷贝输入，后者是援用输入2、前者可批改引入值，后者只读3、前者是运行时，后者是编译时

24、为什么Commonjs不适用于浏览器

var math = require('math');math.add(2, 3);第二行math.add(2, 3)，在第一行require('math')之后运行，因而必须等math.js加载实现。也就是说，如果加载工夫很长，整个利用就会停在那里等。这对服务器端不是一个问题，因为所有的模块都寄存在本地硬盘，能够同步加载实现，等待时间就是硬盘的读取工夫。然而，对于浏览器，这却是一个大问题，因为模块都放在服务器端，等待时间取决于网速的快慢，可能要等很长时间，浏览器处于"假死"状态。因而，浏览器端的模块，不能采纳"同步加载"（synchronous），只能采纳"异步加载"（asynchronous）。这就是AMD标准诞生的背景。

25、函数的length是多少？

length 是函数对象的一个属性值，指该函数有多少个必须要传入的参数，即形参的个数。形参的数量不包含残余参数个数，仅包含第一个具备默认值之前的参数个数

26、深度遍历广度遍历的区别？

对于算法来说 无非就是工夫换空间 空间换工夫1、深度优先不须要记住所有的节点, 所以占用空间小, 而广度优先须要先记录所有的节点占用空间大2、深度优先有回溯的操作(没有路走了须要回头)所以相对而言工夫会长一点3、深度优先采纳的是堆栈的模式, 即先进后出4、广度优先则采纳的是队列的模式, 即先进先出

27、JS中的设计模式有哪些？

创立模式：该模式形象了对象实例化过程。结构型模式：这些模式解决不同的类和对象以提供新性能。行为模式：也称公布-订阅模式，定义了一个被观察者和多个观察者的、一对多的对象关系。并行设计模式：这些模式解决多线程编程范例。架构设计模式：这些模式用于解决架构设计

28、JS中如何将页面重定向到另一个页面？

1、应用 location.href：window.location.href =“https://www.baidu.com/”)2、应用 location.replace：window.location.replace(" https://www.baidu.com/;")

29、JS中鼠标事件的各个坐标？

30、JS中元素视图的各个尺寸？

31、Window视图的各个尺寸？

32、Document文档视图的各个尺寸？

33、监听ajax上传进度

//【上传进度调用办法实现】xhr.upload.onprogress = progressFunction