前端面试题6.11

经过将近一个星期的面试，深圳的面试一般都是技术笔试—>技术一面—>hr面试—>技术主管面试的流程。

• 技术笔试一般都是一些基础的概念描述，或者手写代码（这里注意，平时还是要好好分析自己不会的代码，不要百度后直接粘贴上去就完事了）。

• 技术一面来说，就是问问你笔试题的答题思路等的一些问题，附带问问你简历上的掌握的技能，也会问问你项目中的一些技术的使用问题。

• hr面试就是问问你的学历，个人情况，以及对加班的看法，问问能不能接受加班（肯定要回答接受啦吼~~~程序员加班理所当然），然后就是给你介绍下公司的业务和基本情况，还有最重要的就是薪资的问题了，我一般都会问试用期的薪资多少（重点！！！有的公司试用期工资是转正的100%，一般的是给80%或以上，低于80%的话，大家要慎重考虑）

• 然后就是技术主管面试，技术主管，也是会先了解一下你的个人情况，然后会根据你的笔试题以及简历提一些问题，不过没有技术一面那么多，但是技术主管就会问你一些偏计算机基础啊，linux常用命令了解不了解啊，还有一些偏底层的东西，还会问下数据结构与算法之类的东西。

正文开始啦（笔试题。。。我能想起来的有印象的）

px ,em,rem

名称	类型	相对于
px	相对长度单位	浏览器屏幕分辨率
em	相对长度单位	当前对象内文本的字体尺寸

• px的特点：
  1. IE无法调整那些使用px作为单位的字体大小；
  2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位；
  3. Firefox能够调整px和em，rem，但是96%以上的中国网民使用IE浏览器(或内核)。
• em相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸
  EM特点
  1. em的值并不是固定的；
  2. em会继承父级元素的字体大小。
• rem。rem是CSS3新增的一个相对单位（root em，根em),使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素。

用css写一个三角形

div {
    width: 0;
    height: 0;
    border-width: 0 40px 40px;
    border-style: solid;
    border-color: transparent transparent red;
}

一般我们在给元素设置border的时候直接设置一个值，其实border是由四条边组成的

div {
    width: 100px;
    height: 100px;
    border: 20px solid red;
}

以上代码效果如图示

如果我们给每一边都设置不同的颜色，把元素的高度宽度设置为0

div {
        width: 0px;
        height: 0px;
        border-width: 50px;
        border-style: solid;
        border-color: orange aqua deeppink dodgerblue;
    }

以上代码效果如图示

这时候我们就会发现这个元素是由四个三角形拼接而成的，此时我们只需要留一个三角形就行，我们这时就可以把其他的三个颜色设置为透明或者白色就可以了

div {
        width: 0px;
        height: 0px;
        border-width: 50px;
        border-style: solid;
        border-color: white white deeppink ;
    }

效果如图

以上就是使用css画三角的方法

取消鼠标右键的默认事件

function   document.onmousedown(){
     if(event.button==2||event.button==3)
     {
           alert( “禁止右键操作 “)
           return   false
       }
}

数组和字符串的函数

https://www.cnblogs.com/leaf930814/p/6919197.html
挺多的不整理了，自己看下，平时一般都会用到。

写出常见http状态码（真的是笔试题常见的问题，一定要记住）

1XX的代表请求已被接受，需要继续处理
2XX这一类型的状态码，代表请求已成功被服务器接收、理解、并接受
3XX这类状态码代表需要客户端采取进一步的操作才能完成请求
4XX这类的状态码代表了客户端看起来可能发生了错误，妨碍了服务器的处理
5XX这类状态码代表了服务器在处理请求的过程中有错误或者异常状态发生，也有可能是服务器意识到以当前的软硬件资源无法完成对请求的处理

普通函数function( ) { }和()=>{}的区别

• 普通函数的this指向调用者
• 箭头函数中的this一般指向window，箭头函数不能构造函数，不能使用new

es6中的let 和const

• const定义常量，let定义变量，不能重复定义，没有变量提升；
• var既可以定义常量也可以定义变量，有变量提升，可以重复定义。

react中function component 和class component的区别

• class component是一个有状态组件，function component是无状态组件。
• class component有生命周期，function component 没有生命周期。

class component优点：

• 可以提升性能，可以调用shouldComponentUpdate 减少组件渲染的次数
• 需要用setState来改变组件的状态

function component优点：

• 代码相对于class来说要少
• 无状态组件

写出react 的生命周期

• mounting挂载
  componentWillMount()组件挂载前
  componentDIDMount()组件挂载后
• Updating更新
  componentWillReceiveProps()挂载组件接受属性值
  shouldComponentUpdate()组件是否接受更新
  componentWillUpdate()组件即将更新
  render()组件渲染
  componentDidUpdate()组件更新后
• Unmounting卸载
  componentWillUnmount()组件将被卸载

cookie，seession和localstorage区别

名称	大小	请求携带	失效时间	作用域
cookie	4k	是	需自己设置失效时间	在所有同源窗口中都是共享的
session	5M	否	浏览器关闭时失效	不在不同的浏览器窗口中共享，即使是同一个页面
localstorage	5M	否	一直有效	在所有同源窗口中都是共享的

Linux常用命令

cd /目录 : 进入该目录
cd … : 返回上一级目录
cd ~ :返回主目录
ls : 查看目录中的文件
pwd: 显示工作路径
ls -lh: 显示权限
mkdir dir: 创建一个叫做 ‘dir’ 的目录’
who am i :查看当前使用的终端
date :显示系统日期
clear :清空命令行
rm 文件 :删除文件
chmod [-R] 777文件或目录 ：设置权限
sudo 命令 ：以root的身份执行命令（输入用户自己的密码)
history :显示这台机器的历史命令

果然啊，代码敲多了，记性开始变差了，总共做了十几道题，就记住了这几道（吼~~~~），我该吃核桃了，还有一些是js代码题，太长了记不住就不写了，好像是让用js重写Java的map（咳咳~ ~ 不会Java，不知道Java的map咋实现的，等我有空问问Java朋友的~~~）。