前端知识点-JS相关知识点

一、谈谈你对Ajax的理解?(概念、特色、做用)

AJAX全称为“Asynchronous JavaScript And XML”(异步JavaScript和XML) 是指一种建立交互式网页应用的开发技术、改善用户体验,实现无刷新效果。javascript

优势css

a、不须要插件支持html

b、优秀的用户体验前端

c、提升Web程序的性能java

d、减轻服务器和带宽的负担node

缺点程序员

a、浏览器对XMLHttpRequest对象的支持度不足,几乎全部浏览器如今都支持angularjs

b、破坏浏览器“前进”、“后退”按钮的正常功能,能够经过简单的插件弥补ajax

c、对搜索引擎的支持不足npm

二、说说你对延迟对象deferred的理解?

deferred对象是从jQuery 1.5.0版本开始引入的一个新功能。

a、什么是deferred对象

开发网站的过程当中,咱们常常遇到某些耗时很长的javascript操做。其中,既有异步的操做(好比ajax读取服务器数据),也有同步的操做(好比遍历一个大型数组),它们都不是当即能获得结果的。

一般的作法是,为它们指定回调函数(callback)。即事先规定,一旦它们运行结束,应该调用哪些函数。

可是,在回调函数方面,jQuery的功能很是弱。为了改变这一点,jQuery开发团队就设计了deferred对象。

简单说,deferred对象就是jQuery的回调函数解决方案。在英语中,defer的意思是"延迟",因此deferred对象的含义就是"延迟"到将来某个点再执行。 它解决了如何处理耗时操做的问题,对那些操做提供了更好的控制,以及统一的编程接口。

b、它的主要功能,能够归结为四点:

(1)、实现链式操做

(2)、指定同一操做的多个回调函数

(3)、为多个操做指定回调函数

(4)、普通操做的回调函数接口

三、什么是跨域,如何实现跨域访问?

跨域是指不一样域名之间相互访问。

JavaScript同源策略的限制,A域名下的JavaScript没法操做B或是C域名下的对象

实现:

(1)、JSONP跨域:利用script脚本容许引用不一样域下的js实现的,将回调方法带入服务器,返回结果时回调。

(2)、跨域资源共享(CORS) 跨域资源共享(CORS)是一种网络浏览器的技术规范,它为Web服务器定义了一种方式,容许网页从不一样的域访问其资源。

CORS与JSONP相比:

a、 JSONP只能实现GET请求,而CORS支持全部类型的HTTP请求。

b、 使用CORS,开发者能够使用普通的XMLHttpRequest发起请求和得到数据,比起JSONP有更好的错误处理。

c、 JSONP主要被老的浏览器支持,它们每每不支持CORS,而绝大多数现代浏览器都已经支持了CORS。

四、为何要使用模板引擎?

a、模板引擎(这里特指用于Web开发的模板引擎)是为了使用户界面与业务数据(内容)分离而产生的,它能够生成特定格式的文档,用于网站的模板引擎就会生成一个标准的HTML文档。

b、在一些示例中javascript有大量的html字符串,html中有一些像onclick样的javascript,这样javascript中有html,html中有javascript,代码的偶合度很高,不便于修改与维护,使用模板引擎能够解决问题。

五、JavaScript是一门什么样的语言,它有哪些特色?

JavaScript 是一种脚本语言,官方名称为 ECMAScript(因定义语言的标准为 ECMA-262)。

JS 的主要特色:

a、语法相似于常见的高级语言,如 C 和 Java;

b、脚本语言,不须要编译就能够由解释器直接运行;

c、 变量松散定义,属于弱类型语言;

d、面向对象的。

JS 最初是为网页设计而开发的,如今也是Web 开发的重要语言。它支持对浏览器(浏览器对象模型,BOM)和HTML 文档(文档对象模型,DOM)进行操做而使网页呈现动态的交互特性。

严格的说,JS只是ECMAScript 的一种实现,是ECMAScript和BOM、DOM组成的一种Web 开发技术。

六、JavaScript的数据类型有哪些?

基本数据类型:字符串 String、数字 Number、布尔Boolean

复合数据类型:数组 Array、对象 Object

特殊数据类型:Null 空对象、Undefined 未定义

七、已知ID的Input输入框,如何获取这个输入框的输入值?(不使用第三方框架)

document.getElementById("ID").value

八、根据你的理解,请简述JavaScript脚本的执行原理?

JavaScript是一种动态、弱类型、基于原型的语言,经过浏览器能够直接执行。

当浏览器遇到<script> 标记的时候,浏览器会执行之间的javascript代码。嵌入的js代码是顺序执行的,每一个脚本定义的全局变量和函数,均可以被后面执行的脚本所调用。 变量的调用,必须是前面已经声明,不然获取的变量值是undefined。

九、DOM操做怎样添加、移除、移动、复制、建立和查找节点?

(1)建立新节点

createDocumentFragment() //建立一个DOM片断 createElement() //建立一个具体的元素 createTextNode() //建立一个文本节点

(2)添加、移除、替换、插入

