3.31笔试题

[XingGuoZM]

第1题

写一个getVal函数，实现以下功能
console.log(getVal([1, 2, 3, [9, undefined, 8], 5, 6, 7]));
输出：{ary1:[1,2,3,9,8,5,6,7], ary2:[1,2,3,5,6,7,8,9]}

第2题

打乱一个排序好的数组

第3题

爬楼梯
楼梯有n阶台阶，上楼可以一步上1阶，也可以一步上2阶，编一程序计算共有多少种不同的走法？

第4题

js深拷贝实现，至少两种方式

第5题

array-tree转array

const tree = {
  name:'level1',
  children:[
    {name:'leaf1'},
    {
      name:'level2',
      children:[
        {name:'leaf2'},
        {name:'leaf3'},
      ]
    }
  ]
}

const array = [
  {name:'level1/leaf1'},
  {name:'level1/level2/leaf2'},
  {name:'level1/level2/leaf3'},
]

第6题

请实现一个executePromise函数，按传参的顺序先后执行，将返回的数据按先后顺序放到数组result中
例如：
const timeoutVal = (ms, val) => new Promise((r) => setTimeout(() => r(val), ms))
    .then(e => {console.log(e); return e;});
const func1 = () =>timeoutVal(2000,1)
const func2 = () =>timeoutVal(1000,2)
const func3 = () =>timeoutVal(2000,3)

const executePromise= (ajaxArray) => {};

executePromise([func1,func2]).then(data => {
  console.log('done');
  console.log(data); 
});
// 输出
// 1
// 2
// done
// [1, 2]

excutePromise([func1,func2,func3]).then(data=>{
  console.log('done');
	console.log(data);
});
// 输出
// 1
// 2
// 3
// done
// [1,2,3]

第7题

请写一段JS程序提取 URL中的各个GET参数，将其按key-value形式返回到一个对象中。
如URL： http://www.lubansoft.com/?a=1&b=2&c=&d=xxx&e，
应返回 {a:’1′, b:’2′, c:”, d:’xxx’, e:undefined}。

第8题

如何水平居中并垂直居中一个元素（至少两种）？

(上海鲁班软件)

[XingGuoZM]

参考答案

// 第1题
const getVal= (arr)=>{

  const flat = (ary)=>{
    return ary.reduce((pre,cur)=>{
      if(cur === undefined) return [...pre];
      return Array.isArray(cur)?[...pre,...flat(cur)]:[...pre,cur];
    },[]);
  }
  return flat(arr);
}
console.log(getVal([1, 2, 3, [9, undefined, 8], 5, 6, 7]))

// 第2题
function shuffle(arr){
  const ans = [];
  while(arr.length>0){
    const i = Math.floor(Math.random()*arr.length);
    ans.push(arr.splice(i,1)[0]);
  }
  return ans;
}
const res = shuffle([1,2,3,4,5,6,7,8,9]);
console.log(res);

// 第3题
const nFloors=(n)=>{
  if(n===1 || n===2) return n;
  return nFloors(n-1)+nFloors(n-2);
}
console.log(nFloors(5));

//第4题
// 方式一：
JSON.parse(JSON.stringify(obj))
// 方式二：递归赋值
const deepClone = (obj)=>{
  if(typeof obj !== 'object' || obj ===null) return obj;

  const deepObj = Array.isArray(obj)?[]:{};

  for(const item in obj){
    if(typeof item === "object"){
      deepObj[item] = deepClone(item);
    }else{
      deepObj[item] = item;
    }
  }
  return deepObj;
}
const obj = {a:{b:{c:1}}}
const obj2 = deepClone(obj);
console.log(obj,obj2,obj===obj2);

// 第5题
const flattenTreeFn=(tree)=>{
  const traverse = (tree,ans,str)=>{
    str+=(str?'/':'')+tree.name;
    if(!tree.children) {
      ans.push({name:str});
      str = '';
      return 
    } 
    for(let item of tree.children){
      traverse(item,ans,str);
    }
  }
  const ans = [];
  traverse(tree,ans,'');
  console.log(ans);
  return ans;
}

flattenTreeFn(treeSample);

// 第6题
const timeoutVal = (ms, val) => new Promise((r) => setTimeout(() => r(val), ms))
    .then(e => {console.log(e); return e;});
const func1 = () =>timeoutVal(2000,1)
const func2 = () =>timeoutVal(1000,2)
const func3 = () =>timeoutVal(2000,3)

const executePromise= (ajaxArray) => {
  const ans = [];
  let count = 0;

  const runTask = (task)=>{
    return task().then(res=>{
      ans[count] = res;
      count++;
      ajaxArray[count] &&  runTask(ajaxArray[count])
    })
  }

  runTask(ajaxArray[0]);
  return new Promise(resolve=>{
    if(count === ajaxArray.length) resolve(ans);
  });
};
executePromise([func1,func2,func3]).then(res=>{
  console.log('done');
  console.log(res);
});

// 第7题
const getUrlVal = (url)=>{
  const arr = url.split('?').slice(1)[0].split('&');
  const ans = {};
  for(const item of arr){
    const [key,value] = item.split('=');
    ans[key] = value;
  }
  return ans;
}
const ans = getUrlVal('http://www.lubansoft.com/?a=1&b=2&c=&d=xxx&e')
console.log(ans);

// 第8题
//父div：display:flex;justify-content:center;align-items:center;

// 方式二
// 父div：position:relative;
// 子div：poisition:absolute;top:50%;left:50%;transform:translate(-50%,-50%);