面试题++

垂直居中方法
方法一：已知元素的高宽
#div1{
background-color:#6699FF;
width:200px;
height:200px;
position: absolute; //父元素需要相对定位
top: 50%;
left: 50%;
margin-top:-100px ; //二分之一的 height，
width margin-left: -100px;
}

   //方法二:未知元素的高宽 
   #div1{
   width: 200px;
    height: 200px; 
    background-color: #6699FF; 
    margin:auto; 
    position: absolute; //父元素需要相对定位 
    left: 0; top: 0; right: 0; bottom: 0; 
    }
方法三
	line-height 和 align-content
方法四 使用定位position
方法五 flex 布局
	justify-content:center
	algin-items:center
方法六 table-cell

清除浮动方法1
父级div定义 overflow:hidden
在浮动元素后面加一个空的div，加上clear:both并为它清除浮动
BFC清除浮动
浮动元素父元素加after伪元素 content:’’;displayl:block;clear:both;

对象合并方法：
var obj1 = {name:‘杨’,age:‘18’}
var obj2 = {sex:‘男’,work:‘程序员’}
var obj3 = Object.assgin(obj1,obj2 )
console.log(obj3 )
面试的时候说出了这个方法，结果被对方否认，于是面试就没有通过！！！ 我应该再坚持一下的

遍历赋值
var obj1 = {name:‘杨’,age:‘18’}
var obj2 = {sex:‘男’,work:‘程序员’}
for (var key in obj2){
if(obj2.hasOwnProperty[key] === true){
obj1[key]=obj2[key]
}
}
console.log(obj1)

数组合并：
var arr1 = [1,2,3]
var arr2 = [4,5,6]
arr1.push.apply(arr1,arr2)
console.log(arr1)

 var arr1 = [1,2,3]
 var arr2 = [4,5,6]
 var arr3 = [...arr1,...arr1]
 console.log(arr3 )

var arr1  = [1,2,3];
var arr2 =[4,5]
arr1  = arr1  .concat(arr2 );
console.log(a);
这个方法会重新创建一个新的数组

数组去重：
var arr1 = [1,1,2,2,3,3]
function fn(arr){
return Array.from(new Set(arr))
}
var newArr = fn(arr1)
console.log(newArr)

var arr1 = [1,1,2,2,3,3]
var arr1 = [...new Set(arr)]
console.log(arr1)
function fn(arr1){
        for(i=0;i<arr1.length-1;i++){
            for(j=i+1;j<arr1.length;j++){
                if(arr1[i] == arr1[j]){
                    arr1.splice(j,4)
                    j--;
                }
            }
        }
        return arr1
    }
    var arr = fn(arr1)
    console.log(arr)

var newarr = []
    for(i=0;i<arr1.length;i++){
        if(newarr.indexOf(arr1[i]) == -1){
            newarr.push(arr1[i])
        }
    }
    console.log(newarr)

数组指定插入数组：
var arr1 = [a,b,c]
var arr2 = [4,5,6]
arr1.splice(2,0,4,5,6)
// 把arr2 变成一个适合splice的数组（包含splice前2个参数的数组）
console.log(arr1)

let myArray=[11,22,33];
console.log('原数组：',myArray);
myArray.push(44,55);
console.log('用push在数组后面插入元素：',myArray);
myArray.unshift(66,77);
console.log('用unshift在数组前面插入元素：',myArray);
myArray.splice(2,0,'肾虚少年');
console.log('用splice在数组指定位置插入元素：',myArray)

闭包：
function a(){
var name = ‘en’;
return function(){
return name
}
}
var b = a()
console.log(b())
在这段代码中，a()中的返回值是一个匿名函数，这个函数在a()作用域内部，所以它可以获取a()作用域下变量name的值，将这个值作为返回值赋给全局作用域下的变量b,实现了在全局变量下获取到局部变量中的变量的值

简单的C3动画
width:100px;
height:100px;
background:pink;
position:relative;
animation:anim 5s //如果要重复循环加 infinite alternate
-webkit-animation:anim 5s;//要兼容的浏览器

@keyframes anim{
0%{background:red;left:0px;top:0px}
25%{background:blue;left:200px;top:0px;}
50%{background:yellow;left:200px;top:200px;}
75%{background:green;left:0px;top:200px;}
100%{backgroun:black;left:0px;top:0px;}
}

等级三角形

width: 0;
height: 0;
border: 100px solid;
border-color: transparent transparent pink;

圆形
width:100px;
height:100px;
border-radius:50%;
background:pink;