appendChild()
removeChild()
replaceChild()
insertBefore() //在已有的子节点前插入一个新的子节点

(3)查找

getElementsByTagName() //经过标签名称 getElementsByName() //经过元素的Name属性的值(IE容错能力较强,会获得一个数组,其中包括id等于name值的) getElementById() //经过元素Id,惟一性

十、说说你对json的理解?

回答一:

a、JSON对象:以“{”开始,以“}”结束,里面则是一系列的键(key)值(value)对,键和值用“:”分开,每对键值对之间用“,”分开。参考如下语法结构:{key1:value1,key2:value2,key3:value3…}其中键(key)是字符串,而值(value)能够是字符串,数值,true,false,null,对象或数组,也就是说某个键(key)的值(value)能够是一个数组,数组里面又是一些JSON对象,这种表示稍微复杂一些,可是参照这些理解能够很容易分辨出来。

b、JSON数组:以”[”开始,”]”结束,如同程序语言同样,例如C#,Button[] btnArray,则BtnArray是一个Button类型的数组,里面就存放Button类型的对象,那么JSON数组也同样,里面存放的也是JSON对象.

回答二:

a、JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation)

b、JSON 是轻量级的文本数据交换格式,并非编程语言

c、JSON 独立于语言存在

d、JSON 具备自我描述性,更易理解

e、JSON 能够将 JavaScript 对象中表示的一组数据转换为字符串,而后就能够在函数之间轻松地传递这个字符串,或者在异步应用程序中将字符串从 Web 客户机传递给服务器端程序。这个字符串看起来有点儿古怪,可是JavaScript很容易解释它,并且 JSON 能够表示比"名称 / 值对"更复杂的结构。例如,能够表示数组和复杂的对象,而不只仅是键和值的简单列表

回答三: JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。

它是基于JavaScript的一个子集。数据格式简单, 易于读写, 占用带宽小.

json简单说就是javascript中的对象和数组,因此这两种结构就是对象和数组两种结构,经过这两种结构能够表示各类复杂的结构。

(1)、对象:对象在js中表示为“{}”括起来的内容,数据结构为 {key:value,key:value,...}的键值对的结构,在面向对象的语言中,key为对象的属性,value为对应的属性值,因此很容易理解,取值方法为 对象.key 获取属性值,这个属性值的类型能够是 数字、字符串、数组、对象几种。

(2)、数组:数组在js中是中括号“[]”括起来的内容,数据结构为 ["java","javascript","vb",...],取值方式和全部语言中同样,使用索引获取,字段值的类型能够是数字、字符串、数组、对象几种。

通过对象、数组2种结构就能够组合成复杂的数据结构了。

十一、ionic和angularjs的区别?

a、ionic是一个用来开发混合手机应用的,开源的,免费的代码库。能够优化html、css和js的性能,构建高效的应用程序,并且还能够用于构建Sass和AngularJS的优化。

b、AngularJS经过新的属性和表达式扩展了HTML。AngularJS能够构建一个单一页面应用程序(SPAs:Single Page Applications)。

c、Ionic是一个混合APP开发工具,它以AngularJS为中间脚本工具(称为库,彷佛又不恰当),因此,你若是要使用Ionic开发APP,就必须了解AngularJS。

十二、谈谈你对闭包的理解?

(1)、使用闭包主要是为了设计私有的方法和变量。闭包的优势是能够避免全局变量的污染,缺点是闭包会常驻内存,会增大内存使用量,使用不当很容易形成内存泄露。

(2)、闭包有三个特性:

a、函数嵌套函数

b、函数内部能够引用外部的参数和变量

c、参数和变量不会被垃圾回收机制回收

1三、谈谈你This对象的理解?

回答一:

(1)、js的this指向是不肯定的,也就是说是能够动态改变的。call/apply 就是用于改变this指向的函数,这样设计可让代码更加灵活,复用性更高

(2)、this 通常状况下,都是指向函数的拥有者。

(3)、在函数自执行里,this 指向的是 window 对象。

扩展:关于this,还有一个地方比较让人模糊的是在dom事件里,一般有以下3种状况:

a、使用标签属性注册事件,此时this指向的是window对象。

b、对与a,要让this指向input,能够将this做为参数传递。

c、使用addEventListener等注册事件。此时this也是指向 input。

回答二:

(1)、处于全局做用域下的this:

this;/*window*/ var a = {name: this}/*window*/ var b = [this];/*window*/

在全局做用域下,this默认指向window对象。

(2)、处在函数中的this,又分为如下几种状况:

a、通常定义的函数,而后通常的执行:

var a = function(){ console.log(this); } a();/*window*/

this仍是默认指向window。

b、通常定义,用new调用执行:

var a = function(){ console.log(this); } new a();/*新建的空对象*/

这时候让this指向新建的空对象,咱们才能够给空对象初始化自有变量

c、做为对象属性的函数,调用时:

复制代码
var a = { f:function(){ console.log(this) } } a.f();/*a对象*/
复制代码

这时候this指向调用f函数的a对象。

(3)、经过call()和apply()来改变this的默认引用:

