ES6
解构赋值／ 模版字符串 ／ 箭头函数 ／ 模块 ／ 扩展运算符 ／ 函数默认参数 ／ Promise／ assign
this
- 指向函数的调用者
- 没有调用者，普通模式指向window，严格模式指向undefined
- 箭头函数本身没有自己的this，导致内部的this就是外层代码块的this。（所以定义时就确定）
- call,apply,bind(ES5新增)绑定的,this指的是绑定的对象
原型链
构造函数有一个原型对象，原型对象有一个指向构造函数的指针，实例对象有一个指向原型对象的指针。
实现继承：将子类的原型对象等于父类的实例对象。
浏览器工作原理
（解析HTML构建DOM树 && 解析CSS信息生成样式规则） -> 构建渲染树 -> 布局 -> 绘制
- 解析HTML过程中遇到<img>标签请求图片
- 构建渲染树会忽略display:none的元素 ，此时才请求css中的背景图，
⚠️整个过程并不是逐步的，而是解析完一部分内容就构建显示一部分内容。
数组方法
-
shift()
删除并返回数组的第一个元素 -
unshift()
向数组的开头添加一个或更多元素，并返回新的长度。 -
pop():
删除并返回数组的最后一个元素 -
push()
向数组的末尾添加一个或更多元素，并返回新的长度。 -
concat()
连接两个或更多的数组，并返回结果。 -
splice()
删除元素，并向数组添加新元素。 -
reverse()
颠倒数组中元素的顺序。 -
sort()
对数组的元素进行排序 -
slice()
从某个已有的数组返回选定的元素 -
join()
把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。
null和undefined的区别？
- typeof 区别
- null是一个表示"无"的对象，转为数值时为0；undefined是一个表示"无"的原始值，转为数值时为NaN。
- null表示"没有对象"，即该处不应该有值。undefined表示"缺少值"，就是此处应该有一个值，但是还没有定义。
TCP 三次握手
-
客户端发送连接请求SYN报文段；
-
服务器收到客户端的SYN报文段，并将SYN+ACK报文段发送回客户端
-
客户端收到服务器的SYN+ACK报文段，向服务器发送ACK报文段
为什么要三次握手? 为了防止已失效的连接请求报文段突然又传送到了服务端，因而产生错误。
TCP 四次挥手
-
主机1（可以使客户端，也可以是服务器端）向主机2发送一个FIN报文段
-
主机2收到了主机1发送的FIN报文段，向主机1回一个ACK报文段，
-
主机2向主机1发送FIN报文段，请求关闭连接
-
主机1收到主机2发送的FIN报文段，向主机2发送ACK报文段，主机2收到主机1的ACK报文段以后，就关闭连接
react组建生命周期
-
创建期
- construct( getInitState, getDefaultProps)
- componentWillMount
- render
- componentDidMount
-
存在期：
- componentWillReceiveProps
- componentShouldUpdate
- componentWillupdate
- render
- componentDidUpdate
-
销毁期：
- componentWillUnmount
js 内存
执行上下文 －> (变量对象 | 作用域链 | this指向)
变量对象 －> (arguments ｜ function声明 ｜ var声明 )
闭包
闭包就是能够读取其他函数内部变量的函数。通过访问外部变量，一个闭包可以维持（keep alive）这些变量。
跨域
同源策略（协议／域名／端口号）
-
jsonp
动态创建script标签，将（回调函数）函数名通过script的src属性传递给服务器－> 服务器接收到回调函数，将数据同函数一起发送给客户端－> 客户端执行该函数
-
window.name
一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个window.name的 -
postMessage（H5）
它允许程序员跨域在两个窗口/frames间发送数据信息，但不是浏览器跟服务器之间交互，而是在两个客户端之间通信。
cookies, sessionStorage 和 localStorage
cookie数据保存在客户端，session数据保存在服务器端。
- 是否在所有同源窗口中都是共享 (cookies 和 localStorage )
- 大小限制 （ sessionStorage 和 localStorage大 ）
- 是否过期 (cookies在设定时间内一直有效，sessionStorage在浏览器窗口关闭失效，localStorage永久有效)
- 是否自动在请求中携带(cookies)
new 操作符
function Person(){
this.name = "jack"
}
var p = new Person();
// 等价于
var p = newAlias(Person);
function newAlias(constructor){
var obj ={}; //创建一个新对象
obj._proto_ = constructor.prototype; //将新对象的`_proto_`指向构造函数的原型
Person.call(obj); //将this指向这个新对象
this = {} //或者
return obj; // 返回这个新对象
}
浏览器原理
- 渲染引擎
- JS引擎。
一个页面从输入 URL 到页面加载显示完成，这个过程中都发生了什么？
- 查找浏览器缓存
- DNS解析、查找该域名对应的IP地址、重定向（301）、发出第二个GET请求
- 进行HTTP协议会话
- 客户端发送报头(请求报头)
- 服务器回馈报头(响应报头)
- html文档开始下载
- 文档树建立，根据标记请求所需指定MIME类型的文件
- 文件显示
单页面应用的路由实现
- ajax请求替换内容
- Hash值
- h5的history
浏览器缓存｜http缓存
缓存状态码： 304
实现思路：
-
服务端与客户端约定有效时间,未过期则读缓存
-
Expires ／ Cache-Control
Expires规定了缓存失效时间（日期格式）,Cache-Control规定了缓存有效时间（秒单位的时长格式）
-
-
有效时间过期后，check服务端文件是否更新，没有更新则读取缓存
-
Last-Modified/If-Modified-Since
要配合Cache-Control使用，If-Modified-Since的日期会和服务端该文件的最后修改日期对比，如果相同，则从缓存读数据；如果不相同，则返回新文件数据，同时通过响应头更新last-Modified的值（以备下次对比）。
-
ETag/If-None-Match
ETag的值，是一串可以代表该文件唯一的字符串，通过在请求中发送If-None-Match选项，值即为上次请求后响应头的ETag值，该值在服务端和服务端代表该文件唯一的字符串对比（如果服务端该文件改变了，该值就会变），如果相同，则直接读取缓存，如果不相同，下载正确的数据，更新ETag值。
-
http 和 HTTPs 的脚本能相互加载吗
http能加载HTTPs的脚本
HTTPs不能加载http的脚本，会报“不安全”的错误
cookie作用域
- 当前域名或者父域名下的Cookie；
- 当前路径或父路径下的Cookie。
要满足以上两个条件的Cookie才会被提交
网站优化
- CDN加速
实时地根据网络流量和各节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上。 - HTTP缓存
- 静态资源设置多域名
http1.0/1.1 支持同时发多个请求，并发请求多个资源当然比一个一个的请求快，可是在同一个域名下，浏览器并发请求的数量是有限制的（chrome为6个），如果先要突破限制，就只能使用不同域名来请求资源。 - 开启GZip
react通信：
- 父元素到子元素
直接通过props传递。 - 子元素到父元素
子元素通过调用父元素传递过来的函数来修改父元素状态。 - 兄弟元素
上面俩者的结合，子元素通过调用父元素传递过来的函数来修改父元素状态，父元素状态修改之后，另外一个子元素的this.props会发生变化。
客户端／服务端 清除缓存
- 客户端
- meta方法，设置不缓存
<META HTTP-EQUIV="pragma" CONTENT="no-cache"> <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate"> <META HTTP-EQUIV="expires" CONTENT="0"> - ajax请求服务器最新文件，并加上请求头If-Modified-Since和Cache-Control
- 版本号
- meta方法，设置不缓存
webview与H5之间的通信
react setState后发生了什么
- React 会将传入的参数对象与组件当前的状态合并；
- 根据新的状态构建 React 元素树，并且计算出新的树与老树的节点差异；
- 根据差异对界面进行最小化重渲染。
有赞面试总结
- 如何创建私有作用域，及私有变量
- 任务队列 Event Loop
- this.xx在原型链中取值
- 实现继承
网友评论