我的前端面试大全JS

一、js获取页面宽度高度及屏幕分辨率

网页可见区域宽：document.body.clientWidth 
网页可见区域高：document.body.clientHeight 
网页可见区域宽：document.body.offsetWidth (包括边线的宽) 
网页可见区域高：document.body.offsetHeight (包括边线的宽) 
网页正文全文宽：document.body.scrollWidth 
网页正文全文高：document.body.scrollHeight 
网页被卷去的高：document.body.scrollTop （设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离）拉动滚动条即可以测试
网页被卷去的左：document.body.scrollLeft  （设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离。 ）
网页正文部分上：window.screenTop 
网页正文部分左：window.screenLeft 

你有没有这样的上网经历？：
用快捷键新建一个页面（不是标签页，而是单独一个页），连续这样做，发现它们依次叠加，并且每个都在前一个的右下方偏一点。
对于当前窗口而言，这两个只读属性，真如你说的算是鸡肋，因为是只读的嘛，哪怕想干点啥也做不了。但对于其他窗口而言，这个属性还是有点用的。至少在其他窗口要弹出窗口时，可以给open传入窗口特征left和top，这就用到了上一个窗口的位置属性。
在某些情景下，你想后面弹出的窗口正好覆盖住上一个弹出窗，也可以用到这两个属性。

浏览器窗口位置：
IE、Chrome、Safari、Opera 都提供了支持 window.screenLeft 和 window.screenTop，但是Firxfox不支持这个两个属性；
Firxfox、Chrome、Safari、Opera 都提供了支持 window.screenX 和 window.screenY，但是 IE 不支持这个两个属性；
兼容代码：
var leftPos = (typeof window.screenLeft == 'number')?window.screenLeft:window.screenX;
var topPos = (typeof window.screenTop == 'number')?window.screenTop:window.screenY;
alert('X: '+leftPos+' Y: '+topPos)

屏幕分辨率的高：window.screen.height 
屏幕分辨率的宽：window.screen.width 
屏幕可用工作区高度：window.screen.availHeight 
屏幕可用工作区宽度：window.screen.availWidth

二、JS截取字符串

函数：split() 
功能：使用一个指定的分隔符把一个字符串分割存储到数组 
例子： 
str=”jpg|bmp|gif|ico|png”; 
arr=theString.split(”|”); 

函数：Join() 
功能：使用您选择的分隔符将一个数组合并为一个字符串 

函数：substring() 
功能：字符串截取，比如想从"MinidxSearchEngine”中得到"Minidx”就要用到substring(0,6) 

说明 
substring 方法返回的子串包括 start 处的字符，但不包括 end 处的字符。 
如果 start 与 end 相等，那么该方法返回的就是一个空串（即长度为 0 的字符串）。 
如果 start 比 end 大，那么该方法在提取子串之前会先交换这两个参数。 
如果 start 或 end 为负数，那么它将被替换为 0。 

函数：indexOf() 
功能：返回字符串中匹配子串的第一个字符的下标 

substr 方法 
定义和用法 
substr 方法用于返回一个从指定位置开始的指定长度的子字符串。 
语法 
stringObject.substr(start [, length ]) 
参数 描述 
start 必需。所需的子字符串的起始位置。字符串中的第一个字符的索引为 0。 
length 可选。在返回的子字符串中应包括的字符个数。 
说明 
如果 length 为 0 或负数，将返回一个空字符串。 
如果没有指定该参数，则子字符串将延续到stringObject的最后。 

还有slice()方法

三、判断一个字符串中出现次数最多的字符，统计这个次数

var str = 'asdfssaaasasasasaa';
var json = {};

for (var i = 0; i < str.length; i++) {
        if(!json[str.charAt(i)]){
                json[str.charAt(i)] = 1;
        }else{
                json[str.charAt(i)]++;
        }
};
var iMax = 0;
var iIndex = '';
for(var i in json){
        if(json[i]>iMax){
                iMax = json[i];
                iIndex = i;
        }
}
alert('出现次数最多的是:'+iIndex+'出现'+iMax+'次');

四、IE与FF脚本兼容性问题

obj.addEventListener(sEv, fn, false);
obj.attachEvent('on'+sEv,fn);
detachevet
removeEventListener
DOMContentLoaded
onreadystatechange  complete
DOMMouseScroll FF
onmousewheel   非FF
event.wheelDelta 上滚120 下-120
event.detail     上滚-3   下3  
obj.getCurrentStyle[attr]
getComputedStyle(obj,false)[attr]
XMLHttpRequest
ActiveXObject('Mircorsoft.XMLHttp')
FF本地能设置读取cookie 其他不行
event  ev
事件源
srcElement||target
toElement||relatedTarget
obj.setCapture();只有ie认
obj.releaseCapture();

Internet Explorer 8 及更早IE版本不支持 addEventListener() 方法，，Opera 7.0 及 Opera 更早版本也不支持。 但是，对于这些不支持该函数的浏览器，你可以使用 attachEvent() 方法来添加事件句柄

六、规避javascript多人开发函数重名问题

 命名空间
封闭空间
js模块化mvc（数据层、表现层、控制层）
seajs
变量转换成对象的属性
对象化

七、javascript面向对象中继承实现

function Person(name){
        this.name = name;
}

Person.prototype.showName = function(){
        alert(this.name);
}

function Worker(name, job){
        Person.apply(this,arguments)
        this.job = job;
}
for(var i in Person.prototype){
        Worker.prototype = Person.prototype;
}
new Worker('sl', 'coders').showName();