JavaScript面试题

1.请写出下面程序输出的结果:    

 var y = 1;

if (function f(){}) {

y += typeof f;

       }

console.log(y); //正确的答案应该是 1undefined。

2.

问答题:

1.null和undefined的差异

undefined:
(1)变量被声明了,但没有赋值时,就等于undefined。
(2) 调用函数时,应该提供的参数没有提供,该参数等于undefined。
(3)对象没有赋值的属性,该属性的值为undefined。
(4)函数没有返回值时,默认返回undefined。
null:
(1) 作为函数的参数,表示该函数的参数不是对象。
(2) 作为对象原型链的终点。

相同点:

    在 if判断语句中,值都默认为 false

    大体上两者都是代表无,具体看差异

差异:

    null转为数字类型值为0,而undefined转为数字类型为 NaN(Not a Number)

    undefined是代表调用一个值而该值却没有赋值,这时候默认则为undefined

    null是一个很特殊的对象,最为常见的一个用法就是作为参数传入(说明该参数不是对象)

    设置为null的变量或者对象会被内存收集器回收

 

2.this对象的理解

 简言之:谁调用指向谁,运行时的上下文确定,而非定义的时候就确定;

 强行绑定 this的话,可以用 call,apply,bind,箭头函数....来修改this的指向

this总是指向函数的直接调用者(而非间接调用者);
如果有new关键字,this指向new出来的那个对象;
在事件中,this指向触发这个事件的对象,特殊的是,IE中的attachEvent中的this总是指向全局对象Window;

 

3.怎么解决跨域问题,有哪些方法

这三种,cors,nginx反向代理,jsonp

  jsonp : 单纯的 get 一些数据,局限性很大...就是利用script标签的src属性来实现跨域。

  nginx 反向代理: 主要就是用了nginx.conf内的proxy_pass http://xxx.xxx.xxx,会把所有请求代理到那个域名,有利也有弊吧..

  cors的话,可控性较强,需要前后端都设置,兼容性 IE10+

 

4.解决JSONP原理,以及为什么不是真正的ajax.

 

Q1:JSONP(JSON with Padding)是JSON的一种”使用模式”,可用于解决主流浏览器的跨域数据访问的问题。由于同源策略, ajax请求受同源策略影响,不允许进行跨域请求,而script标签src属性中的链接却可以访问跨域的js脚本,利用这个特性,服务端不再返回JSON格式的数据,而是返回一段调用某个函数的js代码,在src中进行了调用,这样实现了跨域。

 

Q2:但ajax和jsonp其实本质上是不同的东西。ajax的核心是通过XmlHttpRequest获取非本页内容,而jsonp的核心则是动态添加<script>标签来调用服务器提供的js脚本。

 

6.http请求报头中各个字段的含义

1、通用首部字段

请求报文和响应报文两方都会使用的首部。

2、请求首部字段

从客户端向服务器端发送请求报文时使用的首部。补充了请求的附加内容、客户端信息、响应内容相关优先级等信息。

3、响应首部字段

从服务器端向客户端返回报文时使用的首部。补充了响应的附加内容,也会要求客户端附加额外的内容信息。

4、实体首部字段

针对请求报文和响应报文的实体部分使用的首部。补充了资源内容更新时间等与实体有关的信息。

 

7.ES6中箭头函数this的指向

       window

10.代码Number(null)返回的结果

       0

 

13.JavaScript的本地对象,内置对象和宿主对象

       本地对象:Object、Function、Array、String、Boolean、Number、Date、RegExp、Error、EvalError、RangeError、ReferenceError、SyntaxError、TypeError、URIError

       内置对象:内置对象是本地对象的一种。而其包含的两种对象中,Math对象我们经常用到,可这个Global对象

       宿主对象:浏览器提供的对象。所有的BOM和DOM都是宿主对象。

14.如何阻止事件冒泡和默认事件

       event.stopPropagation()

event.preventDefault()