复制代码
var b = {id: 'b'}; var a = { f:function(){ console.log(this)  } } a.f.call(b);/*window*/
复制代码

全部函数对象都有的call方法和apply方法,它们的用法大致类似,f.call(b);的意思 是,执行f函数,并将f函数执行期活动对象里的this指向b对象,这样标示符解析时,this就会是b对象了。不过调用函数是要传参的。因此,f.call(b, x, y); f.apply(b, [x, y]);好吧,以上就是用call方法执行f函数,与用apply方法执行f函数时传参方式,它们之间的差别,你们一目了然:apply经过数组的方式传递参数,call经过一个个的形参传递参数。

(4)、一些函数特殊执行状况this的指向问题:

a、setTimeout()和setInverval():

var a = function(){ console.log(this); } setTimeout(a,0);/*window*/

setInterval()相似。

b、dom模型中触发事件的回调方法执行中活动对象里的this指向该dom对象。

1四、JavaScript对象的几种建立方式?

(1) var obj = new Object();

(1) 工厂模式

复制代码
function Parent(){ var Child = new Object(); Child.name="欲泪成雪"; Child.age="20"; return Child; }; var x = Parent();
复制代码

引用该对象的时候,这里使用的是 var x = Parent()而不是 var x = new Parent();由于后者会可能出现不少问题(前者也成为工厂经典方式,后者称之为混合工厂方式),不推荐使用new的方式使用该对象

(2)构造函数方式

复制代码
function Parent(){   this.name="欲泪成雪";   this.age="20"; }; var x =new Parent();
复制代码

(3) 原型模式

复制代码
function Parent(){ }; Parent.prototype.name="欲泪成雪"; Parent.prototype.age="20"; var x =new Parent();
复制代码

(4)混合的构造函数,原型方式(推荐)

复制代码
function Parent(){   this.name="欲泪成雪";   this.age=22; }; Parent.prototype.lev=function(){   return this.name; }; var x =new Parent();
复制代码

(5)动态原型方式

复制代码
function Parent(){   this.name="欲泪成雪";   this.age=22; ; if(typeof Parent._lev=="undefined"){ Parent.prototype.lev=function(){   return this.name; } Parent._lev=true; } }; var x =new Parent();
复制代码

1五、get和post的区别,什么时候使用post?

(1)、get 是从服务器上获取数据,post 是向服务器传送数据。 get 请求返回 request - URI 所指出的任意信息。 Post 请求用来发送电子邮件、新闻或发送能由交互用户填写的表格。这是惟一须要在请求中发送body的请求。使用Post请求时须要在报文首部 Content - Length 字段中指出body的长度。

(2)、get 是把参数数据队列加到提交表单的ACTION属性所指的URL中,值和表单内各个字段一一对应,在URL中能够看到。post是经过HTTP post机制,将表单内各个字段与其内容放置在HTML HEADER内一块儿传送到ACTION属性所指的URL地址,用户看不到这个过程。

(3)、对于 get 方式,服务器端用Request.QueryString获取变量的值,对于 post 方式,服务器端用Request.Form获取提交的数据。

(4)、get 传送的数据量较小,不能大于2KB。post 传送的数据量较大,通常被默认为不受限制。但理论上,IIS4中最大量为80KB,IIS5中为100KB。 用IIS过滤器的只接受get参数,因此通常大型搜索引擎都是用get方式。

(5)get安全性很是低,post 安全性相对较高。若是这些数据是中文数据并且是 非敏感数据,那么使用get;若是用户输入的数据不是中文字符并且包含敏感数据,那么仍是使用 post 为好。

1六、null和undefined的区别?

(1)、null是一个表示"无"的对象,转为数值时为0;undefined是一个表示"无"的原始值,转为数值时为NaN。当声明的变量还未被初始化时,变量的默认值为undefined。

(2)、null用来表示还没有存在的对象,经常使用来表示函数企图返回一个不存在的对象。

(3)、undefined表示"缺乏值",就是此处应该有一个值,可是尚未定义。典型用法是:

a、变量被声明了,但没有赋值时,就等于undefined。

b、调用函数时,应该提供的参数没有提供,该参数等于undefined。

c、对象没有赋值的属性,该属性的值为undefined。

d、函数没有返回值时,默认返回undefined。

(4)、null表示"没有对象",即该处不该该有值。典型用法是:

a、做为函数的参数,表示该函数的参数不是对象。

b、做为对象原型链的终点。

1七、请写出js内存泄漏的问题?

回答一:

(1)、IE7/8 DOM对象或者ActiveX对象循环引用致使内存泄漏

a、多个对象循环引用

b、循环引用本身

(2)、基础的DOM泄漏 当原有的DOM被移除时,子结点引用没有被移除则没法回收。

(3)、timer定时器泄漏 这个时候你没法回收buggyObject,解决办法,先中止timer而后再回收

回答二:

内存泄漏指任何对象在您再也不拥有或须要它以后仍然存在。

