面试体验很差,可能一开始就不大想要吧,不知道为啥要面试。

1. 实现一个 flex 的布局

//存在如下的html元素,利用flex布局实现左中右三个元素分别占据屏幕的25%、50%、25%
 <style>
      .box {
        width: 80%;
        height: 500px;
        display: flex;
        background-color: red;
      }
      .center {
        width: 250px;
        height: 200px;
        background-color: brown;
        flex: 2;
      }
      .left {
        flex: 1;
      }
      .right {
        flex: 1;
      }
    </style>
    <div class="box">
      <div class="left"></div>
      <div class="center"></div>
      <div class="right"></div>
    </div>

2. 解析 URL 提取 params 参数

// 实现一个名为 urlToObj 的函数,将一个 url 中的参数转换成对象,入参为 url,返回的结果为对象。
let httpUrlStr = 'https://www.whatever.com?name=zhangsan&age=18';
// { "name": "zhangsan", "age":  "18" }
function urlToObj(url){
	let params = url.split('?')[1];
    let param = params.split('&');
    let obj = {};
    for (let i = 0; i < param.length; i++) {
        let paramA = param[i].split('=');
        let key = paramA[0];
        let value = paramA[1];
        obj[key] = value;
    }
    return obj;
}
console.log(urlToObj(httpUrlStr));

3. 编写一个方法去掉数组里面重复的内容

// 实现一个名为 uniqueArray 的函数,去掉数组里面重复的内容
// [1, 1, 2, 3, 3, 1] => [1,2,3]
let array = [1, 1, 2, 3, 3, 1];
function uniqueArray(array){
	let arr = [];
    for (let i = 0;i <array.length; i++) {
        if (arr.indexOf(array[i]) === -1) {
            arr.push(array[i]);
        }
    }
    return arr;
    // let res = [...new Set(array)];
    // return res;
}
console.log(uniqueArray(array));

4. 判断一个字符串中出现次数最多的字符,统计这个次数

// 找出一个字符串中出现次数最多的字符,并统计出现的次数
// "ababajshbaasdaaaa" => {char:'a',count:9}
let str = "ababajshbaasdaaaa";
function computeString(str){
	let obj = {};
    let count = 0;
    for (let i = 0; i < str.length; i++) {
        let char = str.charAt(i);
        if (obj[char]) {
            obj[char]++;
        } else {
            obj[char]=1
        }
    }
    let res = {};
    for (let key in obj ) {
        if (obj[key] > count) {
            count = obj[key];
            res = {
                char: obj[key],
                count : count
            }
        }
    }
    return res;
}
console.log(computeString(str));

5. 实现一个防抖函数

// 实现一个防抖函数(debounce)。防抖:函数在一段时间内的多次调用,仅使得最后一次调用有效。
function debounce(){
	let time;
    return function () {
        let context = this;
        let args = arguments;
        if (time) {
            clearTimeout(time);
        }
        time = setTimeout(() => {
            func.apply(context,args);
        },100)
    }
}