15.你有哪些性能优化的方法?
(1) 减少http请求次数:CSS Sprites, JS、CSS源码压缩、图片大小控制合适;网页Gzip,CDN托管,data缓存 ,图片服务器。
(2) 前端模板 JS+数据,减少由于HTML标签导致的带宽浪费,前端用变量保存AJAX请求结果,每次操作本地变量,不用请求,减少请求次数
(3) 用innerHTML代替DOM操作,减少DOM操作次数,优化javascript性能。
(4) 当需要设置的样式很多时设置className而不是直接操作style。
(5) 少用全局变量、缓存DOM节点查找的结果。减少IO读取操作。
(6) 避免使用CSS Expression(css表达式)又称Dynamic properties(动态属性)。
(7) 图片预加载,将样式表放在顶部,将脚本放在底部  加上时间戳。

 

16.js有哪些内置对象?
数据封装类对象:Object、Array、Boolean、Number 和 String
其他对象:Function、Arguments、Math、Date、RegExp、Error

 

18.eval是做什么的?
它的功能是把对应的字符串解析成JS代码并运行;
应该避免使用eval,不安全,非常耗性能(2次,一次解析成js语句,一次执行)。
由JSON字符串转换为JSON对象的时候可以用eval,var obj =eval('('+ str +')');

 

19.DOM怎样添加、移除、移动、复制、创建和查找节点

// 创建新节点

createDocumentFragment()    //创建一个DOM片段

createElement()   //创建一个具体的元素

createTextNode()   //创建一个文本节点

// 添加、移除、替换、插入

appendChild()

removeChild()

replaceChild()

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

// 查找

getElementsByTagName()    //通过标签名称

getElementsByName()    //通过元素的Name属性的值(IE容错能力较强,会得到一个数组,其中包括id等于name值的)

getElementById()    //通过元素Id,唯一性

 

21.new操作符具体干了什么呢?
(1)创建一个空对象,并且 this 变量引用该对象,同时还继承了该函数的原型。
(2)属性和方法被加入到 this 引用的对象中。
(3)新创建的对象由 this 所引用,并且最后隐式的返回 this 。


22.JSON 的了解?
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它是基于JavaScript的一个子集。数据格式简单, 易于读写, 占用带宽小。
格式:采用键值对,例如:{'age':'12', 'name':'back'}


23.call() 和 apply() 的区别和作用?
apply()函数有两个参数:第一个参数是上下文,第二个参数是参数组成的数组。如果上下文是null,则使用全局对象代替。
如:function.apply(this,[1,2,3]);
call()的第一个参数是上下文,后续是实例传入的参数序列。
如:function.call(this,1,2,3);

 

24、什么是全局变量?这些变量如何声明,使用全局变量有哪些问题?

全局变量是整个代码长度可用的变量,也就是说这些变量没有任何作用域。var关键字用于声明局部变量或对象。如果省略var关键字,则声明一个全局变量。

例:// Declare a global globalVariable = “Test”;

使用全局变量所面临的问题是本地和全局变量名称的冲突。此外,很难调试和测试依赖于全局变量的代码。

 

25、解释JavaScript中定时器的工作?如果有,也可以说明使用定时器的缺点?

定时器用于在设定的时间执行一段代码,或者在给定的时间间隔内重复该代码。这通过使用函数setTimeout,setInterval和clearInterval来完成。

 setTimeout(function,delay)函数用于启动在所述延迟之后调用特定功能的定时器。setInterval(function,delay)函数用于在提到的延迟中重复执行给定的功能,只有在取消时才停止。clearInterval(id)函数指示定时器停止。

26、JavaScript中的循环结构都有什么?

For、While、do-while loops

27、Void(0)怎么用?

  Void(0)用于防止页面刷新,并在调用时传递参数“zero”。

  Void(0)用于调用另一种方法而不刷新页面。

28、在JavaScript中使用innerHTML的缺点是什么?

如果在JavaScript中使用innerHTML,缺点是:内容随处可见;不能像“追加到innerHTML”一样使用;即使你使用+ = like“innerHTML = innerHTML +'html'”旧的内容仍然会被html替换;整个innerHTML内容被重新解析并构建成元素,因此它的速度要慢得多;innerHTML不提供验证,因此我们可能会在文档中插入有效的和破坏性的HTML并将其中断。