垃圾回收器按期扫描对象,并计算引用了每一个对象的其余对象的数量。若是一个对象的引用数量为 0(没有其余对象引用过该对象),或对该对象的唯一引用是循环的,那么该对象的内存便可回收。

setTimeout 的第一个参数使用字符串而非函数的话,会引起内存泄漏。

闭包、控制台日志、循环(在两个对象彼此引用且彼此保留时,就会产生一个循环)也会引起内存泄漏问题。

1八、哪些地方会出现css阻塞,哪些地方会出现js阻塞?

js的阻塞特性:全部浏览器在下载JS的时候,会阻止一切其余活动,好比其余资源的下载,内容的呈现等等。直到JS下载、解析、执行完毕后才开始继续并行下载其余资源并呈现内容。为了提升用户体验,新一代浏览器都支持并行下载JS,可是JS下载仍然会阻塞其它资源的下载(例如.图片,css文件等)。

因为浏览器为了防止出现JS修改DOM树,须要从新构建DOM树的状况,因此就会阻塞其余的下载和呈现。

嵌入JS会阻塞全部内容的呈现,而外部JS只会阻塞其后内容的显示,2种方式都会阻塞其后资源的下载。也就是说外部样式不会阻塞外部脚本的加载,但会阻塞外部脚本的执行。

CSS怎么会阻塞加载?CSS原本是能够并行下载的,在什么状况下会出现阻塞加载了(在测试观察中,IE6下CSS都是阻塞加载) 当CSS后面跟着嵌入的JS的时候,该CSS就会出现阻塞后面资源下载的状况。而当把嵌入JS放到CSS前面,就不会出现阻塞的状况了。 根本缘由:由于浏览器会维持html中css和js的顺序,样式表必须在嵌入的JS执行前先加载、解析完。而嵌入的JS会阻塞后面的资源加载,因此就会出现上面CSS阻塞下载的状况。

JS应该放在什么位置?

(1)、放在底部,虽然放在底部照样会阻塞全部呈现,但不会阻塞资源下载。

(2)、若是嵌入JS放在head中,请把嵌入JS放在CSS头部。

(3)、使用defer(只支持IE)

(4)、不要在嵌入的JS中调用运行时间较长的函数,若是必定要用,能够用`setTimeout`来调用

Javascript无阻塞加载具体方式

将脚本放在底部。<link>仍是放在head中,用以保证在js加载前,能加载出正常显示的页面。<script>标签放在</body>前。

成组脚本:因为每一个<script>标签下载时阻塞页面解析过程,因此限制页面的<script>总数也能够改善性能。适用于内联脚本和外部脚本。

非阻塞脚本:等页面完成加载后,再加载js代码。也就是,在window.onload事件发出后开始下载代码。

(1)defer属性:支持IE4和fierfox3.5更高版本浏览器

(2)动态脚本元素:文档对象模型(DOM)容许你使用js动态建立HTML的几乎所有文档内容。代码以下:

复制代码
<script>
var script=document.createElement("script"); script.type="text/javascript"; script.src="file.js"; document.getElementsByTagName("head")[0].appendChild(script); </script>
复制代码

此技术的重点在于:不管在何处启动下载,文件额下载和运行都不会阻塞其余页面处理过程。即便在head里(除了用于下载文件的http连接)。

1九、对比Flash与ajax哪一个好,在使用中如何取舍?

Ajax的优点:

(1)、可搜索性 普通的文本网页会更有利于SEO。文本内容是搜索引擎容易检索的,而繁琐的swf字节码倒是搜索引擎不肯触及的。虽然Google等一些大型的搜索引擎能够检索SWF内部的内容,可是仍然有不少麻烦存在。

(2)、开放性 Flash常年以来被Macromedia看的很死。包括Flex、FMS等辅佐技术一直都须要昂贵的安装、维护费用。而JS则没有这样的麻烦。没有人愿意承担法律和版权的风险。 费用 Flash开发是很昂贵的,由于FlashIDE等环境都是要收费的.而Ajax则不一样.虽然有一些便宜的生成swf的工具,可是他们的工能实在没法知足复杂需求。

(3)、易用性 Ajax程序有更好的易用性。因为中间有一层Flashplayer代理层,所以许多辅助功能没法被Flash灵活利用。并且Flash在一些方面有着很差的口碑。好比弹出广告、好比恶意代码。 (awflasher.com我的认为这八成是乱上xx网站形成的)

(4)、易于开发 人们开发复杂的Ajax和Flash应用程序时,都会借助一些高级的开发工具。广泛来讲,Ajax的开发包比Flash简便、容易。

Flash的优点:

(1)、多媒体处理 Flash在音频、视频等多媒体领域相比HTML有绝对的优点。如今几乎全部的网站都包含有Flash内容。

(2)、兼容性 兼容性好:因为经过了惟一的FlashPlayer“代理”。人们没必要像调试JS那样,在不一样的浏览器中调试程序。

(3)、矢量图型 这是Flash最大的优点,一样处在这一领域的SVG、Canvas element以及Direct彻底不能与Flash相比。

