JavaScript相关记录

  1. construtor和super;this.functionName = this.functionName.bind(this)
    contrutor(props)和super(props)一般是要么不出现,要么同时出现,意义实际上就是继承,前者就是一个一般意义的构造函数,相当于es5里面的
    function FucntionName(props){
    this.props = props;
    }
    super (props)则是继承父类的属性。

2.state称为状态渲染机,

3.react+redux的主体流程:
(1)通过action获得model(数据),并将其作为state存储到store
(2)传递给react component,按照莫中设计呈现model数据,
(3)调用action发起update请求,从而调用reducer生成新的state存储到store中
(4)redux 通知react component重新render


























4.websocket与http
websocket是HTML5出的协议,是一个持久化的协议,相对于http这种非持久的协议来说。
http的生命周期通过request来界定,也就是一个request一个response,这次请求就结束了。
websocket是基于http协议的,或者说借用了http的协议来完成一部分握手。
典型的websocket握手:
GEt /chat HTTP/1.1
Host: server.example.com
Upgrade: websocket /告诉服务器,我发起的是websocket协议/
Connetion: Upgrade
Sec-Websocket-Key: x3JJHMbDL1EzLkh9GBhXDw== /至是浏览器随机生成的,告诉服务器,验证是否是websocket/
Sec-Websocket-Protocol: chat, superchat /用户自定义的字符串,/
Sec-Websocket-Version: 13
Origin: http://example.com

然后服务器返回下列,表示已经接受到请求,成功建立websocket
HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade /告诉客户,已经成功切换协议啦/
Sec-Websocket-Accpet: HSmrc0sMlYUkAGmm5OPpG2HaGWk= /服务器/
Sec-Websocket-Protocol: chat

websocket的出现服务器端可以主动推送信息给客户端(彼此相互推送信息)。解决了要反复解析HTTP协议。
websocket API使用:
//创建一个socket实例
var socket = new Websocket('ws://localhost:8080');
//打开socket
socket.onopen = function(event){
//发送一个初始化消息
socket.send('I am the client and I'm listening!);
//监听消息
socket.onmessage = function(event){
console.log('client received a message', event);
}
//监听socket的关闭
socket.onclose = function(event) {
console.log('client notified socket has closed', event);
}
//关闭socket
socket.close();

}

5.单页面应用
单页面应用利用js实现了页面的动态化,用户使用时基本感知不到网页是如何实现的,
react-router,让你的单页面应用支持页面的跳转以及动态渲染

function convert(source){
var tmp = {}, parent, n;
for(n in source){
var item = source[n];
if(item.ID == item.ParentID){
parent = item.ID;
}
if(!tmp[item.ID]){
tmp[item.ID] = {};
}
tmp[item.ID].Name = item.Name;
tmp[item.ID].ID = item.ID;
if(!('children' in tmp[item.ID])) {
tmp[item.ID].children = [];
}
if(item.ID!=item.ParentID){
if(tmp[item.ParentID]){
tmp[item.ParentID].children.push(tmp[item.ID]);
}
else {
tmp[item.ParentID] = {children:[tmp[item.ID]]};
}
}
}
return tmp[parent];
}

6.数组的方法
(1)splice()用于插入,删除或替换数组的元素
(2)for,map,forEach的区别?
传递给map()的函数应该有返回值,返回的是新数组;

7.http?
(1)method:
get 请求获取request-URL所标识的资源
post 在request-URL所标识的资源后附加新的数据, 常用表单提交
head
put
delete
options
(2)状态码
1XX:指示信息--表示请求已接收,继续处理
2XX:成功--表示请求已被接收、理解、接受
3XX:重定向--要完成请求必须进行更一步的操作
4XX:客户端错误--请求有语法错误或者请求无法实现
5XX:服务器端错误--服务器未能实现合法的请求

8.正向代理?反向代理?

9.jquery的ajax
$(document).ready(function){
$('#b01').click(function(){
htmlobj = $.ajax({url: 'jquery/test1.txt',async:false});
$('#myDiv').html(htmlobj.responseText);
})
}

10.http的header里面包含哪些字段,每个字段都有哪些含义?

content-type,host,origin,referer,user-Agent,accept,
Accept-Encoding指定浏览器可以支持的web服务器返回内容压缩编码类型。
Accept-Language,connection,

11.JSONP请求?
function getJSONP(url, callback){
var cbnum = 'cb' + getJSONP.counter++;
var cbname = 'getJSONP.' + cbnum;

if (url.indexOf('?') === -1){
    url += '?=jsonp' + cbname;
}
else {
    url += '&jsonp' + cbname;
}
var script = document.createElement('script');
getJSONP[cbnum] = function(response){
    try{
        callback(response);
    }
    finally{
        delete.getJSONP[cbname];
        script.parentNode.removeChild(script);
    }
}
script.src = url;
document.body.appendChild(script);

}
getJSONP.counter = 0;
描述:
(1)将回调函数名添加到URL查询部分,
(2)创建script标签;
(3)定义将被脚本执行的回调函数,
(4)触发http请求;设置脚本的URL到src中,把该标签添加到文档中

你可能感兴趣的:(JavaScript相关记录)