Posts Tagged ‘javascript’

2011年06月22日

同样是一道面试题,来自有道前端的面试。
写一个函数处理大数据的相加问题,所谓的大数据是指超出了整型,长整型之类的常规数据类型表示范围的数据。实现语言不限。
我是用js实现的,说一下我自己的思路:

1、首先这个题目最重要的环节在考虑怎么存储大数据?用什么数据类型保存呢?最简单可行的方式是String
2、确定了使用何种类型保存数据之后这个题目就明朗了。首先判断两个传入字符串的长度,取最短的len循环,两者从低位开始对应位相加,同时注意保存进位。在短的数据处理完后,将进位交给较长串的剩余部分处理。

详细实现看一下代码,完整实例见jsfiddle

var strAdd = function(srcA, srcB) {
var i, temp, tempA, tempB, len, lenA, lenB, carry = 0;
var res = [],
arrA = [],
arrB = [],
cloneArr [...]

Tags: ,. 981 人浏览
2011年06月20日

百度面试时问的一道题目,蛮常规的,但是当时自己的回答挺差劲的。现在总结记录下~
题目:要求写一个函数,去掉给定数组中的重复值。
如:
传入数组 a = [0, 8, 5, 4, 78, 8, 90, 4, 'a', 'b', 'a'];
要求返回:[0,4,5,8,78,90,a,b]

对于这个题目,在面试之后也想了好多次,不过一直没能想出一个时间复杂度较低的方法。昨天下午在宿舍看《JavaScript语言精粹》看到一个书中的一段代码有所触发,于是在jsfiddle上测试了,成功。代码如下(完整版参见jsfiddle)

var getNR = function(src) {
src = src || [];
var res = {};
var curr = [];
var i, j = 0,temp, name;
for (i = [...]

Tags: ,. 577 人浏览
2011年06月17日

去某公司(公司名不说了,人这套题说不定还要用)面试,现场30分钟做了一套题,其中有一道是这样的:

要求用js写一个函数,对传入的形如下网址字符串,返回对应的对象。
如:
若传入字符串a=’?name=zhiyelee&blog=www.tsnrose.com’;
则返回 b={‘name’:’zhiyelee’,’blog’:’www.tsnrose.com’}

当时由于时间比较短,实现的有些问题,回来后想了一下,总结如下:
我想到了两种思路,一种是使用正则表达式,第二种是使用字符串的split函数。
1、使用正则表达式处理
我首先想到的是使用正则表达式处理,可能是感觉这个更有挑战性写起来也最简洁,不过当时怀疑这种方法的效率会低于直接使用字符串函数处理的效率。这个效率我们在下文会验证~
这个方法的思路很简单,就是使用正则表达式每次匹配出一个‘***=###’串,然后循环最后取出所有。
代码如下

var getNRReg = function(str) {
var res = {};
var reg = /(\w+)=(\w+)/g;
while ((a = reg.exec(str))) {
res[a[1]] = a[2];
}
return res;
};

2、使用字符串函数处理
这种想法思路也比较常规,不过写起来肯定要比使用正则表达式处理麻烦一些。
我的思路首先用‘&’将原串分割成多个字串,每个字串的样式如‘***=###’,然后再对字串应用split(‘=’)。(此种方法没有使用正则,当然我们可以使用正则split(/&|=/)
代码如下

var getNRSplit = function(str) {
var [...]

Tags: ,,. 901 人浏览
2011年04月15日

前一段日本地震,网易深度搞了一个专题:日本地震前后对比图像。效果很炫,出现后各种被模仿,跟风研究了下代码。
自己做了个Demo,点击查看效果:Demo

原理

1、添加两个div:before和after,并通过absolute定位将二者叠放在一起
2、分别设置这两个div的背景图片为要对比的图片。
3、通过mouseover事件控制上层的那个div的宽度。
4、remove原来的图片

jQuery部分的源码

$(function(){
$(‘.beforeafter’).each(function(){
var $afterimg=$(this).find(‘img[rel=after]‘);
var $beforeimg=$(this).find(‘img[rel=before]‘);
$(this).append(”

“).find(‘.after’).width($afterimg.width()).height($afterimg.height())
.css({“background”:”url(“+$afterimg.attr(’src’)+”)”});
$(this).append(”

“).find(‘.before’).width($beforeimg.width()).height($beforeimg.height())
.css({“background”:”url(“+$beforeimg.attr(’src’)+”)”});
var offset=$(this).find(‘.before’).offset().left;
$(this).mousemove(function(event){
if((event.clientX-offset)50)

{
$(this).find(‘.before’).width(event.clientX-offset)
.css(“border-right”,”5px solid #333″);
};
});

$afterimg.remove();
$beforeimg.remove();
})

});

css部分源码

.show{
margin:20px 0 20px 0 ;
}
.beforeafter {
position: relative;
}
.before{
position:absolute;
left:0px;
top:0px;
}

PS:注意由于absolute布局不占据流空间,故after和before的position不能同时定义为absolute,否则后面的布局就出问题了。
//===============================================

Tags: ,. 537 人浏览
2011年04月13日

最近一个项目中用到了Ajax的跨域请求,于是Google了下解决方案。
发现的最简单的一个解决方案是用JQuery的getJSON方法。该解决方案的前提是服务端返回JSON格式的数据。
demo的地址:Demo
看下JQuery部分的代码:

$(function(){
$(‘#commit’).click(function() {
var name=$(‘#username’).val();
var content=$(“#content”).val();
var url=”http://tsnrose.com/download/jQ_ajax.php?name=”+name+”&content=”+content+”&jsoncallback=?”;
$.getJSON(url,function(data){
$(“#resText3″).empty();
$.each(data, function( i,item ){
var html=”;
html=”

“+item['name']+”

+item['content']+”

“;
$(“.commentList”).append(html);
});
});
$(‘#username’).val(”);
$(“#content”).val(”);
});

//Gloable
$(“#loading”).ajaxStart(function(){
$(this).show();
});
[...]

Tags: ,,. 640 人浏览