2014-07-18笔试面试总结(前端)
1. javascript delete
注意:
1. delete 返回返回false表示属性不能被删除,其他情况返回true(删除成功,或者要删除的属性不存在时也返回true) 2. 火狐的console不能完全模拟javascript执行环境,因而结果可能有所区别 例如在火狐下delete function 返回true,在火狐浏览器中执行返回false
3. eval作用域下delete和全局作用域下和函数作用域下有区别
看下面例子:
//delete function function a(){alert(1);}; console.log(delete a); //false console.log(a); //function a(){alert(1);}
//delete object var b = {aa:1,bb:1}; console.log(delete b);//false console.log(b);//Object {aa: 1, bb: 1}
//delete new added attribute of object var c = {aa:1,bb:1}; console.log(delete c.aa); //true console.log(c); //Object {bb: 1} var b={a:1,b:2,c:3}; delete b.d; //true
//delete the global member window.aa = 1; console.log(delete aa); //true console.log(aa); //ReferenceError: aa is not defined console.log(delete isNaN); //true console.log(isNaN(11)); //ReferenceError: isNaN is not defined console.log(delete Array); //true var aa = new Array();//ReferenceError: Array is not defined
//delete variable in function context function a(){ var c=1; console.log(c); //1 console.log(delete c); //false console.log(c); //1 }; a();
//delete in eval context eval('var a= 1'); delete a; //true console.log(a); //ReferenceError: a is not defined eval('function b(){alert(1);};'); delete b; //true console.log(b); //ReferenceError: b is not defined
//delete the length of the function and Array function a(){}; console.log(delete a.length); //false var aa = [1, 2]; console.log(delete aa.length); //false //delete the parameter function cc(c,d){ console.log(delete c);//false }; cc();
总结:
1. 变量、函数、属性等是否能删除与DontDelete属性有关,如下具有DontDelete属性: 1) 非eval作用域下var 申明的变量 2) 非eval作用域下函数名申明的函数 3) 对象的内置属性,例如 Function对象的length,数组的length 4) 函数的形参 不具有DontDelete属性: 1)对象新增加的属性,包含window对象下新增的属性 2)eval中创建的对象或者是函数
可参考http://perfectionkills.com/understanding-delete/,很长,不过讲的很详细,
2. this的理解及作用域绑定
题目很长,记不清了,大致如下:
var a = 1; function c(){ console.log(this.a); console.log(a); this.a = 3; } var b = { a: 1, c: function(){ console.log(a); a = 5; console.log(this.a); } }; c(); /* this.a:1 a: 1 this.a中this为window, a为全局a, 第三句this.a执行完成后全局a值变为3 */ new c(); /*this.a: undefined a: 3(上一步才c()执行完成后a变为3) */ b.c(); /* a: 3, this.a: 1 a为全局的a,第二步a=5执行完成后全局a变为5, this.a 为 b.a 值为1 */ var cc = b.c; /* 将cc引用b.c */ cc(); /* a: 5 this.a: 5 注意此处cc 在window context下执行, 丢失了a property 因而此处的this.a 引用的是window下的a */
此处引申:针对上面b.c情况,如何绑定作用域?
/* bind the context */ var dd = b.c.bind(b); dd(); // a: 5 this.a: 5
上面的方式并不是在所有浏览器中都有效,可采用如下方式更改Function原型
Function.prototype.bind = Function.prototype.bind || function(context){ var self = this; return function{ return self.apply(context, arguments); } }
3. toString和valueOf
1. 对象到布尔值的转换比较简单,对象到字符串和数字的转换相对复杂,需用到toString和valueOf两个方法,另外到字符串的转换和到数字的转换有区别
2. 所有对象继承toString和toValue方法,
toString返回对象的字符串,"[object object]", 很多类重写了tString方法
valueOf如存在原始值,将对象转换为它的原始值。 大多数对象无法表示为原始值,因而默认的valueOf返回对象本身,数组,函数,正则只是简单的继承了这个默认方法
对象到字符串 1. 如有toString则调用这个方法 2. 如无toString或者该方法不返回原始值,则调用toString方法 3. 如无法从toString和toValue获取原始值,则抛出类型错误异常
对象到数字 1. 先尝试调用toValue方法 2. 如无toValue或者不返回原始值,则调用toString 3. 如都不返回原始值,则抛出异常
注意: 1. 由于数组是继承了默认的valueOf,因为数组转数字时首先调用valueOf时无法返回原始值,因而要调用toString,空数组转化为空字符串,空字符串转化为数字0
2. 类似于'+'的可以进行数学加法和字符串连接的操作,如果其中一个操作数是对象,则会将对象转化为原始值
3. 对于所有非日期对象,对象到原始值的转换基本上是对象到数字的转换,首先调用valueOf, 日期对象采用对象到字符串模式
4. 默认的valueOf返回对象本身
eg1:
var date = new Date(); var date_toString = date.toString(); var date_valueOf = date.valueOf(); console.log(date == date_toString); //true console.log(date == date_valueOf); //false
日期采用字符串模式
eg2:
var a = { i: 1, valueOf: function() { console.log('valueOf'); return this.i; }, toString: function() { console.log('toString'); return this.i; } } console.log(a); /* toString Object {i: 1, valueOf: function, toString: function} */ console.log(+a);/* valueOf 1 */ console.log(a + '');/* valueOf 1 */ console.log(a == 1);/* valueOf true */
字符串转换首先toString,数字转换首先toValue
eg3:
var a = { i: 1, toString: function() { console.log('toString'); return this.i; } } console.log(a); /* toString Object {i: 1, valueOf: function, toString: function} */ console.log(+a);/* toString 1 */ console.log(a + '');/* toString 1 */ console.log(a == 1);/* toString true */
默认的valueOf返回对象本身,不能返回原始值,此处只重写了toString,没有重写valueOf,首先调用valueOf不能返回原始值,因而会调用toString,此处重写的toString能返回原始值
4.其他
1. js选择器编写, eg: $("#id"); $("#id class div");querySelector和querySelectorAll等 2. position等及浏览器区别 3. 作用域 闭包 4. ie盒模型和w3c盒模型 5. css3相关transform、nth-child等 6. currying 7. call apply 8. toString 和valueOf应用 例如 function b(){}; b+1