29、break和continue语句的作用?

  Break语句从当前循环中退出。

  continue语句继续下一个循环语句。

30.for-in循环用于循环对象的属性。

for-in循环的语法是:for(var index in obje){}

31.描述JavaScript中的匿名函数?

被声明为没有任何命名标识符的函数被称为匿名函数。一般来说,匿名函数在声明后无法访问。

33.JavaScript怎么清空数组?

1.描述下原型链

 原型链:简单来说就是函数原型通过继承关系联系在一起,形成的链式结构就被叫做原型链。简单来说就是在实现原型继承的时候,会将下级函数的原型和上级函数的实例联系起来,那么多个构造函数相互继承,将彼此的原型联系起来就形成了原型链。

2.js作用域

1)js作用域(全局变量,局部变量)内部可以访问外部,但外部的不能访问内部的

2)不用var 定义变量时,会默认为是全局变量(不规范,不推荐)

3)变量的查找是就近原则去寻找,定义的var变量;第二点,变量的声明被提前到作用域顶部,赋值保留在原地

4)当参数跟局部变量重名的时候,优先级是等同的

5)变量修改的时候另一个变量会跟着变化,但是当变量重新被定义时,则另一个不变化

3.闭包

闭包在什么情况下触发的?

    两个函数或者多个函数互相嵌套,把里面的函数保存到函数的外部,这样的情况就必然会生成闭包。里面的函数在外部执行时,一定能够调用原来函数里所存在的变量。

 闭包:

    当内部函数被保存到外部时,将会生成闭包。闭包会导致原有作用域链不被释放。造成内存泄露。

解决办法:在退出函数之前,将不使用的局部变量全部删除。

4.垃圾回收

5.如何读取对象属性不在原型链上找

       hasOwnProperty()

6.cookie一些属性

Cookie:

服务器发送给浏览器的一个标记,通过Response Header中的Set-Cookie头发送。

浏览器请求的时候,会通过Request Header中的Cookie头把它发送回给服务器。

主要属性:

name-value对:不言自明

Expires:过期时间

Path:cookie在哪个路径下生效。比如www.abc.com/a/index.html设置了一个cookie,那么www.abc.com/a/下面的其他页面也可以访问该cookie,www.abc.com/b/下面的页面就不能访问。如果要突破这个限制,可以设置path为“/”

Domain:表示cookie可以被访问的域,缺省为请求的地址。比如,属于www.abc.com的cookie只能在这个域名的访问中被使用。可以设置这个属性,指定cookie的生效域。如果要设置通用的,可以这样:.abc.com

 

7.浏览器缓存

浏览器缓存部分的分类情况,以及细化分析。主要可分为:

1. 强制缓存

o  Expires字段

o  Cache-Control字段

2. 对比缓存

o  Last-Modefied字段

o  Etag标识

3. 浏览器行为引起的缓存变化

4. 移动端的缓存策略

 

8.http和https协议握手过程、状态码

9.同源策略

浏览器有一个很重要的概念——同源策略(Same-Origin Policy)。所谓同源是指,域名,协议,端口相同。不同源的客户端脚本(javascript、ActionScript)在没明确授权的情况下,不能读写对方的资源。

 

10.web安全有哪些。XSS CSRF产生原理、如何防范。具体转义哪些字符为什么

11.简述同步和异步的区别

同步是阻塞模式,异步是非阻塞模式。

同步就是指一个进程在执行某个请求的时候,若该请求需要一段时间才能返回信息,那么这个进程将会一直等待下去,直到收到返回信息才继续执行下去;

异步是指进程不需要一直等下去,而是继续执行下面的操作,不管其他进程的状态。当有消息返回时系统会通知进程进行处理,这样可以提高执行的效率。

 

 14. Tcp三次握手

第一次握手:客户端发送syn包(syn=j)到服务器,并进入SYN_SEND状态,等待服务器确认;

第二次握手:服务器收到syn包,必须确认客户的SYN(ack=j+1),同时自己也发送一个SYN包(syn=k),即SYN+ACK包,此时服务器进入SYN_RECV状态;