(4)、客户端资源调度 Flash可以更容易的调用浏览器之外的外部资源。好比摄像头、麦克风等。然而这是普通的HTML没法完成的。可是这也许是一个缺点(为何呢?)

Ajax的劣势:

(1)、它可能破坏浏览器的后退功能 

(2)、使用动态页面更新使得用户难于将某个特定的状态保存到收藏夹中 ,不过这些都有相关方法解决。

Flash的劣势:

(1)、二进制格式

(2)、格式私有

(3)、flash 文件常常会很大,用户第一次使用的时候须要忍耐较长的等待时间 

(4)/性能问题

ajax与flash各有利弊,到底哪一个好,这取决于你的需求

20、请你解释一下事件冒泡机制?

a、在一个对象上触发某类事件(好比单击onclick事件),若是此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,若是没有定义此事件处理程序或者事件返回true,那么这个事件会向这个对象的父级对象传播,从里到外,直至它被处理(父级对象全部同类事件都将被激活),或者它到达了对象层次的最顶层,即document对象(有些浏览器是window)。

b、冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发

c、js冒泡机制是指若是某元素定义了事件A,如click事件,若是触发了事件以后,没有阻止冒泡事件,那么事件将向父级元素传播,触发父类的click函数。

复制代码
//阻止冒泡时间方法,兼容ie(e.cancleBubble)和ff(e.stopProgation) function stopBubble(e){ var evt = e||window.event; evt.stopPropagation?evt.stopPropagation():(evt.cancelBubble=true);//阻止冒泡 evt.preventDefault
复制代码

2一、请你说说split()与join() 函数的区别?

前者是切割成数组的形式,后者是将数组转换成字符串

Join 函数获取一批字符串,而后用分隔符字符串将它们联接起来,从而返回一个字符串。Split 函数获取一个字符串,而后在分隔符处将其断开,从而返回一批字符串。可是,这两个函数之间的主要区别在于 Join 能够使用任何分隔符字符串将多个字符串链接起来,而 Split 只能使用一个字符分隔符将字符串断开。 简单地说,若是你用split,是把一串字符(根据某个分隔符)分红若干个元素存放在一个数组里。而Join是把数组中的字符串连成一个长串,能够大致上认为是split的逆操做。

2二、说说你对Promise的理解?

ES6 原生提供了 Promise 对象。

所谓 Promise,就是一个对象,用来传递异步操做的消息。它表明了某个将来才会知道结果的事件(一般是一个异步操做),而且这个事件提供统一的 API,可供进一步处理。

Promise 对象有如下两个特色。

(1)、对象的状态不受外界影响。Promise 对象表明一个异步操做,有三种状态:Pending(进行中)、Resolved(已完成,又称 Fulfilled)和 Rejected(已失败)。只有异步操做的结果,能够决定当前是哪种状态,任何其余操做都没法改变这个状态。这也是 Promise 这个名字的由来,它的英语意思就是「承诺」,表示其余手段没法改变。

(2)、一旦状态改变,就不会再变,任什么时候候均可以获得这个结果。Promise 对象的状态改变,只有两种可能:从 Pending 变为 Resolved 和从 Pending 变为 Rejected。只要这两种状况发生,状态就凝固了,不会再变了,会一直保持这个结果。就算改变已经发生了,你再对 Promise 对象添加回调函数,也会当即获得这个结果。这与事件(Event)彻底不一样,事件的特色是,若是你错过了它,再去监听,是得不到结果的。

有了 Promise 对象,就能够将异步操做以同步操做的流程表达出来,避免了层层嵌套的回调函数。此外,Promise 对象提供统一的接口,使得控制异步操做更加容易。

Promise 也有一些缺点。首先,没法取消 Promise,一旦新建它就会当即执行,没法中途取消。其次,若是不设置回调函数,Promise 内部抛出的错误,不会反应到外部。第三,当处于 Pending 状态时,没法得知目前进展到哪个阶段(刚刚开始仍是即将完成)。

2三、谈谈你对Javascript垃圾回收机制的理解?

(1)、标记清除(mark and sweep)

这是`JavaScript`最多见的垃圾回收方式,当变量进入执行环境的时候,好比函数中声明一个变量,垃圾回收器将其标记为“进入环境”,当变量离开环境的时候(函数执行结束)将其标记为“离开环境”。

垃圾回收器会在运行的时候给存储在内存中的全部变量加上标记,而后去掉环境中的变量以及被环境中变量所引用的变量(闭包),在这些完成以后仍存在标记的就是要删除的变量了

(2)、引用计数(reference counting)

在低版本`IE`中常常会出现内存泄露,不少时候就是由于其采用引用计数方式进行垃圾回收。引用计数的策略是跟踪记录每一个值被使用的次数,当声明了一个 变量并将一个引用类型赋值给该变量的时候这个值的引用次数就加1,若是该变量的值变成了另一个,则这个值得引用次数减1,当这个值的引用次数变为0的时 候,说明没有变量在使用,这个值无法被访问了,所以能够将其占用的空间回收,这样垃圾回收器会在运行的时候清理掉引用次数为0的值占用的空间。

