牛客网"前端大挑战"题目解答

第一题，获取url参数

重点思路：
1、url的组成：需要两次split调用，因为url格式大致为：xxx ? xxx=xxx # xxx
2、由于sKey可能不存在，所以可能需要将所有的key-value都保存在resultMap中并返回。
3、当key只有一个结果的时候返回字符串，有多个结果则需要返回数组。因此需要对map中的value的数据格式进行判断才能进行下一步操作：即if(resultMap[array[0]] instanceof Array)

代码：

function getUrlParam(sUrl, sKey) {    var pamamstr = (sUrl.split("?"))[1];    pamamstr = (pamamstr.split("#"))[0];    var pamamArr = pamamstr.split("&");    var resultMap = {};    pamamArr.forEach(function(item){        var array = item.split("=");        if(resultMap[array[0]]===undefined){            resultMap[array[0]] = array[1];        }else{            if(resultMap[array[0]] instanceof Array){                resultMap[array[0]].push(array[1]);            }else{                var tmp = resultMap[array[0]];                resultMap[array[0]] = [tmp];                resultMap[array[0]].push(array[1]);            }        }    });    if(sKey){        return resultMap[sKey]?resultMap[sKey]:"";    }else{        return resultMap;    }}

第二题，节点寻找

题目描述：
查找两个节点的最近的一个共同父节点，可以包括节点自身

代码：

function commonParentNode(oNode1, oNode2) {    while(oNode1 && oNode1 != document.body){        oNode1.setAttribute("class","findParentNode");        oNode1 = oNode1.parentNode;    }    while(oNode2 && oNode2 != document.body){        var classMark = oNode2.getAttribute("class");        if(classMark == "findParentNode"){            return oNode2;        }        oNode2 = oNode2.parentNode;    }    return document.body;}

第三题，创建对象

根据包名，在指定空间中创建对象
输入描述：
namespace({a: {test: 1, b: 2}}, ‘a.b.c.d’)
输出描述：
{a: {test: 1, b: {c: {d: {}}}}}

function namespace(oNamespace, sPackage) {    var sArr = sPackage.split(".");    var currentObj = oNamespace;    sArr.forEach(function(item){        if(currentObj[item] instanceof Object){            currentObj = currentObj[item];        }else{            currentObj[item] = {};            currentObj = currentObj[item];        }    });    return oNamespace;}

第四题，数组去重

为 Array 对象添加一个去除重复项的方法

需要注意，NaN !== NaN

Array.prototype.uniq = function () {    var result = [];    var hasNaN = true;    for(var i = 0;i < this.length;++i){        if(result.indexOf(this[i]) == -1){            if( this[i] != this[i]){                if(hasNaN){                   result.push(this[i]);                   hasNaN = false;                }            }else{                result.push(this[i]);            }        }    }    return result;}

第五题，斐波那伽数列（兔子数列哦哈哈）

function fibonacci(n) {    if( n==1 || n==2 ){        return 1    }    return arguments.callee(n-1) + arguments.callee(n-2);}

第六题，时间格式化

参考了大神代码：

function formatDate(t, sFormation) {    var str='';    var obj = {        yyyy:t.getFullYear(),        yy:(""+ t.getFullYear()).slice(-2),        M:t.getMonth()+1,        MM:("0"+ (t.getMonth()+1)).slice(-2),        d:t.getDate(),        dd:("0" + t.getDate()).slice(-2),        H:t.getHours(),        HH:("0" + t.getHours()).slice(-2),        h:t.getHours() % 12,        hh:("0"+t.getHours() % 12).slice(-2),        m:t.getMinutes(),        mm:("0" + t.getMinutes()).slice(-2),        s:t.getSeconds(),        ss:("0" + t.getSeconds()).slice(-2),        w:['日', '一', '二', '三', '四', '五', '六'][t.getDay()]    }     return sFormation.replace(/([a-z]+)/ig,function($1){return obj[$1]});}

replace函数的使用还有obj对象的建立是亮点！

date对象方法见链接：http://www.w3school.com.cn/jsref/jsref_obj_date.asp

replace方法参数详解：http://www.w3school.com.cn/jsref/jsref_replace.asp

第七题，获取字符串长度

如果第二个参数 bUnicode255For1 === true，则所有字符长度为 1
否则如果字符 Unicode 编码 > 255 则长度为 2

输入示例：strLength(‘hello world, 牛客’, false)

function strLength(s, bUnicode255For1) {    if(bUnicode255For1){        return s.length;    }else{        var arr = s.split("");        var add = 0;        arr.forEach(function(item){            if(item.charCodeAt(0)>255){                add++;            }        });        return (s.length + add);    }}

第八题，邮箱字符串判断

function isAvailableEmail(sEmail) {    return /^[\w*\.*]+@[\w*\.*]+.[\w*\.*]$/.test(sEmail);}

第九题，颜色字符串转换

将 rgb 颜色字符串转换为十六进制的形式，如 rgb(255, 255, 255) 转为 #ffffff
1. rgb 中每个 , 后面的空格数量不固定
2. 十六进制表达式使用六位小写字母
3. 如果输入不符合 rgb 格式，返回原始输入

栗子：rgb2hex(‘rgb(255, 255, 255)’)

本题重点：
1、使用字符串的方法match
2、判断数字是否符合要求
3、number.toString(16)返回16进制的字符串结果

function rgb2hex(sRGB) {    var reg = /rgb\((\d+),\s*(\d+),\s*(\d+)\)/;    var arr = sRGB.match(reg);    if(!arr){        return sRGB;    }else{        var res = "#";        for(var i = 1; i < 4; i++){            var m = parseInt(arr[i]);            if(m<0||m>255){                return sRGB;            }else{                res += m<16? "0"+m.toString(16):m.toString(16);            }        }        return res;           }}

第十题，将字符串转换为驼峰格式

css 中经常有类似 background-image 这种通过 - 连接的字符，通过 javascript 设置样式的时候需要将这种样式转换成 backgroundImage 驼峰格式，请完成此转换功能
1. 以 - 为分隔符，将第二个起的非空单词首字母转为大写
2. -webkit-border-image 转换后的结果为 webkitBorderImage

function cssStyle2DomStyle(sName) {    var arr = sName.split("-");    var result = "";    arr.forEach(function(str){        str = str.slice(0,1).toUpperCase() + str.slice(1);        result += str;    });    return result.slice(0,1).toLowerCase() + result.slice(1);;}