- 1、JavaScript有哪些垃圾回收机制?
- 2、列举几种类型的DOM节点
- 3、谈谈 script标签中 defer和 async属性的区别。
- 4、说说你对闭包的理解。
- 5、解释一下 unshift()方法。
- 6、encodeURI()和 decodeURI()的作用是什么?
- 7、为什么不建议在 JavaScript中使用 innerHTML?
- 8、如何在不支持 JavaScript的旧浏览器中隐藏 JavaScript代码?
- 9、在DOM操作中怎样创建、添加、移除、替换、插入和查找节点?
- 10、如何实现浏览器内多个标签页之间的通信?
- 11、null和 undefined的区别是什么?
- 12、new操作符的作用是什么?
- 13、JavaScript延迟加载的方式有哪些?
- 14、call()和apply()的区别和作用是什么?
- 15、哪些操作会造成内存泄漏?
- 16、列举IE与 firefox的不同之处。
- 17、讲解一下 JavaScript对象的几种创建方式。
- 18、如何实现异步编程?
- 19、请解释一下 JavaScript的同源策略。
- 20、为什么要有同源限制?
- 21、在 JavaScript中,为什么说函数是第一类对象?
- 22、什么是事件?IE与 Firefox的事件机制有什么区别?如何阻止冒泡?
- 23、函数声明与函数表达式的区别?
- 24、如何删除一个 cookie?
- 25、编写一个方法,求一个字符串的长度(单位是字节)
- 26、对于元素, attribute和 property的区别是什么?
- 27、解释延迟脚本在 JavaScript中的作用。
- 28、什么是闭包( closure)?
- 29、如何判断一个对象是否属于某个类?
- 30、JavaScript中如何使用事件处理程序?
- 31、在 JavaScript中有一个函数,执行直接对象查找时,它始终不会查找原型,这个函数是什么?
- 32、在 JavaScript中如何使用DOM?
- 33、documen.wrte和 innerHTML的区别是什么?
- 34、在 JavaScript中读取文件的方法是什么?
- 35、如何分配对象属性?
- 36、请说几条书写 JavaScript语句的基本规范。
- 37、eval的功能是什么?
- 38、[“1,”2,”3”].map( parselnt)的执行结果是多少?
- 39、谈谈你对this对象的理解。
- 40、Web- garden和web-farm有什么不同?
- 41、说一下 document. write()的用法。
- 42、在 JavaScript中什么是类(伪)数组?如何将类(伪)数组转化为标准数组?
- 43、JavaScript中callee和 caller的作用是什么?
- 44、讲一下手写数组快速排序的步骤。
- 45、如何统计字符串“ aaaabbbccccddfgh”中字母的个数或统计最多的字母数?
- 46、写一个 function,清除字符串前后的空格(兼容所有浏览器)。
- 47、列出不同浏览器中关于 JavaScript兼容性的两个常见问题。
- 48、闭包的优缺点是什么?
- 49、用 JavaScript实现一个数组合并的方法(要求去重)。
- 50、说明正则表达式给所有string对象添加去除首尾空白符的方法(trim方法)。
1、JavaScript有哪些垃圾回收机制?
有以下垃圾回收机制。
标记清除( mark and sweep)
这是 JavaScript最常见的垃圾回收方式。当变量进入执行环境的时候,比如在函数中声明一个变量,垃圾回收器将其标记为“进入环境”。当变量离开环境的时候(函数执行结束),将其标记为“离开环境”。
垃圾回收器会在运行的时候给存储在内存中的所有变量加上标记,然后去掉环境中的变量,以及被环境中变量所引用的变量(闭包)的标记。在完成这些之后仍然存在的标记就是要删除的变量。
引用计数( reference counting)
在低版本的E中经常会发生内存泄漏,很多时候就是因为它采用引用计数的方式进行垃圾回收。引用计数的策略是跟踪记录每个值被使用的次数。
当声明了一个变量并将个引用类型赋值给该变量的时候,这个值的引用次数就加1.如果该变量的值变成了另外一个,则这个值的引用次数减1.当这个值的引用次数变为0的时候,说明没有变量在使用,这个值没法被访问。
因此,可以将它占用的空间回收,这样垃圾回收器会在运行的时候清理引用次数为0的值占用的空间在正中虽然 JavaScript对象通过标记清除的方式进行垃圾回收,但是BOM与DOM对象是用引用计数的方式回收垃圾的。
也就是说,只要涉及BOM和DOM,就会出现循环引用问题
2、列举几种类型的DOM节点
有以下几类DOM节点。
整个文档是一个文档( Document)节点。
每个HTML标签是一个元素( Element)节点。
每一个HTML属性是一个属性( Attribute)节点。
包含在HTML元素中的文本是文本(Text)节点。
3、谈谈 script标签中 defer和 async属性的区别。
区别如下。
(1) defer属性规定是否延迟执行脚本,直到页面加载为止, async属性规定脚本一旦可用,就异步执行。
(2) defer并行加载 JavaScript文件,会按照页面上 script标签的顺序执行, async并行加载 JavaScript文件,下载完成立即执行,不会按照页面上 script标签的顺序执行。
4、说说你对闭包的理解。
使用闭包主要是为了设计私有的方法和变量。闭包的优点是可以避免全局变量的污染;缺点是闭包会常驻内存,增加内存使用量,使用不当很容易造成内存泄漏。在JavaScript中,函数即闭包,只有函数才会产生作用域闭包有3个特性
(1)函数嵌套函数。
(2)在函数内部可以引用外部的参数和变量
(3)参数和变量不会以垃圾回收机制回收
5、解释一下 unshift()方法。
该方法在数组启动时起作用,与 push()不同。它将参数成员添加到数组的顶部下面给出一段示例代。
var name=["john"]
name. unshift("charlie");
name.unshift("joseph","Jane");
console. log(name);
输出如下所示。
[" joseph "," Jane "," charlie "," john "]
6、encodeURI()和 decodeURI()的作用是什么?
encodeURI()用于将URL转换为十六进制编码。而 decodeURI()用于将编码的URL转换回正常URL。
7、为什么不建议在 JavaScript中使用 innerHTML?
通过 innerHTML修改内容,每次都会刷新,因此很慢。在 innerHTML中没有验证的机会,因此更容易在文档中插入错误代码,使网页不稳定。
8、如何在不支持 JavaScript的旧浏览器中隐藏 JavaScript代码?
在< script>标签之后的代码中添加“<!—”,不带引号。
在< /script>标签之前添加“//—>”,代码中没有引号。
旧浏览器现在将 JavaScript代码视为一个长的HTML注释,而支持 JavaScript的浏览器则将”<!-“和”//—>”作为一行注释。
9、在DOM操作中怎样创建、添加、移除、替换、插入和查找节点?
具体方法如下。
(1)通过以下代码创建新节点。
createDocument Fragment ()
//创建一个D0M片段
createElement ()
//创建一个具体的元素
createTextNode ()
//创建一个文本节点
(2)通过以下代码添加、移除、替换、插入节点
appendchild()
removechild()
replacechild ()
insertBefore ()
//并没有 insertAfter()
(3)通过以下代码查找节点。
getElementsByTagName ()
//通过标签名称查找节点
getElementsByName ()
//通过元素的name属性的值查找节点(IE容错能力较强,会得到一个数//组,其中包括id等于name值的节点)
getElementById(
//通过元素Id查找节点,具有唯一性
10、如何实现浏览器内多个标签页之间的通信?
调用 localstorge、 cookie等数据存储通信方式
11、null和 undefined的区别是什么?
null是一个表示“无”的对象,转为数值时为0;undefined是一个表示“无”的原始值,转为数值时为NaN。
当声明的变量还未初始化时,变量的默认值为 undefined 。
null用来表示尚未存在的对象,常用来表示函数企图返回一个不存在的对象。
undefined表示“缺少值”,即此处应该有一个值,但是还没有定义,典型用法是如下。
(1)如果变量声明了,但没有赋值,它就等于 undefined
(2)当调用函数时,如果没有提供应该提供的参数,该参数就等于 undefined。
(3)如果对象没有赋值,该属性的值为 undefined。
(4)当函数没有返回值时,默认返回 undefined。
null表示“没有对象”,即此处不应该有值,典型用法是如下。
(1)作为函数的参数,表示该函数的参数不是对象。
(2)作为对象原型链的终点。
12、new操作符的作用是什么?
作用如下:
(1)创建一个空对象。
(2)由this变量引用该对象
(3)该对象继承该函数的原型(更改原型链的指向)
(4)把属性和方法加入到this引用的对象中。
(5)新创建的对象由this引用,最后隐式地返回this,过程如下:
var obj ={};
obj._ _ proto_ _ Base .prototype;
Base .call(obj);
13、JavaScript延迟加载的方式有哪些?
包括 defer和 async、动态创建DOM(创建 script,插入DOM中,加载完毕后回调、按需异步载入 JavaScript。
14、call()和apply()的区别和作用是什么?
作用都是在函数执行的时候,动态改变函数的运行环境(执行上下文)。
call和 apply的第一个参数都是改变运行环境的对象。
区别如下。
call从第二个参数开始,每一个参数会依次传递给调用函数;apply的第二个参数是数组,数组的每一个成员会依次传递给调用函数。
如
func, call(funcl, varl, var2, var3)
对应的 apply写法为:
func. apply (funcl, [varl, var2, var3])
15、哪些操作会造成内存泄漏?
内存泄漏指不再拥有或需要任何对象(数据)之后,它们仍然存在于内存中。
提示:垃圾回收器定期扫描对象,并计算引用了每个对象的其他对象的数量。如果一个对象的引用数量为0(没有其他对象引用过该对象),或对该对象的唯一引用是循环的,那么该对象占用的内存立即被回收。
如果 setTimeout的第一个参数使用字符串而非函数,会引发内存泄漏闭包、控制台日志、循环(在两个对象彼此引用且彼此保留时,就会产生一个循环)等会造内存泄漏。
16、列举IE与 firefox的不同之处。
不同之处如下
(1)IE支持 currentStyle;Firefox使用 get ComputStyle。
(2)IE使用 inner Text;Firefox使用 textContent。
(3)在透明度滤镜方面,正使用 filter:alpha( opacity=num);Firefox使用-moz- opacity :num
(4)在事件方面,IE使用 attachEvent:Firefox使用 add Event Listener
(5)对于鼠标位置:IE使用 event. clientX;Firefox使用 event. pageX。
(6)IE使用 event. srcElement;Firefox使用 event. target
(7)要消除list的原点,IE中仅须使 margin:0即可达到最终效果;Firefox中需要设置margin:0、 padding:0和 list-style:none
(8)CSS圆角:IE7以下不支持圆角。
17、讲解一下 JavaScript对象的几种创建方式。
有以下创建方式:
(1) Object构造函数式。
(2)对象字面量式。
(3)工厂模式。
(4)安全工厂模式。
(5)构造函数模式。
(6)原型模式。
(7)混合构造函数和原型模式。
(8)动态原型模式。
(9)寄生构造函数模式。
(10)稳妥构造函数模式。
18、如何实现异步编程?
具体方法如下:
方法1,通过回调函数。优点是简单、容易理解和部署;缺点是不利于代码的阅读和维护,各个部分之间高度耦合( Coupling),流程混乱,而且每个任务只能指定一个回调函数。
方法2,通过事件监听,可以绑定多个事件,每个事件可以指定多个回调函数,而且可以“去耦合”( Decoupling),有利于实现模块化;缺点是整个程序都要变成事件驱动型,运行流程会变得很不清晰。
方法3,采用发布/订阅方式。性质与“事件监听”类似,但是明显优于后者。
方法4,通过 Promise对象实现, Promise对象是 Commonjs工作组提出的一种规范,旨在为异步编程提供统一接口。它的思想是,每一个异步任务返回一个 Promise对象,该对象有一个then方法,允许指定回调函数。
19、请解释一下 JavaScript的同源策略。
同源策略是客户端脚本(尤其是 JavaScript)的重要安全度量标准。它最早出自Netscape Navigator2.0,目的是防止某个文档或脚本从多个不同源装载。
这里的同源策略指的是协议、域名、端口相同。同源策略是一种安全协议。指一段脚本只能读取来自同一来源的窗口和文档的属性。
20、为什么要有同源限制?
我们举例说明。比如一个黑客,他利用 Iframe把真正的银行登录页面嵌到他的页面上,当你使用真实的用户名、密码登录时,他的页面就可以通过 Javascript读取到你表单上 Input中的内容,这样黑客就会轻松得到你的用户名和密码。
21、在 JavaScript中,为什么说函数是第一类对象?
第一类函数即 JavaScript中的函数。这通常意味着这些函数可以作为参数传递给其他函数,作为其他函数的值返回,分配给变量,也可以存储在数据结构中。
22、什么是事件?IE与 Firefox的事件机制有什么区别?如何阻止冒泡?
事件是在网页中的某个操作(有的操作对应多个事件)例如,当单击一个按钮时,就会产生一个事件,它可以被 JavaScript侦测到,在事件处理机制上,正E支持事件冒泡;Firefox同时支持两种事件模型,也就是捕获型事件和冒泡型事件。
阻止方法是 ev.stop Propagation.注意旧版E中的方法 ev. cancelBubble=true.
23、函数声明与函数表达式的区别?
在 JavaScript中,在向执行环境中加载数据时,解析器对函数声明和函数表达式并非是一视同仁的。解析器会首先读取函数声明,并使它在执行任何代码之前可用(可以访问)。至于函数表达式,则必须等到解析器执行到它所在的代码行,才会真正解析和执行它。
24、如何删除一个 cookie?
为了删除 cookie,要修改 expires,代码如下。
document. cookie =’user=icketang;expires =’+ new Date(0)
25、编写一个方法,求一个字符串的长度(单位是字节)
假设一个英文字符占用一字节,一个中文字符占用两字节:
function GetBytes(str){
var len=str .length;
var bytes= len;
for(var i=0:i<len;1++){
if (str. charcodeAt (i)>255) bytes++;
}
return bytes;
}
alert( GetBytes("hello 你好世界!"));
26、对于元素, attribute和 property的区别是什么?
attribute是DOM元素在文档中作为HTML标签拥有的属性;property就是DOM元素在 JavaScript中作为对象拥有的属性。
对于HTML的标准属性来说, attribute和 property是同步的,会自动更新,但是对于自定义的属性来说,它们是不同步的。
27、解释延迟脚本在 JavaScript中的作用。
默认情况下,在页面加载期间,HTML代码的解析将暂停,直到脚本停止执行。
这意味着,如果服务器速度较慢或者脚本特别“沉重”,则会导致网页延迟。在使用Deferred时,脚本会延迟执行,直到HTML解析器运行。这缩短了网页的加载时间,并且它们的显示速度更快。
28、什么是闭包( closure)?
为了说明闭包,创建一个闭包。
function hello(){
//函数执行完毕,变量仍然存在
var num= 100;
var showResult= function(){ alert (num);}
num++;
return showResult ;
}
var showResult= he1lo();
showResult()//执行结果:弹出101
执行 hello()后, hello()闭包内部的变量会存在,而闭包内部函数的内部变量不会存在,使得 JavaScript的垃圾回收机制不会收回hello()占用的资源,因为hell()中内部函数的执行需要依赖 hello()中的变量。
29、如何判断一个对象是否属于某个类?
使用 instanceof关键字,判断一个对象是否是类的实例化对象;使用 constructor属性,判断一个对象是否是类的构造函数。
30、JavaScript中如何使用事件处理程序?
事件是由用户与页面的交互(例如单击链接或填写表单)导致的操作。需要个事件处理程序来保证所有事件的正确执行。事件处理程序是对象的额外属性。此属性包括事件的名称和事件发生时采取的操作。
31、在 JavaScript中有一个函数,执行直接对象查找时,它始终不会查找原型,这个函数是什么?
32、在 JavaScript中如何使用DOM?
DOM代表文档对象模型,并且负责文档中各种对象的相互交互。DOM是开发网页所必需的,其中包括诸如段落、链接等对象。可以操作这些对象,如添加或删除等。为此,DOM还需要向网页添加额外的功能。
33、documen.wrte和 innerHTML的区别是什么?
document.wite重绘整个页面;innerHTML可以重绘页面的一部分。
34、在 JavaScript中读取文件的方法是什么?
可以通过如下方式读取服务器中的文件内容。
function readAjaxEile(url) {
//创建xhr
var xhr =new XMLHttpRequest();
/监听状态
xhr. onreadystatechange=function(){
//监听状态值是4
if(xhr. readystate == 4 && xhr. status = = =200){
console. log(xhr. responseText)
}
//打开请求
xhr.open('GET', url, true)
//发送数据
xhr, send(null)
}
可以通过如下方式读取本地计算机中的内容。
function readInputFile(id) {
var file= document. getElementById(id). files[0];
//实例化 FileReader
var reader=new FileReader();
//读取文件
reader. readAsText (file)
//监听返回
reader, onload= function (data) {
console. log (data, this .result)
}
}
35、如何分配对象属性?
将属性分配给对象的方式与赋值给变量的方式相同。例如,表单对象的操作值以下列方式分配给” submit”:document.form. action=” submit’”
36、请说几条书写 JavaScript语句的基本规范。
基本规范如下:
(1)不要在同一行声明多个变量。
(2)应使用==/!==来比较true/ false或者数值。
(3)使用对象字面量替代 new Array这种形式。
(4)不要使用全局函数。
(5) switch语句必须带有 default分支。
(6)函数不应该有时有返回值,有时没有返回值。
(7)for循环必须使用大括号括起来。
(8)if语句必须使用大括号括起来。
(9)for-in循环中的变量应该使用war关键字明确限定的作用域,从而避免作用域污染。
37、eval的功能是什么?
它的功能是把对应的字符串解析成 Javascript代码并运行应该避免使用eval,它会造成程序不安全,非常影响性能(执行两次,一次解析成JavaScript语句,一次执行)
38、[“1,”2,”3”].map( parselnt)的执行结果是多少?
[1,NaN,NaN],因为 parseInt需要两个参数(val, radix),其中 radix表示解析时用的基数(进制);map传递了3个参数(item, index,aray),对应的radix不合法导致解析失败。
39、谈谈你对this对象的理解。
this是 JavaScript的一个关键字,随着函数使用场合的不同,this的值会发生变化。但是有一个总原则,即this指的是调用函数的那个对象一般情况下,this是全局对象 Global,可以作为方法调用
40、Web- garden和web-farm有什么不同?
web-garden和 web-farm都是网络托管系统。唯一的区别是 web-garden是在单个服务器中包含许多处理器的设置,而web-farm是使用多个服务器的较大设置。
41、说一下 document. write()的用法。
document. write()方法可以用在两个地方,页面载入过程中用实时脚本创建页面内容,以及用延时脚本创建本窗口或新窗口的内容document. write只能重绘整个页面, innerHTML可以重绘页面的一部分。
42、在 JavaScript中什么是类(伪)数组?如何将类(伪)数组转化为标准数组?
典型的类(伪)数组是函数的 argument参数,在调用 getElements By TagName和 document .childNodes方法时,它们返回的 NodeList对象都属于伪数组。可以使用Array .prototype. slice. call( fake Array)将数组转化为真正的Aray对象。
43、JavaScript中callee和 caller的作用是什么?
caller返回一个关于函数的引用,该函数调用了当前函数;callee返回正在执行的函数,也就是指定的 function对象的正文。
44、讲一下手写数组快速排序的步骤。
“快速排序”的思想很简单,整个排序过程只需要3步
(1)在数据集之中,选择一个元素作为“基准”( pivot)。
(2)将所有小于“基准”的元素,都移到“基准”的左边;将所有大于“基准”的元素,都移到“基准”的右边。
(3)对“基准”左边和右边的两个子集,不断重复第(1)步和第(2)步,直到所有子集只剩下一个元素为止。
45、如何统计字符串“ aaaabbbccccddfgh”中字母的个数或统计最多的字母数?
具体代码如下
var str =aaaabbbecccddfgh";
function dealstr(str){
var obj={};
for (var i= 0;i< str length:i++){
var v=str.charAt (i);
if (obj[v] && obj [v].value === v){
++obj[v]. count
} else {
obj[v] ={
count:1,
va⊥ue:v
}
}
}
return obj ;
}
var obj= dealstr(str);
for (key in obj){
console. log (obj[key] .value +'=' obj[ key].count)
}
46、写一个 function,清除字符串前后的空格(兼容所有浏览器)。
具体代码如下
function trim(str){
if (str && typeof str === "string"){
return str.replace(/^\s+1\s+$/g,"");//去除前后空白符。
47、列出不同浏览器中关于 JavaScript兼容性的两个常见问题。
(1)事件绑定兼容性问题。
IE8以下的浏览器不支持用 add Event Listener来绑定事件,使用 attachement可以解决这个问题
(2) stopPropagation兼容性问题
IE8以下的浏览器不支持用 e .stopPropagation()来阻止事件传播,使用 e .return Value =false可以解决这个问题。
48、闭包的优缺点是什么?
优点是不产生全局变量,实现属性私有化
缺点是闭包中的数据会常驻内存,在不用的时候需要删除,否则会导致内存溢出(内存泄漏)。
49、用 JavaScript实现一个数组合并的方法(要求去重)。
代码如下。
var arrl =['a'];
var arr2 =['b', 'c'];
var arr3=['c', ['d'], 'e', undefined, null];
var concat =( function() {
//去重合并arr1和arr2
var _concat =function (arrl, arr2)
for (var i =0, len= arr2.length; i< len; i++){
~arrl.indexOf(arr2[i])|| arrl.push(arr2[i])
}
}
//返回数组去重合并方法
return function(){
var result =[];
for (var i=0, len= arguments .length;i< len:i++){
_concat(result, arguments [i])
return result
}
})()
执行concat(arrl,ar2,ar3)后,会返回[‘a’,null, undefined,’e’,[‘d],’c’,’b’]。
50、说明正则表达式给所有string对象添加去除首尾空白符的方法(trim方法)。
代码如下。
prototype. trim= function(){
return this .replace(/^\s+I\s+$/g," );
};