js面试题

一只程序袁 2019-08-29 01:24:17

什么是JavaScript？ 1.是一门脚本语言，通过JavaScript可以增加网页的交互功能，完成复杂的动态网页 2.是一门动态类型语言 3.是一门弱类型语言 JavaScript的组成： 1、ECMAScript 标准----js的基本语法 2、DOM---Document object model 文档对象模型 3、BOM---Browser object model 浏览器对象模型 1 2 3 JavaScript输出数据的方法：使用 window.alert() 弹出警告框。使用prompt("提示信息"，"输入框的默认信息") 使用 document.write() 方法将内容写到 HTML 文档中。使用 innerHTML 写入到 HTML 元素。使用 console.log() 写入到浏览器的控制台。 1 2 3 4 5 JavaScript的基本数据类型： Null、Undefined、Boolean、String、Number、Object。其中Object是一种复杂数据类型。 javascript的typeof返回哪些数据类型. string ,boolean, number, undefined, function, object 引用JavaScript的方式： 1.直接写在html5标签中 2.写在JavaScript标签里 3.引入外部js 例举3种强制类型转换和2种隐式类型转换? 强制：（parseInt,parseFloat,number）隐式：（== ===） ””和“=”的不同前者会自动转换类型,再判断是否相等后者不会自动类型转换，直接去比较如何判断一个变量的值是否为数字？以及有哪些手段判断变量值的数据类型？全局函数isNaN可以判断一个变量的值是否为数字。可以使用运算符type、instanceof判断变量值的数据类型。如何区分数组和对象？（1）从原型入手，Array.prototype.isPrototypeOf(obj); 利用isPrototypeOf()方法，判定Array是不是在obj的原型链中，如果是，则返回true,否则false。Array.prototype.isPrototype([]) //true （2）也可以从构造函数入手，利用对向的constructor属性（3）根据对象的class属性(类属性)，跨原型链调用toString()方法。Object.prototype.toString.call(Window); （4）Array.isArray()方法。 split() join() 的区别前者是将字符串切割成数组的形式，后者是将数组转换成字符串数组方法pop() push() unshift() shift() push()尾部添加 pop()尾部删除 unshift()头部添加 shift()头部删除 call和apply的区别 ①apply()函数有两个参数：第一个参数是上下文，第二个参数是参数组成的数组。如果上下文是null，则使用全局对象代替。 Object.call(this,obj1,obj2,obj3) ②call()的第一个参数是上下文，后续是实例传入的参数序列。 Object.apply(this,arguments) JavaScript中的系统函数： parseInt():将字符串转换为整数 parseFloat():将字符串转换为浮点数 isNaN():检查其参数是否为非数字 1 2 3 IE和DOM事件流的区别 ①执行顺序不一样、 ②参数不一样 ③事件加不加on ④this指向问题 ajax请求的时候get 和post方式的区别一个在url后面，一个放在虚拟载体里面 get有大小限制(只能提交少量参数) 安全问题应用不同，请求数据和提交数据解释什么是Json: (1)JSON 是一种轻量级的数据交换格式。 (2)JSON 独立于语言和平台，JSON 解析器和 JSON 库支持许多不同的编程语言。 (3)JSON的语法表示三种类型值，简单值(字符串，数值，布尔值，null),数组，对象解释jsonp的原理，以及为什么不是真正的ajax 动态创建script标签，回调函数 Ajax是页面无刷新请求数据操作 ajax请求时，如何解析json数据使用JSON.parse 事件委托是什么利用事件冒泡的原理，让自己的所触发的事件，让他的父元素代替执行！闭包是什么，有什么特性，对页面有什么影响闭包就是能够读取其他函数内部变量的函数,使得函数不被GC回收，如果过多使用闭包，容易导致内存泄露怎么创建闭包在函数内部嵌套使用函数闭包的好处 (1)希望一个变量长期驻扎在内存当中(不被垃圾回收机制回收) (2)避免全局变量的污染 (3)私有成员的存在 (4)安全性提高闭包的缺点可能导致内存占用过多,因为闭包携带了自身的函数作用域闭包只能取得外部包含函数中得最后一个值内存泄露内存泄漏指一块被分配的内存既不能使用，又不能回收，直到浏览器进程结束。出现原因：循环引用：含有DOM对象的循环引用将导致大部分当前主流浏览器内存泄露。循环引用，简单来说假如a引用了b,b又引用了a,a和b就构成了循环引用。 JS闭包：闭包，函数返回了内部函数还可以继续访问外部方法中定义的私有变量。 Dom泄露，当原有的DOM被移除时，子结点引用没有被移除则无法回收。垃圾回收的两个方法：* 标记清除法：垃圾回收机制给存储在内存中的所有变量加上标记，然后去掉环境中的变量以及被环境中变量所引用的变量（闭包）。操作1之后内存中仍存在标记的变量就是要删除的变量，垃圾回收机制将这些带有标记的变量回收。引用计数法：垃圾回收机制给一个变量一个引用次数，当声明了一个变量并将一个引用类型赋值给该变量的时候这个值的引用次数就加1。当该变量的值变成了另外一个值，则这个值得引用次数减1。当这个值的引用次数变为0的时候，说明没有变量在使用，垃圾回收机制会在运行的时候清理掉引用次数为0的值占用的空间。 Javascript的事件流模型都有什么? “事件冒泡”：事件开始由最具体的元素接受，然后逐级向上传播 “事件捕捉”：事件由最不具体的节点先接收，然后逐级向下，一直到最具体的 “DOM事件流”：三个阶段：事件捕捉，目标阶段，事件冒泡 dom事件委托什么原理，有什么优缺点事件委托原理:事件冒泡机制优点 1.可以大量节省内存占用，减少事件注册。比如ul上代理所有li的click事件就很不错。 2.可以实现当新增子对象时，无需再对其进行事件绑定，对于动态内容部分尤为合适缺点事件代理的常用应用应该仅限于上述需求，如果把所有事件都用事件代理，可能会出现事件误判。即本不该被触发的事件被绑定上了事件。事件处理机制： IE是事件冒泡、火狐是事件捕获；事件冒泡当你使用事件冒泡时，子级元素先触发，父级元素后触发，即p先触发，div后触发。事件捕获** 当你使用事件捕获时，父级元素先触发，子级元素后触发，即div先触发，p后触发。如何阻止事件冒泡 ie:阻止冒泡ev.cancelBubble = true;非IE ev.stopPropagation(); 阻止捕获* 阻止事件的默认行为，例如click 后的跳转在W3c中，使用preventDefault（）方法；在IE下设置window.event.returnValue = false; 如何阻止默认事件 (1)return false；(2) ev.preventDefault(); javascript的本地对象，内置对象和宿主对象：本地对象为array obj regexp等可以new实例化内置对象为gload Math 等不可以实例化的宿主为浏览器自带的document,window 等添加删除替换插入到某个接点的方法 1）创建新节点 createElement() //创建一个具体的元素 createTextNode() //创建一个文本节点 2）添加、移除、替换、插入 appendChild() //添加 removeChild() //移除 replaceChild() //替换 insertBefore() //插入 3）查找 getElementsByTagName() //通过标签名称 getElementsByName() //通过元素的Name属性的值 getElementById() //通过元素Id，唯一性 javaScript的2种变量范围有什么不同？全局变量：当前页面内有效局部变量：函数方法内有效生命周期：局部变量在函数执行完毕后销毁。全局变量在页面关闭后销毁。 1 2 3 什么是null： null用来表示尚未存在的对象用法：（1）作为函数的参数，表示该函数的参数不是对象。（2）作为对象原型链的终点。什么是undefined：当声明的变量还未被初始化时，变量的默认值为undefined 用法：（1）变量被声明了，但没有赋值时，就等于undefined。（2）调用函数时，应该提供的参数没有提供，该参数等于undefined。（3）对象没有赋值的属性，该属性的值为undefined。（4）函数没有返回值时，默认返回undefined。 new操作符具体干了什么呢? 1、创建一个空对象，并且 this 变量引用该对象，同时还继承了该函数的原型。 2、属性和方法被加入到 this 引用的对象中。 3、新创建的对象由 this 所引用，并且最后隐式的返回 this 。 this对象的理解 ①this总是指向函数的直接调用者（而非间接调用者）； ②如果有new关键字，this指向new出来的那个对象； ③在事件中，this指向触发这个事件的对象，特殊的是，IE中的attachEvent中的this总是指向全局对象Window； eval是做什么的？ ①它的功能是把对应的字符串解析成JS代码并运行； ②应该避免使用eval，不安全，非常耗性能（2次，一次解析成js语句，一次执行）。 ③由JSON字符串转换为JSON对象的时候可以用eval，var obj =eval('('+ str +')'); js延迟加载的方式有哪些？ defer和async、动态创建DOM方式（创建script，插入到DOM中，加载完毕后callBack）、按需异步载入js javascript是面向对象的，怎么体现javascript的继承关系？使用prototype原型来实现。你能解释一下JavaScript中的继承是如何工作的吗？子构造函数中执行父构造函数，并用call\apply改变this 克隆父构造函数原型上的方法 JavaScript继承的几种实现方式？ 1)构造函数继承，使用call和apply两个方法的特性可以实现，改变方法中的this 2)原型链继承 3)组合式继承 1 2 3 javascript创建对象的几种方式？对象字面量的方式用function来模拟无参的构造函数用工厂方式来创建（内置对象）用混合方式来创建 form中的input可以设置为readonly和disable，请问2者有什么区别？ readonly不可编辑，但可以选择和复制；值可以传递到后台 disabled不能编辑，不能复制，不能选择；值不可以传递到后台节点的种类有几种，分别是什么？ (1)元素节点：nodeType ===1; (2)文本节点：nodeType ===3; (3)属性节点：nodeType ===2; innerHTML和outerHTML的区别 innerHTML(元素内包含的内容） outerHTML(自己以及元素内的内容） documen.write和 innerHTML的区别 document.write只能重绘整个页面 innerHTML可以重绘页面的一部分 1 2 3 请说出三种减低页面加载时间的方法 1、压缩css、js文件 2、合并js、css文件，减少http请求 3、外部js、css文件放在最底下 4、减少dom操作，尽可能用变量替代不必要的dom操作请解释什么是Javascript的模块模式，并举出实用实例。 js模块化mvc（数据层、表现层、控制层） seajs 命名空间你如何优化自己的js代码？代码重用避免全局变量（命名空间，封闭空间，模块化mvc…）拆分函数避免函数过于臃肿注释解释使用js实现AJAX的工作原理。 (1)创建XMLHttpRequest对象,也就是创建一个异步调用对象 (2)创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息 (3)设置响应HTTP请求状态变化的函数 (4)发送HTTP请求 (5)获取异步调用返回的数据 (6)使用JavaScript和DOM实现局部刷新 1 2 3 4 5 6 同步和异步的区别? 同步：浏览器访问服务器请求，用户看得到页面刷新，重新发请求,等请求完，页面刷新，新内容出现，用户看到新内容,进行下一步操作。异步：浏览器访问服务器请求，用户正常操作，浏览器后端进行请求。等请求完，页面不刷新，新内容也会出现，用户看到新内容。异步加载JS的方式有哪些？ (1) defer，只支持IE (2) async： (3) 创建script，插入到DOM中，加载完毕后callBack 1 2 3 如何解决跨域问题? jsonp、 iframe、window.name、window.postMessage、服务器上设置代理页面 1 请描述一下 cookies，sessionStorage 和 localStorage 的区别？ cookie在浏览器和服务器间来回传递。 sessionStorage和localStorage不会 sessionStorage和localStorage的存储空间更大； sessionStorage和localStorage有更多丰富易用的接口； sessionStorage和localStorage各自独立的存储空间； focus/blur与focusin/focusout的区别与联系 focus/blur不冒泡，focusin/focusout冒泡 focus/blur兼容性好，focusin/focusout在除FireFox外的浏览器下都保持良好兼容性，如需使用事件托管，可考虑在FireFox下使用事件捕获elem.addEventListener(‘focus’, handler, true) http协议属于七层协议中的哪一层，下一层是什么七层结构：物理层、数据链路层、网络层、传输层、会话层、表示层、应用层 tcp属于传输层；http属于应用层。表现层 js设计模式总体来说设计模式分为三大类： **创建型模式，共五种：**工厂方法模式、抽象工厂模式、单例模式、建造者模式、原型模式。 **结构型模式，共七种：**适配器模式、装饰器模式、代理模式、外观模式、桥接模式、组合模式、享元模式。 **行为型模式，共十一种：**策略模式、模板方法模式、观察者模式、迭代子模式、责任链模式、命令模式、备忘录模式、状态模式、访问者模式、中介者模 js深度复制的方式* 1）使用jq的$.extend(true, target, obj) 2）newobj = Object.create(sourceObj)，// 但是这个是有个问题就是 newobj的更改不会影响到 sourceobj但是 sourceobj的更改会影响到newObj 3）newobj = JSON.parse(JSON.stringify(sourceObj))

...全文