阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      网易 前端工程师面试题

      网易2020校招笔试- 前端开发工程师(提前批)

      this指针问题

      有一类二叉树用三叉链表来存储的时候除了带有指向左右孩子节点的两个指针,还有指向父节点的指针,那么这样一棵二叉树有2个节点,那么有多少指针指向NULL(注:根节点的父指针指向NULL,对于不存在的节点表示为NULL)?

      正确答案: D

      1
      2
      3
      4
      5
      

      下面关于HTTP协议的说法错误的是( )

      正确答案: C

      HTTP报文分为请求报文和响应报文
      HTTP请求行由请求方法、URL和协议版本组成
      每个服务器都支持包括GET\HEAD\PUT等7种请求方法
      HTTP响应行由协议版本、状态码和状态描述符组成
      

      排序算法

      判断一个数组或序列是正序,倒序还是乱序,需要我们将这个数组完整的遍历一遍通过构建有序序列,对于未排序数据,在已排序序列中从后向前扫描,找到相应的位置并插入的排序算法是( )

      正确答案: C

      选择排序
      希尔排序
      插入排序
      归并排序
      

      下面代码的输出是

      const arr = [];
      const testObj = {};
      console.log(arr === "");
      console.log(arr == "");
      arr.toString = () => 1;
      console.log(arr === 1);
      console.log(arr == 1);
      arr.valueOf = () => 2;
      console.log(arr == 2);
      arr.valueOf = () => testObj;
      console.log(arr == testObj);
      

      正确答案: A

      false true false true true false
      false false false true false false
      false true false false true true
      false true true true true false
      

      下面代码的输出是

      let a = 0;
      const obj = {
          a: 1,
          b: function() {
          console.log(this.a);
          }
      }
      const obj1 = {
          a: 2
      }
      const fun = obj.b;
      fun(); 
      fun.apply(obj); 
      fun.bind(obj1).apply(obj); 
      const fun1 = fun.bind(obj1);
      new fun(); 
      

      正确答案: C

      0 1 2 2
      0 1 2 undefined
      undefined 1 2 undefined
      undefined 1 2 2
      

      下面代码的输出是:

      function func() {
          this.name = "Hellen";
      }
      console.log(typeof func.prototype);
      func.prototype.getName = function() {
          console.log(this.name);
      }
      const Obj = {};
      Obj.__proto__ = func.prototype;
      func.call(Obj);
      if (Obj.getName) {
          console.log("yes");
          Obj.getName();
      }
      console.log("end");
      

      正确答案: C

      function end
      function yes Hellen end
      object yes Hellen end
      Object end
      

      Funtion.prototype的原型链最终指向的哪?

      正确答案: B

      Funtion
      Object
      Null
      Array
      

      下面代码的输出是

      function func(source) { 
          var target = {}; 
          for (var key in source) { 
              if (Object.prototype.hasOwnProperty.call(source, key)) {
                   if (typeof source[key] === 'object') { 
                      target[key] = func(source[key]); 
                   } else { 
                      target[key] = source[key]; 
                   }
              } 
          } 
          return target; 
      }
      var a = { a1: "a1", a2: { b1: "b1", b2: "b2" }, a3: undefined, a4: null, a5: 1 };
      var b = func(a); 
      console.log(b);
      

      正确答案: A

      {a1: "a1", a2: {b1: "b1", b2: "b2"}, a3: undefined, a4: {}, a5: 1}
      {a1: "a1", a2: {b1: "b1", b2: "b2"}, a3: null, a4: null, a5: 1}
      {a1: "a1", a2: {b1: "b1", b2: "b2"}, a3: undefined, a4: undefined, a5: 1}
      {a1: "a1", a2: {b1: "b1", b2: "b2"}, a3: undefined, a4: null, a5: 1}
      

      计算面积的问题

      <canvas width="250" height="250"></canvas>,
      

      有个矩形长20px,高10px,css中width:250px,height:500px; 请问这个矩形渲染出来的面际是多少?

      正确答案: C

      200
      300
      400
      800
      

      下列布局在页面上的宽度比是多少?

      // css
      .flex {
      display: flex;
      width: 200px;
      height: 100px;
      }
      .left {
      flex: 3 0 50px;
      background: red;
      }
      .right {
      flex: 2 0 100px;
      background: blue;
      }
      
      // html
      <div class="flex">
          <div class="left"></div>
          <div class="right"></div>
      </div>
      

      正确答案: A

      2:3
      1:3
      3:2
      1:5
      

      事件相关的编程题

      如下图所示,请实现如下功能,当鼠标移到黑底客户服务区块后,出来白底卡片内容,鼠标移出后,卡片内容消失,并且当鼠标在白色部分上移动时白色框不能消失。

      要求实现该功能完整的html、css及js代码

      参考:三角形图标的样式为 trangle-down如下:

      .triangle-down{
          width:0;
          height:0;
          border-left:5pxsolidtransparent;
          border-right:5pxsolidtransparent;
          border-top:5pxsolidblack;
      }
      

      参考答案:

      <!DOCTYPE html>
      <html>
      <head>
          <title>任务-4</title>
          <style type="text/css">
              *{
                  margin:0;
                  padding:0;
              }
              html,body{
                  height:100%;
                  width:100%;
              }
              #container{
                  width:200px;
                  height:200px;
                  padding:20px;
                  border:1px solid #666;
                  margin:50px 0 0 50px;
              }
              #box{
                  height:30px;
                  line-height:30px;
                  width:100%;
                  background-color:black;
                  color:white;
                  text-align:center;
                  width:120px;
                  cursor:pointer;
                  border-bottom:1px solid rgba(0,0,0,.2);
                  position:relative;
              }
              .before{
                  width:0;
                  height:0;
                  border-top:6px solid white;
                  border-left:6px solid rgba(0,0,0,0);
                  border-right:6px solid rgba(0,0,0,0);
                  border-bottom:6px solid rgba(0,0,0,0);
                  position:absolute;
                  top:12px;
                  right:10px;
                  display:block;
              }
              .after{
                  width:0;
                  height:0;
                  border-top:6px solid rgba(0,0,0,0);
                  border-left:6px solid rgba(0,0,0,0);
                  border-right:6px solid rgba(0,0,0,0);
                  border-bottom:6px solid #f60;
                  position:absolute;
                  bottom:12px;
                  right:10px;
                  display:none;
              }
              .active{
                  background-color:rgba(0,0,0,.1) !important;
                  color:#f60 !important;
              }
              ul{
                  list-style:none;
                  width:80%;
                  height:auto;
                  background-color:rgba(0,0,0,.1);
                  padding:6px;
                  display:none;
              }
              ul li{
                  height:25px;
                  line-height:25px;
                  margin-left:15px;
                  font-size:14px;
                  cursor:pointer;
                  color:rgba(0,0,0,.5);
              }
              ul li:hover{
                  color:black;
              }
          </style>
      </head>
      <body>
      <div id="container">
          <div id="box"><span class="before"></span>客户服务<span class="after"></span></div>
      <ul>
          <li>> 联系客服</li>
          <li>> 帮助中心</li>
          <li>> 知识产权保护</li>
          <li>> 规则中心</li>
      </ul>
          </div>
       
      <script type="text/javascript">
          let oDiv = document.querySelector('#box');
          let oUl = document.querySelector('ul');
          let box_before = document.querySelector('.before');
          let box_after = document.querySelector('.after');
          oDiv.onmouseenter = function(){
              oUl.style.display = 'block';
              oDiv.className = 'active';
              box_before.style.display = 'none';
              box_after.style.display = 'block';
          }
          oUl.onmouseenter = function(){
              oUl.style.display = 'block';
              oDiv.className = 'active';
              box_before.style.display = 'none';
              box_after.style.display = 'block';
          }
          oDiv.onmouseleave = function(){
              oUl.style.display = 'none';
              oDiv.className = '';
              box_before.style.display = 'block';
              box_after.style.display = 'none';
          }
          oUl.onmouseleave = function(){
              oUl.style.display = 'none';
              oDiv.className = '';
              box_before.style.display = 'block';
              box_after.style.display = 'none';
          }
      </script>
      </body>
      </html>
      

      设计一个uniqueify函数,可以根据用户自定义的 重复判定规则 进行数组元素去重

      举个例子:

      //情况一:
      letarr0 = [1,1,1,0,5,6];
      uniqueify(arr0);
      //输出:[1,0,5,6]
       
      //情况二:
      letarr1 = [
          {id: 1, name:'xx'},
          {id: 1, name:'xx'},
          {id: 2, name:'xx'},
          {id: 1, name:'xx'},
          {id: 1, name:'xx'}
      ];
      uniqueify(arr1, a=>a.id);//假如这里的去重规则依据为id
      //输出:
      [
          {id: 1, name:'xx'},
          {id: 2, name:'xx'}
      ];
       
      //情况三:
      letarr2 = [
          {name:'xx',sex:'male'},
          {name:'xx',sex:'female'},
          {name:'xx',sex:'male'},
          {name:'aa',sex:'male'},
          {name:'aa',sex:'male'}
      ];
      uniqueify(arr2, a=>(a.name+a.sex));//假如这里的去重规则依据为名字和性别均相同,才算是相同
      //输出:
      [
          {name:'xx',sex:'male'},
          {name:'xx',sex:'female'},
          {name:'aa',sex:'male'}
      ];
      

      参考:

      function uniqueify(arr, cb) {
        let newArr = [];
        if (!cb) {
          //cb 不存在, 直接数组去重
          newArr = [...new Set(arr)];
        } else {
          // cb存在
          let obj = {};
          arr.forEach(item => {
            if (!obj[cb(item)]) {
              obj[cb(item)] = item;
              newArr.push(item);
            }
          });
        }
       
        console.log(newArr);
      }
      

      小易给你一个包含n个数字的数组 a1,a2,...,a3。你可以对这个数组执行任意次以下交换操作:

      对于数组中的两个下标i,j(1<=i,j<=n),如果a1+aj为奇数,就可以交换aiaj

      现在允许你使用操作次数不限,小易希望你能求出在所有能通过若干次操作可以得到的数组中,字典序最小的一个是什么。

      https://www.nowcoder.com/test/question/done?tid=39069463&qid=800683#summary


      小易在维护数据的时候遇到一个需求,具体来说小易有一系列数据,这些数据了构成一个长度为n的数字序列,接下来小易会在这个序列上进行q次操作。

      每次操作有一个查询的数字x,小易需要将序列数据中所有大于等于x的数字都减一,并输出在本次操作中有多少个数字被减一了。

      小易犯了难,希望你能帮帮他。

      https://www.nowcoder.com/test/question/done?tid=39069463&qid=800686#summary

      小易学习了辗转相除法之后,就开始实践这个算法在求解最大公约数上。

      牛牛给小易出了一道不同寻常的求解最大公约数: 求解a和b的最大公约数,但是a和b的范围特别大。

      小易遇到了困难,向聪明的你寻求帮助,希望你能帮帮他。

      https://www.nowcoder.com/test/question/done?tid=39069463&qid=800696#summary

      小易给定了一个长度为n的数字序列,对于每一个 1<=k<=n,小易希望能求解出所有长度为k的连续子序列的最大值中的最小值。

      https://www.nowcoder.com/test/question/done?tid=39069463&qid=800698#summary

      参考

      其它语言的网易(非前端)

      目录
      目录