分享
是一种美德

面试题目自练习20220722

1、css水平、垂直居中?至少两种

(1)position方法:

HTML

<div class="div1"> <div class="center"></div> </div>

CSS

.div1 {
  background-color: #eee;
  width: 200px;
  height: 200px;
  position: relative;
  margin-top: 20px;
}
.div1 .center {
  width: 50px;
  height: 50px;
  background-color: rgb(34, 71, 139);
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

(2)Flex方法

HTML

<div class="div2"> <div class="center"></div> </div>

CSS

.div2 {
  background-color: #eee;
  width: 200px;
  height: 200px;
  position: relative;
  margin-top: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.div2 .center {
  width: 50px;
  height: 50px;
  background-color: rgb(240, 248, 166);
}

2、数组去重?至少两种

(1)通过遍历的方法实现

function demo1(arr) {
    for (var i = 0; i < arr.length; i++) {
        for (var j = i + 1; j < arr.length; j++) {
            if (arr[i] == arr[j]) {
                arr.splice(j, 1);
                j--
            }
         }
     }
     return arr;
 }
 var arr = [2, 2, 2, 8, 9, 8, 8, 8, true, 'red', 'red', 'red'];
 arr = demo1(arr);

(2)通过filter

let maxList = ['1','2','3','4','5']
let minList = ['2','3']
let newList = maxList.filter((item) => {
    return minList.indexOf(item) == -1 //返回minList里找不到的数据给newList 即去重
})
console.log('newList',newList)

(3)ES6 set

function demo3( arr){
    return [...new Set(arr)]
}
var arr = [2, 2, 2, 8, 9, 8, 8, 8, true, 'red', 'red', 'red'];
arr = demo3(arr);
console.log(arr);

3、深拷贝浅拷贝解释?

深拷贝,就是不管原数据中值是什么类型的数据,拷贝后的新数据跟原数据是完全没有关联的。

浅拷贝是将原数据中所有的数据复制一份,放到新的变量空间中,两个变量不共享一个内存地址。

日积月累,每天一练!

学无止境,

欢迎大家关注公众号:

赞(0)
转载请注明来源地址:MN乐享 » 面试题目自练习20220722

评论 抢沙发

评论前必须登录!