大概是在6月11号在Boss直聘投的简历，6月12号中午收到电话约的面试时间，刚开始说是13号晚上7点；后面可能时间有变，中午来了个电话说改到9-10点；怎么说算是第一次面试自己目标公司之一吧，记录下不管过没过，也是一份宝贵经历。
- （面试时间：2018-6-12 晚上：9.00；时长：1小时11分钟；公司：6666，（一面））
（一）简单的介绍下自己
- 介绍的真的很简单。。。。。。
（二）平时都是怎么学习前端的？
- me：学习前端的话，我主要是以书籍为主、然后是网站视频、博客、文档等学习理论，之后再通过代码实践。。。
- H:前端的学习的话一般是得通过实践的，平时有自己做过项目吗？
- me：学习基础的js阶段的话主要是通过实现一些基本特效和模块功能；在学习jQuery的时候做过一个
（三）做过哪些项目，你在其中主要工作
- 说了下使用JQuery阶段，做过一个比较简单的商场；
- 在接触React是，也就是最近做的项目是一个完全使用React全家桶搭建的二手商场；
- 其中主要的工作的话就是负责前端的大部分工作，包括界面的规划，还有就是前后端交互等；
- 估计是一面，之后并没有很深入的问项目了，直接转到谈实习经历。
（四）看你有在淘宝美工的实习经历，说说你的工作
- 当时是在深圳的一家小型的电商公司实习的，主要工作的话，包括一些简单的PS图片处理；
- 还有就是店铺的代码美工优化，因为在淘宝和阿里的平台上店铺的装修可以通过代码进行书写；但是都会有对应的使用限制（简单的说了下自己的日常工作）
（五）React组件的创建方式和区别
- React组件在本质上就是一个类，创建方式可以说用三种形式：
- React.createClass:是最传统、兼容性最好的方法，当是相对与其他ES6的创建方式来说代码量偏多；
- ES6 class创建：React.Component是以ES6的形式来创建react的组件的，是React目前极为推荐的创建有状态组件的方式，最终会取代React.createClass形式；相对于 React.createClass可以更好实现代码复用；
- 无状态组件（直接函数定义）：只传入两个参数props、context两个参数；不存在state，没有生命周期；
- 说的优缺点不是太详细，这里科普下：
1、 无状态函数式组件
- 无状态组件的创建形式使用一个使代码的可读性更好，并且减少了大量冗余的代码，精简至只有一个render方法，大大的增强了编写一个组件的便利
- 无状态组件不会像其它两种方法一样在调用时会创建新实例；它创建时始终保持了一个实例，避免了不必要的检测和内存分配，坐到了内部的优化；
组件不能访问this对象
- 无状态组件由于没有实例化过程，所以无法访问组件this中的对象，例如：this.state等均不能访问。
- 组件无法访问生命周期的方法
2、React.createClass
- 创建有状态的组件，这些组件是要被实例化的，并且可以访问组件的生命周期方法。
- 一般需要管理组件内部的状态、使用生命周期方法或者进行this绑定会使用这种形式创建组件。
3、React.createClass与React.Component区别
函数this自绑定
- React.createClass创建的组件，其每一个成员函数的this都有React自动绑定；
- React.Component创建的组件，其成员函数不会自动绑定this，需要开发者手动bind绑定，否则this不能获取当前组件实例对象。
- 组件属性类型propTypes及其默认props、state属性配置不同
const ItemComponent = React.createClass({
propTypes: {
name: React.PropTypes.string
},
getInitialState(){
return {
isLogin: false
}
},
getDefaultProps(){
return {
name: 'li'
}
}
render(){
return <div>{this.props.name}</div>
}
})
// VS
class ItemComponent extends React.Component {
static propTypes = {
name: PropTypes.string
};
static defaultProps = {
name: ''
};
constructor(props) {
super(props)
this.state = {
isLogin: false
}
}
render(){
return <div>{this.props.name}</div>
}
}（六）说说React生命周期
- 好像面试问道React都会问生命周期，之前都被问到过，详情React生命周期详解
（七）React中不管在生命情况下只要调用了Reader方法，界面都会重新渲染吗？
- 答：不一定
- 问：为什么呢？
- 答：。。。。（当时没想到为啥？但问了呢肯定是有坑的）落落的回答了一点概念；
- 解答：React在调用render方法后只是构建出了虚拟DOM，之后还会经历Diff算法的调和过程，找出最小差异树，然后通过最少的DOM操作将其构建到真实的DOM中；
- 答：（恍悟，原来是问这个意思，赶紧补下）但是在render方法调用后，我们该是没有办法对其进行渲染的阻止的；这些过程只能由React内部控制。
（八）问个简单的CSS基础，说说相对布局和绝对布局
- 恩恩，好好~没有骗人
（九）问下js基础，数组的操作
不会改变原数组的方法：
- concat：拼接两个数组，返回拼接后的数组；
- filter()：接收一个函数作为参数，数组中每个元素执行函数，返回执行该函数时返回true的元素组成的数组。
- map： 返回执行函数后组成的数组；
- reduce：累加器；
- slice() 方法返回一个从开始到结束（不包括结束）选择的数组的一部分浅拷贝到一个新数组对象
- forEach() 方法对数组的每个元素执行一次提供的函数
- join() 方法将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串。
会改变原数组
- pop（）删除尾部元素，返回删除的元素；
- push（）添加尾部元素，返回数组长度；
- shift（）删除头部元素，返回删除的元素；
- unshift()网头部添加元素，返回长度；
- splice（）添加、删除，
（十）你怎么理解同源策略？
- 同源限制主要是为了安全，如果没有同源限制存在浏览器中的cookie等其他数据可以任意读取，不同域下DOM任意操作，Ajax任意请求，这会有很严重的安全隐患；
- 为了保护不同站点和用户的隐私安全，个浏览器便制定了同源策略；
- 所谓同源即要求协议、域名、端口号完全相同；
- 一般解决跨域的方式常用的有JSONP(只支持 GET 请求)、跨域资源共享CORS（服务器端通过设置Access-Control-Allow-Origin来进行的）、服务器端设置代理请求：服务器端不受同源策略限制
（十一）浏览器向服务器发送请求，有哪些请求方式
- 1）GET：获取数据
- （2）POST：提交数据
- （3）HEAD：请求头信息
- （4）PUT：上传文档到服务器
- （5）DELETE：删除远程服务器上的某个文档
- （6）OPTION
（十二）你说你常用get、和post请求，说说区别
- 发送的请求数不一样，get发送一个TCP数据包，post两个；
- get向服务器请求数据，数据放于URL后相对不安全、post发送数据相对更加安全点；
- post数据发送大小大于get；但两种都会有限制（浏览器和服务器都会限制）
（十三）状态码的话说说301和302的区别？
- 一个临时重定向；一个永久重定向
（十三）简单的说说在浏览器中输入一个RUL但显示页面的整个过程？
（十三）问些简单的算法，就说说你所知道的排序算法吧？
- 冒泡排序
- 选择排序
- 插入排序
- 归并排序
- 快速排序
（十四）对于你个数值（十进制）如何最快的知道它在二进制中有多少个1
- 恩恩，直接传化为二进制就知道啦？求解？？？？？
- 给我耐心的讲解了，当时懂了点，现在再多研究下吧
（十五）给你一块正方体蛋糕，中间任意位置挖出一个小正方体，如何切一刀将它切成等分的两半
- 还好不是太难，想想看……………………
整个过程CSS、Js没怎么问，感觉侧重于框架、网络、算法这些；相比之前的面试问题没有很多，就是涉及的比较广，偏向于问实践；然后面试官挺好的，不同的或者不足的都会给指出，给解释
- 说一个礼拜左右给结果，恩恩~不过怎样数据结构偏弱，补补再说！
大概能想起这么多了
- 往期经典JavaScript面试题
