題二

下面是webryan整理的百度web前端筆試和麪試的一些題目和過程,提供給大家借鑑。

百度web前端筆試試卷上的題目:

1.判斷字符串是否是這樣組成的,第一個必須是字母,後面可以是字母、數字、下劃線,總長度爲5-20
2.截取字符串abcdefg的efg
3.讓一個input的背景顏色變成紅色
4。給一個頁面,寫html css
5。div的高寬等於瀏覽器可見區域的高寬,瀏覽器滾動,div始終覆蓋瀏覽器的整個可見區域
6。判斷一個字符串中出現次數最多的字符,統計這個次數
7。IE與FF腳本兼容性問題

又重新問的是1,4,6,7,這次問出題者的意圖,並且讓給出7的更多答案,以及IE FF不兼容的原因

然後看了看簡歷,沒有問簡歷上的項目,而是讓自己隨便談談

1對於web客戶端技術未來趨勢發展談談看法
javascript + ajax=RIA
Adobe Flash AS 3
Flex
Sliveright

2web開發團隊人員應該如何分工協作
佈局 CSS 腳本
比如腳本人員長期的積累可能鑄造類型YUI這樣的產品級腳本庫(亮點)

3web開發曾經的團隊有沒有別人遇到問題,什麼問題,向你請教

4如果要實習,什麼時候可以

5自己在開發的過程中遇到什麼問題,談談看法

6web開發腳本開發環境用什麼、調試用什麼
試過aptana,現在就用editplus
調試肯定用firebug,ie下看頁面DOM用IEInspector

7如果有個新技術,現在需要掌握,你會怎麼做
新技術的發現我一般是通過RSS工具,比如我用GoogleReader
每天有半個小時左右在看最新的資訊、技術走向
發現新技術,首先有個大概瞭解,如果有深入的必要
我一般會看他的官網,比如jquery,我會搜索到www.jquery.com,然後看Docs、samples
如果要用到項目中,有困難的問題,我會svn得到最新的這個技術的源碼,深入跟蹤進去,看實現原理
一般現在涌現的技術都是opensource

提問時間
1百度web開發腳本是否有做類似YUI庫的打算
2百度web開發工程師打算招多少人



 

百度電話二面回憶 web開發部–web開發工程師

首先是自我介紹
然後談談做的web項目
然後開始問技術問題

前端開發的優化問題
答:
產品發佈時,js的壓縮,即函數名替換、整個文件壓縮成一行
css開發的時候 註釋寫清楚,先有個base.css,然後根據不同頁面需要再加css,發佈的時候將css中的一個定義寫成一行,目的是壓縮文件大小
最終發佈的時候甚至可以將css,js分別壓縮成一個文件,甚至css、js通過技巧壓縮到一個裏邊(亮點)
這樣的目的是,減少用戶訪問web產品的http連接數

web前端產品的開發流程
答:首先根據產品的定位、用戶羣,確定配色,然後紙上設計整體佈局,然後png或者psd出效果圖,切出需要的小圖片,然後手寫代碼div+css構造出頁面,然後根據功能寫腳本
參考126郵箱首頁,將所有小圖片放到一個圖片中,通過css的background-position實現頁面,還是爲了優化,減少http連接數

規避javascript多人開發函數重名問題
答:首先是通過命名規範,比如根據不同的開發人員實現的功能,在函數名加前綴,雖然函數名看起來複雜,發佈的時候還是可以替換,從而優化。
還有一種辦法是,每個開發人員都把自己的函數封裝到類中,然後調用的時候即使函數名相同,但是因爲是要類.函數名來調用,所以也減少了重複的可能性。

javascript面向對象中繼承實現
答:我是用prototype.js extend.js擴展
然後子類中parent.initialize()…
答的不好
正確答案:

 

// 1. 構造器
function Animal() {};
function Mammal() {};
function Canine() {};
function Dog() {};
// 2. 原型鏈表
Mammal.prototype = new Animal();
Canine.prototype = new Mammal();
Dog.prototype = new Canine();

prototype.js實現的基本原理
答:
將功能封裝
比如Ajax.Request,還是有判斷瀏覽器的代碼;Position這樣的實現頁面元素位置的計算

prototye太大,如果一個頁面功能不需要這樣的,自己實現,怎麼做
答:首先頁面、css、腳本分離之後,腳本中將整個模塊功能寫成一個類var Do={}
其中初始化函數init:function(){},然後最後做Do.init()
其中init會對頁面上form中需要交互的元素綁定事件,比如$(’input1′).οnclick=function(){}

IE、FF下面腳本的區別
答:
1.IE有outerHTML,FF沒有
2.頁面元素id,IE可以直接取,FF必須document.getElementById()
3.Ajax裏邊FF是new XMLHttpRequest,而IE是
try new ActiveXObject(’Msxml2.XMLHTTP’) try new ActiveXObject(’Microsoft.XMLHTTP’)

FF下面實現outerHTML
答:.parenet.firstChild .parent.innerHTML
這個沒答好
正確答案:原理是,get:取到這個標籤的tagname,然後屬性循環構造成這個標籤的屬性
set:把字符串用insertBefore插入到這個元素前面,然後removeChild這個元素

 

