大师网-带你快速走向大师之路 解决你在学习过程中的疑惑,带你快速进入大师之门。节省时间,提升效率

作业帮

1、写输出,关于提升

    alert(a);
        var a=1;
        functiona(){
            alert(a);
        }
alert(a);

分别输出

function a(){
            alert(a);
       }
1

相当于

       var a;
       function a(){
        alert(a);
       }
       alert(a);
       a=1;
       alert(a);//1

拓展:

(function(){
        var a=b=1;
     })()
    console.log(a);//出错,a is notdefined
     console.log(b);//1

//相当于
(function(){
        var a;
    a=1;
b=1;//b是全局变量,外部能访问,但是a是局部变量
     })()

但是使用严格模式‘use strict’则都报错
(function(){
      'use strict'
        var a=b=1;
     })()
    console.log(a);//出错,a is notdefined
     console.log(b);//出错,b is notdefined

2、两个有序数组,合并成一个有序数组。

思路,A,B两个数组从头比较,将较小着放入新数组,同时下标++,直到其中一数组走到头,将另一个数组的后面的数同时加入新数组,返回这个新数组

   
    function merSort(A,B){
        var i=0,j=0,arr=[];
        while(A[i]&&B[j]){
            if(A[i]<B[j]){
                arr.push(A[i]);
                i++;
            }else{
                arr.push(B[j]);
                j++;
            }
        }
        if(!A[i]){
            arr=arr.concat(B.slice(j));
        }
        if(!B[j]){
            arr=arr.concat(A.slice(i));
        }
        return arr;
    }

3、给定两个数组,两数组的交集后,去重输出。不能用es6.

思路,定义一个新数组,存放不重复的交集元素。遍历A(B)数组,判断另一个数组是否有重复元素,若有且在新数组中没有,则吧该数加入新数组,最后输出新数组

  function onlyEle(A, B) {
    var i = 0,
      j = 0,
      arr = [],
      l = A.length;

    for (let i = l - 1; i >= 0; i--) {
      let index = B.indexOf(A[i]),
        indexArr = arr.indexOf(A[i]);
      if (index >= 0 && indexArr < 0) { //B中和A[i]相等的元素
        arr.push(A[i]);
      }
    }
    return arr;
  }

4、不定宽元素垂直居中

父亲相对定位,孩子绝对定位,top,left各50%,然后相对自身移动一半

//dom
<div id="bd">         
    <div class="main">main</div>        
</div> 
//css
#bd{
    position: relative;
    height: 100px;
    width: 100px;
    border: 1px solid;
}
.main{
    position: absolute;
    top:50%;
    left: 50%;
    transform: translate(-50%,-50%); 
}

5、布局,中间自适应,两侧栏固定

1、flex布局
//html
<div id="bd">         
   <div class="l"></div>
   <div class="c"></div>
   <div class="r"></div>
</div>

//css
#bd{
  
    display: flex;
    width: 100%;
    height: 500px;
}
.c{
    flex:1;
    background-color: #f00;
}
.l,.r{
    flex:0 0 100px;
    background-color: #ff0;
}
圣杯布局
//html
div id="bd">         
    <div class="main">m</div>        
    <div class="sub">l</div>        
    <div class="extra">r</div>  
</div>
//css
  .main {        
    float: left;       
    width: 100%;   
    background:#ff0;
 }  
 .sub {       
    float: left;        
    width: 190px;        
    margin-left: -100%;               
    position: relative;  
    left: -190px;  
    background-color: #f00;
}   
.extra {        
    float: left;        
    width: 230px;        
    margin-left: -230px; 
    position: relative; 
    right: -230px;  
    background-color: #f00;

 }
#bd {        
    padding: 0 230px 0 190px;   
 }
3、双飞翼布局
//dom
<div id="main-wrap" class="column">
      <div id="main">#main</div>
</div>
<div class="sub"></div>        
<div class="extra"></div>

//css
.main-wrap {        
    float: left;       
    width: 100%;   
 }  
 .sub {       
    float: left;        
    width: 190px;        
    margin-left: -100%;   
}   
.extra {        
    float: left;        
    width: 230px;        
    margin-left: -230px; 
 }
.main {    
    margin: 0 230px 0 190px;
}

6、绘制布局

注意看清楚所给出的数值。看清每一个字眼,时间宝贵,面试官不会无缘无故写上的,凡是写上的,或者强调说了的,都是要考虑的,否则考虑不周到就掉进陷阱里了

<div id="bd" style="width: 100px;height: 100px;border:1px solid;">         
    <div class="main" style="width:50px;height: 50px;margin-top: 100px;background-color: #f00;">m</div>  
</div> 

这里的margin-top:100px,和父元素的高度一样高了,孩子模型必定跑出父亲的范围

总结,对于数组的考察较多,数组的各种算法问题。