zoukankan      html  css  js  c++  java
  • 前端js部分面试题

    1.写出一个方法,可以数组去重

    方法一:构建一个新的数组存放结果;for循环中每次从原数组中取出一个元素,用这个元素循环与结果数组对比;若结果数组中没有该元素,则存到结果数组中.

         <script>
                   function unique(arr){
                       var result=[];//用来存放查找的元素
                       for(var i=0;i<arr.length;i++){//外层循环遍历arr[i]
                           for(var j=0;j<result.length;j++){//内层循环遍历新的数组
                               if(arr[i]==result[j]){//如果相等 表示arr[i]在新的数组中已经存在不继续执行
                                   break;
                               }
                           }
                           if (j==result.length) {//如果j==新数组的长度,表示遍历新数组后没有找到一样的
                               result[result.length]=arr[i];
                           }
                       }
                       return result;
                   }
                   function testunique(){
                       arr[i] = [1,2,3,4,3,5,6,4,3,2,3];
                       var result=unique();
                       console.log(result);
                   }
           </script>

    方法二:

      先将数组进行排序,排序之后重复数组会在相邻的位置,然后检查数组第一个和最后一个元素是否相同,如果不相同,就把元素放进新的数组中去。

      这种方案改变了元素本来的顺序,是排序过后的数组。

    function unique(){
              var arr= [1,2,3,4,3,5,6,4,3,2,3];
              var result = [];//存放结果数组
              arr = arr.sort();
              // console.log(arr);
              for(var i=0;i<arr.length;i++){
                  if(arr[i]!= result[result.length-1]){
                      result.push(arr[i]);
                  }
              }
              console.log(result);
          }

     第三种方法(推荐方法)

    function unique(arr){
      var hash=[];
      for (var i = 0; i < arr.length; i++) {
        for (var j = i+1; j < arr.length; j++) {
          if(arr[i]===arr[j]){
            ++i;
          }
        }
          hash.push(arr[i]);
      }
      return hash;
    }

    2.split()和join()的区别

      join() 方法用于把数组中的所有元素放入一个字符串。

      元素是通过指定的分隔符进行分隔的。

      指定分隔符方法join("#");其中#可以是任意;

      split,是把一串字符(根据某个分隔符)分成若干个元素存放在一个数组里。而Join是 把数组中的字符串连成一个长串,可以大体上认为是split的逆操作。

      个人理解:jion("")表示把数组中所有的元素拼接成字符串存放在一个字符串中,split("")是把数组分割成若干个字符串然后存放在数组中。

    3.javascript的typeof返回哪些数据类型:

      boolean,string,number,function,object,undefined,

    4.

    1 var User = {
    2  count: 1,
    3  getCount: function() {
    4   return this.count;
    5  }
    6 };
    7 console.log(User.getCount()); // what?
    8 var func = User.getCount;
    9 console.log(func()); // what?
    两处输出的结果是什么?

     答:输出 1 和 undefined   解析:func是在window的上下文中被执行的,所以不会访问到count属性。 

    5.函数声明与函数表达式的区别?

      在JavaScript中,解析器在执行环境中加载数据时候,解析器会率先读取函数声明,并且使其在执行代码之前可以访问,

      function fnName(){xxxx}; // 函数声明:使用function关键字声明一个函数,在指定一个函数名。

      

      函数表达式就必须等到解析器执行到所在代码行的时候才会被解析执行。

      var fnName = function(){xxxx}; //函数表达式:使用function关键字声明一个函数,但是未给函数命名,最后将匿名函数赋予给一个变量。

    6.判断字符串以字母开头,后面可以是数字,下划线,字母,长度为6-30。

    var reg=/^[a-zA-Z]w{5,29}$/;

      用正则表达式:var reg = /^[a-z]w{5,29}$/ig;

      解析:i表示不区分大小写    g表示全局查找

         [a-z]的所有字母  w  匹配一个单字字符

         ^匹配字符串的开始 $匹配字符串的结束

    7.

    <script>
         var a = 100;  
         function test(){  
            alert(a);  
            a = 10;  //去掉了var 就变成定义了全局变量了
            alert(a);  
    }  
    test();
    alert(a);
    </script>

    弹框输出的值是多少?

      答:100,10,100  错误:在调用函数以后a = 10   在函数中a并不是在函数作用中重新声明的变量 a  而是全局变量 a ,所以最后的a的值变化了。

    8.javaScript的2种变量范围有什么不同?

      全局变量:在当前页面中有效。

      局部变量:在作用范围内有效。

    9.null和undefined的区别?

      null表示“无”的对象,转换为数值的时候为0,;undefined表示为“无”的原始值,转为数值为NaN。

      当声明变量没有初始化的时候默认值为undefined。null表示为尚未存在的对象。

      undefined表示缺省值,意味此处应该有一个值,但为定义。

      常见情况为:

        1)声明变量后但为赋值,变量值为undefined。

        2)调用函数的时候没有提供参数,此时该参数值为 undefined。

        3)对象没有赋值的属性,属性值为undefined。

        4)函数没有返回值时,默认返回undefined。

      null表示没有对象,意味此处不应该有值

      常见情况为:

        1)作为函数的参数,表示该函数的参数不是对象。

        2)作为对象圆形链的终点。

     10.程序输出的是什么?

     <script>
         var myObject ={
             foo:"bar",
             func:function(){
                 var self =this;
                 console.log(this.foo);
                 console.log(self.foo);
                 (function(){
                     console.log(this.foo);
                     console.log(self.foo);
                 }());
             }
         };
         myObject.func();
         </script>

    输出结果为bar   bar  undefined  bar

    11.运行以下程序,输出的结果为

    var m=1;j=k=0;
         function add(n){
             return n=n+1;
         }
         y=add(m);
         function add(n){
             return n= n+3;
         }
         z = add(m);
         console.log(y);
         console.log(z);

      解析:在以上程序中,function  add(n)被两次重新定义,所以上面的add(n)是不运行的,调用的是下面的这个函数

      4        4

    上面的函数add(n)不调用的

    12.下列代码输出的结果是什么:

    console.log(1+ +"2"+"2");
     console.log("A"-"B"+"2");
    console.log("A"-"B"+2);

     解析: 第一个表达式中 : +是强制类型转换  把"2"转换成了 数字的2 ,最后输出的值为 32

        第二个和第三个表达式是:在进行非加法运算的时候,会自动的将能转换成数字的都转换成数字类型再进行运算

        32   NaN2   NaN

    13.下列代码输出的值为

    function add(m){
             return function b(n){
                 return n+m++
             }
         }
         var add1 = add(070);
         var add2 = add(050);
         console.log(add1(010));
         console.log(add2(010));

      64     48

      解析:070 和 050 是八进制数的 56  和 40

         m++是先执行别的操作再进行自加运算

    14.下列叙述不正确的是(C

    A)document:最顶层的节点,所有的其他节点都是附属于它的

    B)documentTypeDTD:引用(使用<!DOCTYPE>语法)的对象表现形式

    C)Attr:代表一对特性名和特性值。这个节点类型能包含子节点

    D)documentFragment:可以像document一样来保存其他节点

    15.javascirpt中的数字在计算机内存储为多少Byte?  C

    A.  2 Byte

    B.  4Byte

    C.  8Byte

    D.  16Byte

    16.假设val已经声明,可定义为任何值。则下面js代码有可能输出的结果为:    C   解析:?前面的是一个非空的字符串  所以输出define

    console.log('Value is ' + (val != '0') ? 'define' : 'undefine');             //只有undefined,null,false,0,空串会转换成false,其他的全部为true

    A.  Value is define

    B.  Value is undefine

    C.  define

    D.  undefine

    E.  Value is define 或者 Value is undefine

    F.  define 或者 undefine

    17.call 和 apply的用法和区别

    两者都是用来改变指向的,功能相同,用法不同

    而call的用法是  函数名.call.(指向的对象,“传递的值”)

    apply传递进去的值必须是数组形式,用法是 函数名.apply.(指向的对象,[传递的值])

    18.写出javascript语言typeof可能返回的结果?

    string  number object function undefined boolean;

    19.如今有一个Ul,里面有十亿个Li,要求点击li触发事件,弹出对应的li的内容

    里面有十亿个li,所以用循环是不太现实的,现在要用事件委托。

    var ul = document.getElementsByTagName('ul')[0];
    ul.onclick=function(e) {
    var event = e || window.event;
    vartar = event.target || event.srcElement;
    if(tar.tagName.toLowerCase()==="li")
    alert(tar.innerText);
    }

    20.如何阻止事件冒泡和事件默认事件

    冒泡事件:即事件从最底层逐个经过上面一级级事件的过程,就是冒泡事件。在非IE浏览器中提供了一个事件对象stopPropagation,那么在IE浏览器中可以通过cancelBubble事件对象阻止。

    默认事件:浏览器的默认事件就是浏览自己的行为,比如我们在点击<a href="#">的时候,浏览器跳转到指定页面,或者是当我们滚动鼠标时页面会向下滚动,但我们按空格键和按方向键时也会向下滚动,为了更好的用户体验,这时我们就需要阻止这种行为的发生。

    阻止事件冒泡:

    function stopBubble(e) {
        if(e && e.stopPropagation) {
            e.stopPropagation();
        }else {
            window.event.cancelBubble = true;
                }
        }

    阻止浏览器的默认事件:

    function stopDefault(e) {
        if(e && e.preventDefault) {
            e.preventDefault();
            }else {
                    window.event.returnValue = false;
              }
        return false;
    }

    21.

    运行test(),new test()的结果是什么

    var a = 5;
    
     function test() { 
    
        a = 0; 
    
        alert(a); //0
    
        alert(this.a);//5 this指向window  函数本身没this,就会去上层找this,就找到了window 
    
        var a; //在预编译中 就已经声明过了
    
        alert(a); 
    
    }
    //new test(); 运行结果,new在函数中生成一个this对象,然后没有new的时候this指向外面,有new的时候this指向function的this对象。
    //结果是0,undefined,0

    22.有字符串“aaabbbcccdddeeefgggaa”,转换成连续不重复的字符串,eg:abcdefga。

    var reg = /(.)1*/g;
    
    var str = 'aaabbbcccdddeeefgggaa';
    
    str.replace(reg,str);

    23.你了解js时间线嘛,能简单描述一下

    1.创建document。document.readyState = ‘loading’;

    2.解析script(无defer async)阻塞执行

    3.async异步加载,加载完执行

    4.defer异步加载

    5.遇到img等标签,解析dom结构,然后加载src内容

    6.dom解析完毕,document.readyState = ‘interactive’;

    7.按顺序执行defer脚本

    8.dom触发DOMContentLoaded事件,由同步脚本阶段,转变为异步事件监听阶段

    9.async下载并执行完,img的src等都下载完,触发document.readyState = ‘complete’;window触发load事件。

  • 相关阅读:
    vue的echart基本使用
    vue和angular中moment.js格式化时间插件
    vue-element的上传图片
    vue小问题-验证规则的坑
    前端请求的接口来自不同的服务器处理
    vue报错:Invalid prop: type check failed for prop "index". Expected String with value
    vue注册页面表单元素
    项目的上传 /码云(git)
    前端工程化-模块化
    fs && path.join()
  • 原文地址:https://www.cnblogs.com/wangzheng98/p/10952218.html
Copyright © 2011-2022 走看看