<head>
<SCRIPT LANGUAGE=”JavaScript”>
<!–
if(typeof(HTMLElement)!=”undefined” && !window.opera)
{
HTMLElement.prototype.__defineGetter__(”outerHTML”,function()
{
var a=this.attributes, str=”<”+this.tagName, i=0;
for(;i<a.length;i++)
if(a[i].specified)
str+=” “+a[i].name+’=”‘+a[i].value+’”‘;
if(!this.canHaveChildren)
return str+” />”;
return str+”>”+this.innerHTML+”</”+this.tagName+”>”;
});
HTMLElement.prototype.__defineSetter__(”outerHTML”,function(s)
{
var d = document.createElement(”DIV”); d.innerHTML = s;
for(var i=0; i<d.childNodes.length; i++)
this.parentNode.insertBefore(d.childNodes[i], this);
this.parentNode.removeChild(this);
});
HTMLElement.prototype.__defineGetter__(”canHaveChildren”,function()
{
return !/^(area|base|basefont|col|frame|hr|img|br|input|isindex|link|meta|param)$/.test(this.tagName.toLowerCase());
});
}
//–>
</SCRIPT>

IE、FF下面CSS的解釋區別
答:
1.png透明背景,FF下面沒有問題,IE需要用濾鏡通道
2.z-index在IE、FF下面的解釋問題,

IE會認爲第一個z-index=0
3.長字符串,word-wrap:break-all可以解決IE,但是FF需要overflow:hidden才行
馮舒婭補充:
1、有些標籤在ff中不能用,比如button
2、濾鏡
3、鼠標cursor:hand cursor:pointer
4、div的高度自適應
5、對box模型解析不一樣
6、ul、ol的padding和margin

IE都能識別*,標準瀏覽器(如FF)不能識別*;
IE6能識別*,但不能識別 !important;
IE7能識別*,也能識別 !important;
FF不能識別*,但能識別 !important;
例如style=”*width:10px;!important width:20px;”
這樣在IE6下寬度爲10px,在IE7下寬度時20px

web前端技術的展望
答:javascript ajax;flash AS;Flex;Sliveright
附上網上的百度web開發工程師筆試問題集
1編寫一個方法 求一個字符串的字節長度

 

<script language=”javascript” type=”text/javascript”>
new function(s)
{
if(!arguments.length||!s) return null;
if(”"==s) return 0;
var l=0;
for(var i=0;i<s.length;i++)
{
if(s.charCodeAt(i)>255) l+=2;
else l++;
}
alert(l);
}(”hello你好,我好,大家好!world!”);
</script>

2編寫一個方法 去掉一個數組的重複元素

 

<script language=”javascript” type=”text/javascript”>
Array.prototype.strip=function()
{
if(this.length<2) return [this[0]]||[];
var arr=[];
for(var i=0;i<this.length;i++)
{
arr.push(this.splice(i–,1));
for(var j=0;j<this.length;j++)
{
if(this[j]==arr[arr.length-1])
{
this.splice(j–,1);
}
}
}
return arr;
}
var arr=["abc",85,"abc",85,8,8,1,2,5,4,7,8];
alert(arr.strip());
</script>

3說出3條以上ff和ie的腳本兼容問題
IE 有children,FF沒有;IE有parentElement,FF沒有;IE有innerText,outerText,outerHTML,FF 沒有;FF有HTMLElement,HTMLDivElement,XMLDocument,DocumentFragment,Node, Event,Element等等,IE沒有;IE有數據島,FF沒有;IE跟FF創建HttpRequest實例的方法不一樣。。等等。。
4用腳本寫去除字符串的前後空格

 

String.prototype.trim = function(mode)
{//前後去空格
if (mode==’left’) {
return ((this.charAt(0) == ” “ && this.length > 0) ? this.slice(1).trim(’left’) : this);
} else
if (mode == ’right’) {
return ((this.charAt(this.length - 1) == ” “ && this.length > 0) ? this.slice(0, this.length - 1).trim(’right’) : this);
} else {
return this.trim(’left’).trim(’right’);
}
};

5算出字符串中出現次數最多的字符是什麼,出現了多少次

 

<script type=”text/javascript”>
//<![CDATA[var str ="adadfdfseffserfefsefseeffffftsdg"; //命名一個變量放置給出的字符串
var maxLength = 0; //命名一個變量放置字母出現的最高次數並初始化爲0
var result = ''; //命名一個變量放置結果輸入

while( str != '' ){ //循環迭代開始,並判斷字符串是否爲空
oldStr = str; //將原始的字符串變量賦值給新變量
getStr = str.substr(0,1); //用字符串的substr的方法得到第一個字符(首字母)
eval("str = str.replace(/"+getStr+"/g,'')"); //詳細如補充

if( oldStr.length-str.length > maxLength )
{ //判斷原始的字符串的長度減去替代後字符串長度是否大於之前出現的最大的字符串長度
maxLength = oldStr.length-str.length; //兩字符串長度相減得到最大的字符串長度
result = getStr + "=" + maxLength //返回最大的字符串結果(字母、出現次數)
}
}

alert(result) //彈出結果
//]]>
</script>

6寫出3中使用this的典型應用
在HTML元素事件屬性中inline方式使用this關鍵字:

7.最後一個問題是,如何製作一個combo選項,就是可以輸入可以下拉菜單選擇。

這個網上有很多成品,主要是通過絕對定位和相對定位結合的方式,改造原有的select 標籤和input標籤的方法。

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章