第三次握手:客户端收到服务器的SYN+ACK包,向服务器发送确认包ACK(ack=k+1),此包发送完毕,客户端和服务器进入ESTABLISHED状态,完成三次握手。

 

 15. 响应状态吗表示的意义:
 200:表示成功,正常结果;
 302:表示重定向,转到别的站点;
 304:表示未修改;
 404:表示找不到资源;
 500:表示内部服务器错误;

 16. Dom树的渲染过程

 17. 为什么要先引入css文件,再引入js文件

网页加载时,是按从上到下,从左到右的顺序加载的。所以一定要先加载css文件(不要让用户看到一个杂乱无章的页面),最后再加载js文件,
js一般都是处理功能的,所以不需要提前加载。先给用户观感,再给用户上手体验

 

 19. 怎么在不引入图片的情况下,引入icon  

自定义字体文件

 

 20. Js的基础类型以及es6新增的类型。 

新的数据类型Symbol与新的数据结构set、map

 

 22. 简单说下作用域链

作用域链与一个执行上下文相关,是内部上下文所有变量对象(包括父变量对象)的列表,用于变量查询。

 

 25. 解释一下promise的原理

目前, Promise 是 ECMAScript 6 规范的重要特性之一,各大浏览器也开始慢慢支持这一特性。当然,也有一些第三方内库实现了该功能,如: QwhenWinJSRSVP.js等。

Promise 对象用来进行延迟( deferred )和异步( asynchronous )计算。一个 Promise 处于以下四种状态之一:

  pending: 还没有得到肯定或者失败结果,进行中

  fulfilled: 成功的操作

  rejected: 失败的操作

  settled: 已被 fulfilled 或 rejected

Promise 对象有两个重要的方法,一个是 then ,另一个是 resolve :

  then:将事务添加到事务队列中

  resolve:开启流程,让整个操作从第一个事务开始执行

 

1怎么判断一个object是否是数组(array)?

方法1

使用 Object.prototype.toString 来判断是否是数组

function isArray(obj){ return Object.prototype.toString.call( obj ) === '[object Array]'; }

这里使用call来使 toString 中 this 指向 obj。进而完成判断

方法二

使用 原型链 来完成判断

function isArray(obj){ return obj.__proto__ === Array.prototype; }

基本思想是利用 实例如果是某个构造函数构造出来的那么 它的 __proto__是指向构造函数的 prototype属性。

方法3

利用JQuery

function isArray(obj){ return $.isArray(obj) }

JQuery isArray 的实现其实就是方法1

问题8:下面代码输出什么?

var output = (function(x){ delete x; return x; })(0); console.log(output);

输出是 0。 delete 操作符是将object的属性删去的操作。但是这里的 x 是并不是对象的属性, delete 操作符并不能作用。

问题9:下面代码输出什么?

var x = 1; var output = (function(){ delete x; return x; })(); console.log(output);

输出是 1。delete 操作符是将object的属性删去的操作。但是这里的 x 是并不是对象的属性, delete 操作符并不能作用。

问题10:下面代码输出什么?

var x = { foo : 1}; var output = (function(){ delete x.foo; return x.foo; })(); console.log(output);

输出是 undefined。x虽然是全局变量,但是它是一个object。delete作用在x.foo上,成功的将x.foo删去。所以返回undefined

问题11:下面代码输出什么?

var Employee = { company: 'xyz' } var emp1 = Object.create(Employee); delete emp1.company console.log(emp1.company);

输出是 xyz,这里的 emp1 通过 prototype 继承了 Employee的 company。emp1自己并没有company属性。所以delete操作符的作用是无效的。

问题12:什么是 undefined x 1 ?

在chrome下执行如下代码,我们就可以看到undefined x 1的身影。

var trees = ["redwood","bay","cedar","oak","maple"]; delete trees[3]; console.log(trees);

当我们使用 delete 操作符删除一个数组中的元素,这个元素的位置就会变成一个占位符。打印出来就是undefined x 1。 注意如果我们使用trees[3] === 'undefined × 1'返回的是 false。因为它仅仅是一种打印表示,并不是值变为undefined x 1。

问题13:下面代码输出什么?

var trees = ["xyz","xxxx","test","ryan","apple"]; delete trees[3]; console.log(trees.length);

