阿西河

所有教程

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

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      58同城 前端工程师面试题

      58同城2017秋招前端工程师笔试卷

      JS 输出值问题

      var a=[0];
      if(a){
          console.log(a==true);
      }
      else{
          console.log("wut");
      }
      

      结果输出是什么?

      false
      

      css 属性能够设置盒模型的内边距为上 10px 、下 20px 、左 30px 、右 40px 的合并写法 ____.

      padding:10px 40px 20px 30px;
      

      当块级元素设置 box-sizing:border-box 属性时,该块级元素的 width 包含哪几个部分?

      padding,border和content

      列举出 3 个 JS 中的基本数据类型

      基本数据类型6种:number,string,Boolean,undefined,null, symbol(ES6)

      input 的 type 属性值列举 3 个.

      text, password,file,checkbox,radio,submit,email

      移动浏览器中,触摸一下屏幕会依次触发哪些事件.

      触摸事件,有touchstart touchmove touchend touchcancel 四种之分 touchstart:手指触摸到屏幕会触发 touchmove:当手指在屏幕上移动时,会触发 touchend:当手指离开屏幕时,会触发 touchcancel:可由系统进行的触发,比如手指触摸屏幕的时候,突然alert了一下,或者系统中其他打断了touch的行为,则可以触发该事件

      ‘5’+3 等于 ____ , ‘5’-3 等于 ____.

      字符串和数字相加,会把数字转成字符串再相加:如 ‘5’ + 3 = ‘5’ + ‘3’ = ‘53’ 字符串和数字相减,会把字符串转为数值再相减:

      常见的浏览器端的存储技术有哪些?

      cookie:放在http请求头中,伴随数据传输而传输,数据传输大小有限制,有过期时间
      localstorage:存储在本地,不会伴随数据传输,生命周期为永久
      sessionstorage:浏览器中,浏览器关闭则消失,即使在同源浏览器中也不能共享
      userdata:ie中用于浏览器存储技术
      globalstorage:ff中用于浏览器存储
      

      非严格模式下写出下面表达式结果

      parseInt(“123a”)=____.

      123

      JS输出结果

      var a=[1,2,3,4,5];
      a.splice(1,3,5,2,1);
      console.log(a);
      

      a 的输出结果 ____

      输出为[ 1, 5, 2, 1, 5 ]
      splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目。
      splic(1,3),删除了,从第二位开始,3个字符的数量,返回[1,5],
      数组[5,2,1],添加到删除的位置,返回的数组就是[1,5,2,1,5]
      

      简述css中position属性为absolute和relative的区别。

      1、position:relative 相对定位

      特点:

       * 1)不影响元素本身的特性;
       * 2)不使元素脱离文档流(元素移动之后原始位置会被保留);
       * 3)如果没有定位偏移量,对元素本身没有任何影响;
       * 4)提升层级。
      

      注:定位元素位置控制:top/right/bottom/left 定位元素偏移量

      2、position:absolute 绝对定位

      特点:

       * 1)使元素完全脱离文档流;
       * 2)使内嵌支持宽高;
       * 3)块属性标签内容撑开宽度;
       * 4)如果有定位父级相对于定位父级发生偏移,没有定位父级相对于document发生偏移;
       * 5)相对定位一般都是配合绝对定位元素使用;
       * 6)提升层级
      

      简述domready和onload事件的区别?图片的onload和domready和页面onload的先后顺序,并简述原因。

      dom文档加载的步骤为:

      1.解析html结构 
      2.加载外部脚本和样式表文件 
      3.解析并执行脚本代码 
      4.dom树构建完成 // DOMContentLoaded 
      5.加载图片等外部文件 
      6.页面加载完毕 // window.onload 可以通过addEventListener测试一下结果 先DOMContentLoaded也即domready然后img的ready最后window的ready。
      

      描述一个你在实际项目中有用过什么比较好的布局方式(不拘泥于页面整体布局,页面中某一小版块也行),深入讲解下其中的原理?

      就拿响应式布局来说,pc站当然是把所有能呈现的东西都呈现出来,而且一般整体是纵向布局,局部用横向布局(float较多)。到了平板电脑,基本上和pc的布局也是差不多的。到了手机,才开始有了很大的变化,整体依然是纵向布局,但是横向布局却变得越来越少,因为手机能呈现在一屏的内容确实是少之又少,而且还要考虑到分辨率大小的问题,所以一般都是不用float布局,把最重要的功能呈现出来,没有pc里面那么多的效果。

      左侧固定宽度,右侧自适应 给父盒子设置高度和左内边距如200px 给左侧子盒子设置设置高度和左外边距-200px,设置float:left,设置宽度为200px 右侧子盒子设置高度

      目前用得最多的就是flex布局和float布局交替使用,比如导航栏没有特殊样式需求,都是横着排的我就会选择用flex布局,让各个元素自动排列,如果导航栏中有几个是左排,有一个是居右显示,此时我就会选择用float来布局

      Ajax是什么?Ajax的交互模型?同步和异步的区别?如何解决跨域问题?

      一、Ajax是什么?

      1、Ajax全称asynchronous javascript and xml ,可以说是已有技术的组合。 2、主要用来实现客户端与服务器的异步通信效果,实现页面的局部刷新 3、ajax的实现过程 创建XMLHttpRequest对象,也就是创建一个异步调用对象 创建一个新的http请求,并指定该http请求的方法、URL以及验证信息 设置响应http请求状态变化的函数 发起http请求 获取异步调用返回的数据 使用javascript 和 dom 实现局部刷新

      二、同步、异步的区别 同步:阻塞的 两人吃饭。一人忙,一人等 异步:非阻塞的 两人吃饭。一人忙,另一个不等

      三、如何解决跨域问题?

      理解跨域的概念:协议、域名、端口都相同是同源,否则都是跨域 解决:动态创建script标签,使用标签的src属性访问js文件的形式获取js脚本,并且这个js脚本中的内容是函数调用,该函数调用的参数是服务器返回的数据,为了获取这里的参数数据,需要事先在页面中定义回调函数,在回调函数中处理服务器返回的数据。


      简述 instanceoftype 的区别?

      简述 []instanceof Object的值和原因?

      区别详见https://segmentfault.com/a/1190000000730982,粗糙地讲: type 获取对象的基本类型,常用于判断对象是否赋值,instanceof 返回对象的类。

      直接instanceof Object 将报错,应为instanceof操作的是类对象,而 Object 是一个方法 (可用 typeof Object查看)

      typeof一元运算符, 用来检测基本数据类型,

      返回值有undefined,string,boolean,number,function,object,都是加引号的 对于是不是数组用typeof检测不出来,要用到instanceof了,当然可以用Array.isArray() instanceof 双目运算符, 用来检测引用类型,返回值是boolean形的 var a=[1,2];a instanceof Array


      编写一个函数isMerge,判断一个字符串str是否可以由其他两个字符串part1和part2“组合”而成。

      “组合 ”的规则如下:

      1). str中的每个字母要么来自于part1,要么来自于part2;

      2). part1和part2中字母的顺序与str中字母的顺序相同。

      例如:

      “codewars"由"cdw"和"oears"组合而成:

      s: c o d e w a r s = codewars
      part1: c d w = cdw
      part2: o e a r s = oears
      

      完成函数:

      function isMerge(s, part1, part2) {
      //code here
      }
      

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

      编写请给 Array 本地对象增加一个原型方法,它用于删除数字数组中重复的数字(可能有多个),返回值是一个包含被删除的重复条目的新数组。

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

      编程题克隆可乐

      小 S,小L,小P,小R和小H 五个人排队站在一个出售’克隆可乐’的自动贩卖机前 ; 队伍中除了他们五个没有其他人 。 队形如下 : 小 S,小L,小P,小R,小H

      队列的第一个人 (小S)买了一听可乐,喝下去后变成了两个小S!然后两个小S心满意足的站到了队伍的最后。此时队形变成了这样:

      小 L,小P,小R,小H,小S,小S

      然后队列中下一个人 (小L)也买了听可乐,喝下去后变成两个人,站到了队伍最后。以此类推。例如小P第三个喝了克隆可乐,之后队伍变成这个样子:

      小 R,小H,小S,小S,小L,小L,小P,小P

      请问第 n个喝这个饮料的人是谁?

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

      参考

      https://www.nowcoder.com/test/6030331/summary

      目录
      目录