在IE中虽然`JavaScript`对象经过标记清除的方式进行垃圾回收,但BOM与DOM对象倒是经过引用计数回收垃圾的,也就是说只要涉及BOM及DOM就会出现循环引用问题。

2四、说说你对原型(prototype)理解?

JavaScript是一种经过原型实现继承的语言与别的高级语言是有区别的,像java,C#是经过类型决定继承关系的,JavaScript是的动态的弱类型语言,总之能够认为JavaScript中全部都是对象,在JavaScript中,原型也是一个对象,经过原型能够实现对象的属性继承,JavaScript的对象中都包含了一个" prototype"内部属性,这个属性所对应的就是该对象的原型。

"prototype"做为对象的内部属性,是不能被直接访问的。因此为了方便查看一个对象的原型,Firefox和Chrome内核的JavaScript引擎中提供了"__proto__"这个非标准的访问器(ECMA新标准中引入了标准对象原型访问器"Object.getPrototype(object)")。

原型的主要做用就是为了实现继承与扩展对象。

2五、typeof与instanceof的区别是什么?

在 JavaScript 中,判断一个变量的类型能够用typeof

(1)、数字类型, typeof 返回的值是 number。好比说:typeof(1),返回值是number

(2)、字符串类型, typeof 返回的值是 string。好比typeof("123")返回值是string。

(3)、布尔类型, typeof 返回的值是 boolean 。好比typeof(true)返回值是boolean。

(4)、对象、数组、null 返回的值是 object 。好比typeof(window),typeof(document),typeof(null)返回的值都是object。

(5)、函数类型,返回的值是 function。好比:typeof(eval),typeof(Date)返回的值都是function。

(6)、不存在的变量、函数或者undefined,将返回undefined。好比:typeof(abc)、typeof(undefined)都返回undefined。

在 JavaScript 中,instanceof用于判断某个对象是否被另外一个函数构造。

使用 typeof 运算符时采用引用类型存储值会出现一个问题,不管引用的是什么类型的对象,它都返回 "object"。ECMAScript 引入了另外一个 Java 运算符 instanceof 来解决这个问题。instanceof 运算符与 typeof 运算符类似,用于识别正在处理的对象的类型。与 typeof 方法不一样的是,instanceof 方法要求开发者明确地确认对象为某特定类型。

2六、说说你对node.js的理解?

a、Node.js 是一个基于Google Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型,使其轻量又高效。Node.js 的包管理器 npm,是全球最大的开源库生态系统。

b、能方便地搭建响应速度快、易于扩展的网络应用,Node.js 使用事件驱动, 非阻塞I/O 模型而得以轻量和高效,很是适合在分布式设备上运行的数据密集型的实时应用。

c、简单说Node.js就是运行在服务器端的JavaScript,是如今流行的语言中能同时运行在前端与后台的程序语言

2七、NPM(包管理器)做用是什么?

NPM是随同NodeJS一块儿安装的包管理工具,能解决NodeJS代码部署上的不少问题,常见的使用场景有如下几种:

a、容许用户从NPM服务器下载别人编写的第三方包到本地使用。

b、容许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。

c、容许用户将本身编写的包或命令行程序上传到NPM服务器供别人使用。

2八、请简要说说你对Javascript面向对象的理解?

为了说明 JavaScript 是一门完全的面向对象的语言,首先有必要从面向对象的概念着手 , 探讨一下面向对象中的几个概念:

a、一切事物皆对象

b、对象具备封装和继承特性

c、对象与对象之间使用消息通讯,各自存在信息隐藏

以这三点作为依据,C++ 是半面向对象半面向过程语言,由于,虽然他实现了类的封装、继承和多态,但存在非对象性质的全局函数和变量。Java、C# 是彻底的面向对象语言,它们经过类的形式组织函数和变量,使之不能脱离对象存在。但这里函数自己是一个过程,只是依附在某个类上。

然而,面向对象仅仅是一个概念或者编程思想而已,它不该该依赖于某个语言存在。好比 Java 采用面向对象思想构造其语言,它实现了类、继承、派生、多态、接口等机制。可是这些机制,只是实现面向对象编程的一种手段,而非必须。换言之,一门语言能够根据其自身特性选择合适的方式来实现面向对象。因此,因为大多数程序员首先学习或者使用的是相似 Java、C++ 等高级编译型语言(Java 虽然是半编译半解释,但通常作为编译型来说解),于是先入为主地接受了“类”这个面向对象实现方式,从而在学习脚本语言的时候,习惯性地用类式面向对象语言中的概念来判断该语言是不是面向对象语言,或者是否具有面向对象特性。这也是阻碍程序员深刻学习并掌握 JavaScript 的重要缘由之一。

实际上,JavaScript 语言是经过一种叫作 原型(prototype)的方式来实现面向对象编程的。下面就来讨论 基于类的(class-based)面向对象和 基于原型的 (prototype-based) 面向对象这两种方式在构造客观世界的方式上的差异。