输出是5。因为delete操作符并不是影响数组的长度。

问题14:下面代码输出什么?

var bar = true; console.log(bar + 0); console.log(bar + "xyz"); console.log(bar + true); console.log(bar + false);

输出是

1 truexyz 2 1

下面给出一个加法操作表

  Number + Number -> 加法

  Boolean + Number -> 加法

  Boolean + Boolean -> 加法

  Number + String -> 连接

  String + Boolean -> 连接

  String + String -> 连接

问题15:下面代码输出什么?

var z = 1, y = z = typeof y; console.log(y);

输出是 undefined。js中赋值操作结合律是右至左的 ,即从最右边开始计算值赋值给左边的变量。

上面代码等价于var z = 1 z = typeof y; var y = z; console.log(y);

问题16:下面代码输出什么?

var foo = function bar(){ return 12; }; typeof bar();

输出是抛出异常,bar is not defined。 如果想让代码正常运行,需要这样修改代码:

var bar = function(){ return 12; }; typeof bar();

或者是

function bar(){ return 12; }; typeof bar();

明确说明这个下问题

var foo = function bar(){ // foo is visible here // bar is visible here console.log(typeof bar()); // Work here :) }; // foo is visible here // bar is undefined here

 

问题17:两种函数声明有什么区别?

var foo = function(){ // Some code }; function bar(){ // Some code };

foo的定义是在运行时。想系统说明这个问题,我们要引入变量提升的这一概念。

我们可以运行下如下代码看看结果。

console.log(foo) console.log(bar) var foo = function(){ // Some code }; function bar(){ // Some code };

输出为

undefined function bar(){ // Some code };

为什么那?为什么 foo 打印出来是 undefined,而 bar打印出来却是函数?

JavaScript在执行时,会将变量提升。

所以上面代码JavaScript 引擎在实际执行时按这个顺序执行。

// foo bar的定义位置被提升 function bar(){ // Some code }; var foo; console.log(foo) console.log(bar) foo = function(){ // Some code };

原代码的输出合理解释了。

问题18:下面代码输出什么?

var salary = "1000$"; (function () { console.log("Original salary was " + salary); var salary = "5000$"; console.log("My New Salary " + salary); })();

输出是

Original salary was undefined My New Salary 5000$

这题同样考察的是变量提升。等价于以下代码

var salary = "1000$"; (function () { var salary ; console.log("Original salary was " + salary); salary = "5000$"; console.log("My New Salary " + salary); })();

 

问题19:什么是 instanceof 操作符?下面代码输出什么?

function foo(){ return foo; } console.log(new foo() instanceof foo);

instanceof操作符用来判断是否当前对象是特定类的对象。

如function Animal(){ //或者不写return语句 return this; } var dog = new Animal(); dog instanceof Animal // Output : true

但是,这里的foo定义为function foo(){ return foo; }

所以// here bar is pointer to function foo(){return foo}. var bar = new foo();

所以 new foo() instanceof foo 返回 false

问题20: 如果我们使用JavaScript的"关联数组",我们怎么计算"关联数组"的长度?

var counterArray = { A : 3, B : 4 }; counterArray["C"] = 1;

其实答案很简单,直接计算key的数量就可以了。

Object.keys(counterArray).length // Output 3

41.解释下JavaScript中this是如何工作的。

this永远指向函数运行时所在的对象,而不是函数被创建时所在的对象。匿名函数或不处于任何对象中的函数指向window 。

1.如果是call,apply,with,指定的this是谁,就是谁。

2.普通的函数调用,函数被谁调用,this就是谁。

 

45.什么是哈希表?

散列表(也叫哈希表),是根据关键码值直接进行访问的数据结构。也就是说,它通过把关键码值映射到表中一个位置来访问记录,以加快查找的速度。这个映射函数叫做散列函数,存放记录的数组叫做散列表。

 

63.请描述下事件冒泡机制。

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

捕获型事件:事件从最不精确的对象(document 对象)开始触发,然后到最精确(也可以在窗口级别捕获事件,不过必须由开发人员特别指定)。

支持W3C标准的浏览器在添加事件时用addEventListener(event,fn,useCapture)方法,基中第3个参数useCapture是一个Boolean值,用来设置事件是在事件捕获时执行,还是事件冒泡时执行。而不兼容W3C的浏览器(IE)用attachEvent()方法,此方法没有相关设置,不过IE的事件模型默认是在事件冒泡时执行的,也就是在useCapture等于false的时候执行,所以把在处理事件时把useCapture设置为false是比较安全,也实现兼容浏览器的效果。

 

64."attribute"和"property"的区别是什么?

1. 定义

Property:属性,所有的HTML元素都由HTMLElement类型表示,HTMLElement类型直接继承自Element并添加了一些属性,添加的这些属性分别对应于每个HTML元素都有下面的这5个标准特性: id,title,lang,dir,className。DOM节点是一个对象,因此,他可以和其他的JavaScript对象一样添加自定义的属性以及方法。property的值可以是任何的数据类型,对大小写敏感,自定义的property不会出现在html代码中,只存在js中。

Attribute:特性,区别于property,attribute只能是字符串,大小写不敏感,出现在innerHTML中,通过类数组attributes可以罗列所有的attribute。

2. 相同之处

标准的 DOM properties 与 attributes 是同步的。公认的(非自定义的)特性会被以属性的形式添加到DOM对象中。如,id,align,style等,这时候操作property或者使用操作特性的DOM方法如getAttribute()都可以操作属性。不过传递给getAttribute()的特性名与实际的特性名相同。因此对于class的特性值获取的时候要传入“class”。

3. 不同之处

1).对于有些标准的特性的操作,getAttribute与点号(.)获取的值存在差异性。如href,src,value,style,onclick等事件处理程序。
2).href:getAttribute获取的是href的实际值,而点号获取的是完整的url,存在浏览器差异。

 

67.请指出document.onload和document.ready两个事件的区别。

页面加载完成有两种事件,一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件),二是onload,指示页面包含图片等文件在内的所有元素都加载完成。

 

74.什么是三元表达式?“三元”表示什么意思?

三元表达式:? :三元--三个操作对象

在表达式boolean-exp ? value0 : value1 中,如果“布尔表达式”的结果为true,就计算“value0”,而且这个计算结果也就是操作符最终产生的值。如果“布尔表达式”的结果为false,就计算“value1”,同样,它的结果也就成为了操作符最终产生的值。

75.JavaScript里函数参数arguments是数组吗?

在函数代码中,使用特殊对象 arguments,开发者无需明确指出参数名,通过使用下标就可以访问相应的参数。

arguments虽然有一些数组的性质,但其并非真正的数组,只是一个类数组对象。其并没有数组的很多方法,不能像真正的数组那样调用.jion(),.concat(),.pop()等方法。

76.什么是"use strict";?使用它的好处和坏处分别是什么?

在代码中出现表达式-"use strict"; 意味着代码按照严格模式解析,这种模式使得Javascript在更严格的条件下运行。

好处:

  消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为;

  消除代码运行的一些不安全之处,保证代码运行的安全;

  提高编译器效率,增加运行速度;

  为未来新版本的Javascript做好铺垫。

坏处:

同样的代码,在"严格模式"中,可能会有不一样的运行结果;一些在"正常模式"下可以运行的语句,在"严格模式"下将不能运行。

 

82.请说出你可以传递给jQuery方法的四种不同值。

选择器(字符串),HTML(字符串),回调函数,HTML元素,对象,数组,元素数组,jQuery对象等。

 

84.请指出.get(),[],eq()的区别。

eq:返回是一个jquery对象作用是将匹配的元素集合缩减为一个元素。这个元素在匹配元素集合中的位置变为0,而集合长度变成1。

get:是一个html对象数组作用是取得其中一个匹配的元素。num表示取得第几个匹配的元素。

 

85.请指出.bind(),.live()和.delegate()的区别。

.bind()JQuery扫描文档找出所有的$(‘a’)元素,并把alert函数绑定到每个元素的click事件上。

.live()JQuery把alert函数绑定到$(document)元素上,并使用’click’和’a’作为参数。任何时候只要有事件冒泡到document节点上,它就查看该事件是否是一个click事件,以及该事件的目标元素与’a’这一CSS选择器是否匹配,如果都是的话,则执行函数。live方法还可以被绑定到具体的元素(或context)而不是document上

.delegate()JQuery扫描文档查找$(‘#container’),并使用click事件和’a’这一CSS选择器作为参数把alert函数绑定到$(‘#container’)上。任何时候只要有事件冒泡到$(‘#container’)上,它就查看该事件是否是click事件,以及该事件的目标元素是否与CCS选择器相匹配。如果两种检查的结果都为真的话,它就执行函数。

 

速度

后者实际上要快过前者,因为前者首先要扫描整个的文档查找所有的$(‘a’)元素,把它们存成jQuery对象。尽管live函数仅需要把’a’作为串参数传递以用做之后的判断,但是$()函数并未知道被链接的方法将会是.live()。而另一方面,delegate方法仅需要查找并存储$(document)元素。

一种寻求避开这一问题的方法是调用在$(document).ready()之外绑定的live,这样它就会立即执行。在这种方式下,其会在DOM获得填充之前运行,因此就不会查找元素或是创建jQuery对象了。

灵活性和链能力

live函数也挺令人费解的。想想看,它被链到$(‘a’)对象集上,但其实际上是在$(document)对象上发生作用。由于这个原因,它能够试图以一种吓死人的方式来把方法链到自身上。实际上,我想说的是,以$.live(‘a’,…)这一形式作为一种全局性的jQuery方法,live方法会更具意义一些。

仅支持CSS选择器

最后一点,live方法有一个非常大的缺点,那就是它仅能针对直接的CSS选择器做操作,这使得它变得非常的不灵活。

  为什么选择.live()或.delegate()而不是.bind()?

毕竟,bind看起来似乎更加的明确和直接,难道不是吗?嗯,有两个原因让我们更愿意选择delegate或live而不是bind:

为了把处理程序附加到可能还未存在于DOM中的DOM元素之上。因为bind是直接把处理程序绑定到各个元素上,它不能把处理程序绑定到还未存在于页面中的元素之上。

如果你运行了$(‘a’).bind(…),而后新的链接经由AJAX加入到了页面中,则你的bind处理程序对于这些新加入的链接来说是无效的。而另一方面live和delegate则是被绑定到另一个祖先节点上,因此其对于任何目前或是将来存在于该祖先元素之内的元素都是有效的。

或者为了把处理程序附加到单个元素上或是一小组元素之上,监听后代元素上的事件而不是循环遍历并把同一个函数逐个附加到DOM中的100个元素上。把处理程序附加到一个(或是一小组)祖先元素上而不是直接把处理程序附加到页面中的所有元素上,这种做法带来了性能上的好处。

 

 

86.请指出$和$.fn的区别,或者说出$.fn的用途。

Jquery为开发插件提供了两个方法,分别是:

1 $.extend(obj); 2 $.fn.extend(obj);

  1.那么这两个分别是什么意思?

$.extend(obj);是为了扩展jquery本身,为类添加新的方法。

$.fn.extend(obj);给JQUERY对象添加方法。

  2.$.fn中的fn是什么意思,其实是prototype,即$.fn=$.prototype;

 

87.请写出一个函数实现N!的计算。N取很大的值时,该怎么办?

使用循环、递归都能写出函数。

当N取值很大时,应该考虑把数值转化为字符串再进行运算。大数乘法再转化为大数加法运算,其具体算法应该有不少C语言实现,可以参考一下。

88.modulo(12,5) //2 ;问题:实现满足上述结果的modulo函数。

89."i'm a lasagna hog".split("").reverse().join("");问题:上面的语句的返回值是什么?

答案:"goh angasal a m'i";

90.(window.foo||(window.foo="bar"));问题:window.foo的值是什么?

答案:"bar"只有window.foo为假时的才是上面答案,否则就是它本身的值。

var foo="Hello";(function(){var bar="World";alert(foo+bar);})();alert(foo+bar);

91.问题:上面两个alert的结果是什么?

答案:"Hello World"和ReferenceError:bar is not defined

 

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值