基于类的面向对象和基于原型的面向对象方式比较在基于类的面向对象方式中,对象(object)依靠类(class)来产生。而在基于原型的面向对象方式中,对象(object)则是依靠 构造器(constructor)利用 原型(prototype)构造出来的。举个客观世界的例子来讲明二种方式认知的差别。例如工厂造一辆车,一方面,工人必须参照一张工程图纸,设计规定这辆车应该如何制造。这里的工程图纸就比如是语言中的 类 (class),而车就是按照这个 类(class)制造出来的;另外一方面,工人和机器 ( 至关于 constructor) 利用各类零部件如发动机,轮胎,方向盘 ( 至关于 prototype 的各个属性 ) 将汽车构造出来。

事实上关于这两种方式谁更为完全地表达了面向对象的思想,目前尚有争论。但笔者认为原型式面向对象是一种更为完全的面向对象方式,理由以下:

(1)、首先,客观世界中的对象的产生都是其它实物对象构造的结果,而抽象的“图纸”是不能产生“汽车”的,也就是说,类是一个抽象概念而并不是实体,而对象的产生是一个实体的产生;

(2)、其次,按照一切事物皆对象这个最基本的面向对象的法则来看,类 (class) 自己并非一个对象,然而原型方式中的构造器 (constructor) 和原型 (prototype) 自己也是其余对象经过原型方式构造出来的对象。

(3)、再次,在类式面向对象语言中,对象的状态 (state) 由对象实例 (instance) 所持有,对象的行为方法 (method) 则由声明该对象的类所持有,而且只有对象的结构和方法可以被继承;而在原型式面向对象语言中,对象的行为、状态都属于对象自己,而且可以一块儿被继承(参考资源),这也更贴近客观实际。

(4)、最后,类式面向对象语言好比 Java,为了弥补没法使用面向过程语言中全局函数和变量的不便,容许在类中声明静态 (static) 属性和静态方法。而实际上,客观世界不存在所谓静态概念,由于一切事物皆对象!而在原型式面向对象语言中,除内建对象 (build-in object) 外,不容许全局对象、方法或者属性的存在,也没有静态概念。

全部语言元素 (primitive) 必须依赖对象存在。但因为函数式语言的特色,语言元 素所依赖的对象是随着运行时 (runtime) 上下文 context变化而变化的,具体体如今 this指针的变化。正是这种特色更贴近“万物皆有所属,宇宙乃万物生存之根本”的天然 观点。在 程序清单 1中 window 便相似与宇宙的概念。

2九、你对JavaScript函数的理解是?

javascript中的函数就是对象,对象就是“键/值”对的集合并拥有一个链接到原型对隐藏链接。

(1)、参数对象 (arguments)

第一个函数中有一个默认对象叫arguments,相似数组,但不是数组,该对象是传递给函数的参数。

(2)、构造函数

在javascript中对象构造函数能够建立一个对象。

(3)、函数调用

a、call:调用一个对象的一个方法,以另外一个对象替换当前对象

b、apply:应用某一对象的一个方法,用另外一个对象替换当前对象,与call相似。

c、caller:在一个函数调用另外一个函数时,被调用函数会自动生成一个caller属性,指向调用它的函数对象。若是该函数当前未被调用,或并不是被其余函数调用,则caller为null。

d、Callee:当函数被调用时,它的arguments.callee对象就会指向自身,也就是一个 对本身的引用。

30、简要说说什么是IIFE?它有什么做用?

IIFE即Immediately-Invoked Function Expression,当即执行函数表达式, 当即执行的函数表达式的执行括号应该写在外包括号内。虽然写在内仍是写在外都是有效的,但写在内使得整个表达式看起来更像一个总体,所以推荐这么作。

复制代码
//最经常使用的两种写法 (function(){ /* code */ }()); // 老师推荐写法 (function(){ /* code */ })(); // 固然这种也能够 // 括号和JS的一些操做符(如 = && || ,等)能够在函数表达式和函数声明上消除歧义 // 以下代码中,解析器已经知道一个是表达式了,因而也会把另外一个默认为表达式 // 可是二者交换则会报错 var i = function(){ return 10; }(); true && function(){ /* code */ }(); 0, function(){ /* code */ }(); // 若是你不怕代码晦涩难读,也能够选择一元运算符 !function(){ /* code */ }(); ~function(){ /* code */ }(); -function(){ /* code */ }(); +function(){ /* code */ }(); // 你也能够这样 new function(){ /* code */ } new function(){ /* code */ }() // 带参
复制代码

IIFE的做用

(1)、提升性能:减小做用域查找时间。使用IIFE的一个微小的性能优点是经过匿名函数的参数传递经常使用全局对象window、document、jQuery,在做用域内引用这些全局对象。JavaScript解释器首先在做用域内查找属性,而后一直沿着链向上查找,直到全局范围。将全局对象放在IIFE做用域内提高js解释器的查找速度和性能。

(2)、压缩空间:经过参数传递全局对象,压缩时能够将这些全局对象匿名为一个更加精简的变量名

(3)、避免冲突:匿名函数内部能够造成一个块级的私有做用域。

(4)、依赖加载:能够灵活的加载第三方插件,固然使用模块化加载更好(AMD,CMD)

3一、谈谈你对Function与Object的理解?

Function

函数就是对象,表明函数的对象就是函数对象。全部的函数对象是被Function这个函数对象构造出来的。Function是最顶层的构造器。它构造了系统中全部的对象,包括用户自定义对象,系统内置对象,甚至包括它自已。这也代表Function具备自举性(自已构造本身的能力)。这也间接决定了Function的call和constructor逻辑相同。每一个对象都有一个 constructor 属性,用于指向建立其的函数对象。

a、函数与对象具备相同的语言地位

b、没有类,只有对象

c、函数也是一种对象,所谓的函数对象

d、对象是按引用来传递的

Object

对于Object它是最顶层的对象,全部的对象都将继承Object的原型,可是你也要明确的知道Object也是一个函数对象,因此说Object是被Function构造出来的。

JavaScript 原型链

3二、$.extend与$.fn.extend区别是什么?

$.extend

在jQuery根命名空间下直接调用的方法能够认为是jQuery的静态方法或属性,经常使用方法名来调用,使用.方法名来调用,使用.extend这个静态方法能够完成两个功能:

a、扩展属性或方法给jQuery

b、扩展对象

$.fn.extend

.fn就是jQuery的原型,.fn等于jQuery.prototype,是jQuery的别名。.fn.extend方法的做用是用于扩展jQuery实例对象,也就是咱们从页面中得到的jQuery对象。

.fn扩展了jQuery的原型,让全部的jQuery实例对象都获得的扩展的方法,其它也能够直接修改jQuery.prototype来实现,.fn是jQuery.prototype的简写

3三、什么是链式编程?

几乎在全部基于“类型”的语言中若是调用一个方法后将对象做为方法参数返回则就会造成链式编程 链式编程是将多个操做(多行代码)经过点号"."连接在一块儿成为一句代码。 链式代码一般要求操做有返回值, 但对于不少操做大都是void型,什么也不返回,这样就很难链起来了, 固然也有解决办法,可能不太优雅。 链式编程的新思想在jQuery中已流行使用

示例:

复制代码
return $.each(this, function(index, obj) { $("<span/>").html("+").css("cursor", "pointer").click(function() { $(obj).width($(obj).width() + length); }).insertAfter(obj); });
复制代码

上面的示例中当$.each循环完成后返回this对象,返回的仍然是一个jQuery对象,因此能够继续jQuery编程。

$("button").SuperPlus(10).height(26).width(100).css("color","blue");

3四、请指出 JavaScript中的本地对象、内置对象、宿主对象的区别?

(1)、本地对象

ECMA-262 把本地对象(native object)定义为“独立于宿主环境的 ECMAScript 实现提供的对象”。

再来看一下,“本地对象”包含哪些内容: Object、Function、Array、String、Boolean、Number、Date、RegExp、Error、EvalError、RangeError、ReferenceError、SyntaxError、TypeError、URIError 由此能够看出,简单来讲,本地对象就是 ECMA-262 定义的类(引用类型)。

(2)、内置对象

ECMA-262 把内置对象(built-in object)定义为“由 ECMAScript 实现提供的、独立于宿主环境的全部对象,在 ECMAScript 程序开始执行时出现”。这意味着开发者没必要明确实例化内置对象,它已被实例化了。

一样是“独立于宿主环境”。根据定义咱们彷佛很难分清“内置对象”与“本地对象”的区别。而ECMA-262 只定义了两个内置对象,即 Global 和 Math (它们也是本地对象,根据定义,每一个内置对象都是本地对象)。

如此就能够理解了。内置对象是本地对象的一种。而其包含的两种对象中,Math对象咱们常常用到,可这个Global对象是啥东西呢? Global对象是ECMAScript中最特别的对象,由于实际上它根本不存在,但你们要清楚,在ECMAScript中,不存在独立的函数,全部函数都必须是某个对象的方法。相似于isNaN()、parseInt()和parseFloat()方法等,看起来都是函数,而实际上,它们都是Global对象的方法。

(3)、宿主对象

由ECMAScript实现的宿主环境提供的对象,即咱们网页的运行环境(操做系统和浏览器),全部的BOM和DOM都是宿主对象。 宿主环境提供的全局方法:

alert、confirm、prompt、write、writeln(后面的两种是document的方法)

内置对象是本地对象的一种,本地对象时由官方定义的,而宿主对象至关于由本身定义的对象、DOM对象和BOM对象组成的

3五、请解释一下变量声明提高?

a、变量定义

能够使用var定义变量,变量若是没有赋值,那变量的初始值为undefined。

b、变量做用域

变量做用域指变量起做用的范围。变量分为全局变量和局部变量。全局变量在全局都拥有定义;而局部变量只能在函数内有效。

在函数体内,同名的局部变量或者参数的优先级会高于全局变量。也就是说,若是函数内存在和全局变量同名的局部变量或者参数,那么全局变量将会被局部变量覆盖。

全部不使用var定义的变量都视为全局变量。

相关文章
相关标签/搜索