1.this永远指向函数对象的所有者
2.ECMA-262 把对象（object）定义为“属性的无序集合，每个属性存放一个原始值、对象或函数”。严格来说，这意味着对象是无特定顺序的值的数组。
3.prototype只有函数对象才会有的属性。
4.对象创建之后为其附加的属性不会被继承。
5.new 创建对象只能来自于函数对象。
5.1也可以直接创建对象实例
6.for in可遍历对象属性
7.obj.prototype.constructor会输出obj创建时用的函数的文本。
8.极度延迟
9.getprototypeof、 instanceof、 typeof
10.可以复制一个函数对象function fun(){};var prune=fun;
11.eval就是一个宏。完全可以这么理解
12.$()[index]可以得到dom对象，内部实现在json对象里有提到。
13.var isIE = /MSIE/.test(ver); var isFF = /Firefox/.test(ver); //“/MSIE/”得到一个正则表达式对象，然后调用它的test方法
14.只能在输出流中使用document.write()方法，如果整个文档已经输出完毕，那么这时调用document.write()时会覆盖整个文档
<html>
<script>
document.write("abcd");
</script>
<p>aaaa</p>
<script>
document.write("<br/>abcd");
function clickme()
{
document.write("assda");
}
</script>
<input type="button" value="adljs" onclick="clickme()"/>
</html>
输出结果为
abcd
aaaa
abcd
点击按钮后变为assda
15.用name还是id，原先是只能用name来标记一个锚，现在可以用id了，可以把id看成是name的升级版，比如
<a href="#chapter1">第一章</a>
<p>asldjfalsdj</p>
<p>asldjfalsdj</p>
<p>asldjfalsdj</p>
<p>asldjfalsdj</p>
<p>asldjfalsdj</p>
<p>asldjfalsdj</p>
<p id="chapter1">asldjfalsdj</p>
<!--<p name="chapter1">asldjfalsdj</p>等价于上一行-->
16.<link rel="stylesheet" type="text/css" href="style.css"/> 其中href=hypertext reference rel=relationship
Math.max.apply(null,arr)因为max函数可以接收任意多个参数，并找出其中的最大值，一个个写这些参数显然是不合适的，这时传一个数组进去就解决了
function callme(name,age)
{
this.name=name;
this.age=age;
}
var p={name:"sdsd",age:};
callme.apply(p,["sd",]);//或者callme.call(p,"sd",23)
alert(p.name);//输出为sd
18.bind http://msdn.microsoft.com/zh-cn/library/ff841995(v=vs.94).aspx
语法：function.bind(thisArg[,arg1[,arg2[,argN]]])
//In the following example, the thisArg object is different from the object that contains the original method.
//JavaScript
// Create an object that contains the original function.
var originalObject = {
minimum: ,
maximum: ,
checkNumericRange: function (value) {
if (typeof value !== 'number')
return false;
else
return value >= this.minimum && value <= this.maximum;
}
} // Check whether 10 is in the numeric range.
var result = originalObject.checkNumericRange();
document.write(result + " ");
// Output: false // The range object supplies the range for the bound function.
var range = { minimum: , maximum: }; // Create a new version of the checkNumericRange function that uses range.
var boundObjectWithRange = originalObject.checkNumericRange.bind(range); // Check whether 10 is in the numeric range.
var result = boundObjectWithRange();
document.write(result);
// Output: true
//The following code shows how to use the arg1[,arg2[,argN]]] arguments. The bound function uses the parameters specified in the bind method as the first and second parameters. Any parameters specified when the bound funct//ion is called are used as the third, fourth (and so on) parameters.
//JavaScript
// Define the original function with four parameters.
var displayArgs = function (val1, val2, val3, val4) {
document.write(val1 + " " + val2 + " " + val3 + " " + val4);
} var emptyObject = {}; // Create a new function that uses the 12 and "a" parameters
// as the first and second parameters.
var displayArgs2 = displayArgs.bind(emptyObject, , "a"); // Call the new function. The "b" and "c" parameters are used
// as the third and fourth parameters.
displayArgs2("b", "c");
// Output: 12
综上 apply和call是直接调用函数本身，只是函数中this的含义发生了变化，而bind只是将两个对象先行捆绑，调用是发生在这之后。
function getViewPort1(){
return [
document.body.clientWidth,
document.body.clientHeight
];
}
以上述方式返回值时，可以通过元素索引编号来获取返回值，代码如下：
var ret = getViewPort();
var width = ret[0];
var height = ret[1];
第二种：以键值对形式返回多个值
函数定义如下：
function getViewPort(){
return {
width: document.body.clientWidth,
height: document.body.clientHeight
};
}
以上述方式返回值时，可以通过键来获取相应的值，代码如下：
var ret = getViewPort();
var width = ret["width"];
var height = ret["height"];
或：
var ret = getViewPort();
var width = ret.width;
var height = ret.height;
21.appendChild 和cloneNode appenChild并不增加新的元素，只是将元素从原先的位置移除，然后放置到新的位置，cloneNode会生成新的元素以备添加到新的位置。
22.onclick=function(e){}可以处理系统提供的事件，另外onclick只是对应函数的引用，因此不能带有参数。
23.window.event的应用
<script type="text/javascript">
function noNumbers(e)
{
var keynum
var keychar
var numcheck if(window.event) // IE
{
keynum = e.keyCode
}
else if(e.which) // Netscape/Firefox/Opera
{
keynum = e.which
}
keychar = String.fromCharCode(keynum)
numcheck = /\d/
return !numcheck.test(keychar)
}
</script> <form>
Type some text (numbers not allowed):
<input type="text" onkeypress="return noNumbers(event)" />
</form>
24.cookie的设置和提取
<script>
function ckset(name,vlaue,exp)
{
var dt=new Date();
exdate.setDate(exdate.getDate()+exp);
if(name!=null)
{
document.cookie=name+"="+escape(value)+((exp==null)?"":";expires="+dt.toGMTString());
}
}
function ckget(name)
{
if(document.cookie.length>0)
{
stt=document.cookie.indexOf(name+"=");
if(stt!=-1)
{
stt+=(name.length+1);
end=document.cookie.indexOf(";",stt);
if(end==-1)return document.cookie.subString(stt,end);
return unescape(document.cookie.subString(stt,end));
}
}
else return "";
}
</script>
注意两点，一是写入的时候可以附加 expires 和path两个属性，二是读取的时候仅能读到name和value两个属性，先前设置的expires属性不可见
http://www.w3schools.com/js/js_cookies.asp cookie使用参考
25.ajax get和post
/*一个普通的get请求*/
var ajx=new XMLHttpRequest();
ajx.onreadystatechange=function()
{
if(ajx.readyState==4 && ajx.status==200)
{
document.getElementById("mydiv").innerHTML=ajx.responseText;
}
}
ajx.open("GET","test.txt",true);
ajx.send();
/*一个设置请求头的post请求,以完成类似于get的ulr数据传递形式*/
ajx.open("POST","test.asp",true);
ajx.setRequestHeader("Content-type","application/x-www-form-urlencoded");
ajx.send("fstname=jack&lastname=peter");
jquery ajax包括三个主要的函数
a)$(selector).load(url,data,callbackfn)这里的data字符串和 上面的字符串有所不同它实际上是一个json对象，e.g. {}
其中callback function包括三个可选参数(responseTxt,statusTxt,xhr/*xmlhttprequest对象*/)
b)$.get(URL,callback);//需要发送的参数包含在URL中，callback的参数同上
c)$.post(URL,data,callback);data依然要求是值对的形式，callback参数同上
完整的ajax reference http://www.w3schools.com/jquery/jquery_ref_ajax.asp
26.表单上传文件
<form method="POST" action="test.php" name="form" enctype="multipart/form-data">
<input type="file" name="upfile"/>
<input type="submit" value="上传" name="submit"/>
</form>
27.div的mouseover和mouseleave事件，不只对父元素本身有效，对其子元素同样有效。
28.function aa(){} var b=aa.prototype;这会复制aa所有的属性，和属性的值，但不会复制aa的函数体。
29.jquery对象转dom对象$("#id")[0]即是DOM对象
30.DOM元素的tagName属性用来获取标签名。
31.一个id映射到两个元素的方法
var IDs={};
var newElement=document.createElement("div");
var newDiv=document.createElement("div");
newDiv.count=-1;
newDiv.id="root"+"-"+parseInt(++this.parent.count);
IDs[newDiv.id]=newElement;
32.jquery遍历所有子元素 children()得到所有直接后代元素，用selector.find("*")得到所有子代元素。
33.操作iframe document.getElementById("frame1").contentDocument,window.frames[0].contentWindow获取frame元素中的dom对象
34.关闭当前窗口 if(confirm("要关闭吗？")window.close();
35.阻止事件冒泡preventDefault()阻止后续的事件相关的动作，如本来要提交表单，或者打开连接，执行该函数之后，这些动作都不会得到执行，stopPropagation()则是阻止事件继续派发，应该响应事件的元素，在这之后都不会收到该事件了。或者是在处理程序中直接return false，相当于同时执行上述两个函数。
36.提交表单<input type="submit" value="提交"/>(这样是一个提交按钮，点击后会提交表单），JS提交的办法document.getElementById("myForm").submit();或者$('myForm').path()//设置提交的地址，$('myForm').submit()//提交表单
37.<pre>标识，会保留文档的原有格式，比如换行回车等，通常用来显示程序代码 pre=preserve
38.var a=new Array("a","b","c");str=a.join("");将字符串所有元素都连接起来。alert(str)输出
39.阻止右键菜单弹出
window.onload=function(){document.getElementsByTagName("div")[0].oncontextmenu=clk;}
function clk(e)
{
return false;
}
40.获取元素属性document.getElementById("xx").getAttribute("title");注意一些元素的value属性并不能通过这方法获取，而应该是document.getElementById("xx").value;
jquery 的简化写法 $("selector").attr("title"); $("selector").removeAttr("title"); DOM的写法removeAttribute;
41.设置页面x秒后自动跳转，<meta http-equiv="refresh" content="3,http://www.baidu.com/">
其它跳转代码
js:window.location.href="http://www.baidu.com"
window.reload();
document.history.back();
42.获得焦点和失去焦点
onfocus="some javascirpt" onblur="some javascript"
element.attachEvent("onclick",function(){alert(1);}
if(window.addEventListener){ // Mozilla, Netscape, Firefox
td_value.addEventListener('click', alert('cc'), false);
td_value.addEventListener('click', alert('cc'), false);
43.如果一个标签不在某个form标签内，则可以设置他的form属性来使它关联这个form,进而使自身内容也可以被随之提交e.g. <form action='xxxx.php' id="cartform"><div>some html code</div><select name="carlist" form="carform"></select>
44.jquery几种语法$(function a(){})等价于$(document).ready(function()a{});jquery创建节点$(<div></div>).text("some text");直接修改cssText $("selector").css("cssText", "width:100%");
alert('jQuery.prop()获取outerHTML');
alert($('textarea').prop('outerHTML'));
// 成功设置，已生效
alert('jQuery.prop()设置outerHTML');
$('textarea').prop('outerHTML', '<input>');
45.javascript中的续行符和C一样都是一个反斜杠，并且续行符前的空格为有效空格（尤其对字符串而言），其后紧跟回车
46.根据窗口调整div尺寸
var mydiv_resize=function(){
mydiv.style.width=document.body.clientWidth;
mydiv.style.height=document.body.clientHeight;
}
mydiv_resize();
window.onresize=mydiv_resize;
47.JSON.stringify函数将json对象转换成字符串
48.给div设置value属性，就可以随表单一起提交
49.role属性是干什么用的
50.JSON.stringify将数组或json对象转化成json字符串，相当于JSON.parse的逆操作
51.设置一个表单的名称为name[]时，在读取$_POST数列时，相应的表单域被转化成数组。
52.用innerhtml的方式和createelement的方式来添加元素的结果是不一样的。
53.可以用javascript配合输出 比如本来从数据库中传过来的是一个数字，这时候可以用js来将数字转化成相应的具有实际语意的字符串,e.g.<td><script>document.write(list[<?php echo {$item['id']} ?>])</script></td>
这里的document.write并不会造成重写整个文档，只是在适当的位置输出。
54.$.getJSON 和 $.load()可以直接加载文件
55.array.map(callbackfunc)对每一个数组元素应用回调函数 ,参数即为单个的数组元素
56.js中in的用法
一是遍历对象属性for(p in obj)....而是判断if(name in obj)....
57.一种配置的方法var conf={abc:"asdlj:23,asd:883,sdjjk:3889"}首先用split以逗号将字符串分割,再以冒号切分，得到最终属性值.
58.pageX,pageY是相对于当前网页的位置,是作为event的一个属性
59.toggle，slideToggle,animate show(500)这些都可以实现一些简单的动画效果
60.element.className获取类名
61.jQuery.prop("outerHTML");以及DOM自带的outerHTML可以获取到元素的标签名和内容
62.history.pushstate可以实现无刷新，或者pjax
63.form实现无刷新上传.利用form的target属性指向一个 隐藏的iframe这样就使得form提交后，返回的页面提交给了iframe
64.document.location.pathName获取当前页面的地址名称
65.$.one(event,data,callbackfn)当事件发生时只运行一次绑定的函数,这函数由callbackfn指定
66.DOM属性document.documentElement.style元素的属性
67.elem.style.cssText用来设置元素的css样式
68.javascript的取反运算符不能对变量使用，但是在需要的情形下，比如布尔值的转换可以通过 !运算符来完成
69.前一段时间写一个匹配css引用的文件，还为匹配的文本纠结了一阵，现在了解到原来分组是可以匹配但不被加入到匹配结果中的,(?:exp)就是这样一个用法
70.
<script>
$(document).ready(function(){
$("p").each(function(i){
$(this).on("click",{x:i},function(event){
alert("The " + $(this).index() + ". paragraph has data: " + event.data.x);
});
});
});
</script>
注意两点，一是注册事件时可以向回调函数传递数据，二是each函数向回调函数传递一个index参数，有点和$.each类似
71.$('elem').index()返回元素的索引值
72.medea query的用法
@media screen and (max-width: 300px) {
body {
font-family: Consolas, 'courier new'; line-height: normal;"> lightblue;
}
}
73.解决jquery绑定多个事件的问题，先 调用unbind解绑，再行绑定。
74.函数的嵌套定义，当深层的函数调用到更高层的函数的变量的时候,就实现了函数内部的变量的内存常驻。
75.jquery one函数不是说只绑定一个事件，绑定后这个事件函数只执行一次，jquery on函数可以用来绑定未来添加的函数。
76.call(this)实现继承
function a(){this.name="jack"}
function b(){a.call(this);}
var person=new b();
77.用两个toggle实现两个类之间的切换
$('#div').toggleClass('cls1');
$('#div').toggleClass('cls2');
78.判断是否隐藏$('#ele').is(':hidden');
79.查找父元素$('div').parents('selector');
80.$.each函数只会遍历数字索引，而且他是取最大的一个数字索引作为遍历元素的个数，如果为定义也会取到,arr.length会以最大数字索引值加1返回，但是非数字索引却不会被计入length
81.window.onhashchange有这样一个事件。
82.window.location.hash获取当前url中的hash
83.精确到小数点后几位,number.toFixed(2)
84.Math.random()生成0-1之间的小数，不包括0，1本身
85.function (value){return "星期" + "日一二三四五六".charAt(value);'漂亮的用法
86.id和name属性可以用数字
87.浏览器弹出新窗口，并传递内容
var newwnd=window.open("","title","location=no,scrollbar=no,status=no,menubar=no,directories=no,toolbar=no,location=no,height=500,width=500");
newwnd.document.write("hello world");
也可以newwnd.onload=function(){newwnd.document.title='childWindowTitle';}
88.两种新的js编程范式
1) obj.command("viewsource",this);
这样的话可以配置多个命令
2）把要用到的一组元素先行选取出来，并把他们归类，如var submitbtn=$("xxxbtn");
然后再submitbtn.click(function(){});
88.jquery animate 配合jquery easing function 完成一些动画过渡效果
一个弹出框
$("#msg-box").animate({
opacity:"1.0",
height: '500px',
width: '500px',
},
180,
"easeOutBack"
);
89.document.getElementById("#div").scrollTop+=5;可以设置元素的滚动条的位置，即使设置了overflow:hidden这个设置仍然有效
90.$('#div').offset().top$('#div').offset().left用于获取元素实际的位置
91.substring 和 substr的区别 substring 是截取两个index的字符串，substr是从起始位置截取指定长度的字符串。
92.:checked是jquery提供的一个伪类，可以用来选择被选中的checkbox
93.mouseout和mouseleave是不同的，mouseout严格限制于的鼠标离去事件，mouseleave同时作用于目标元素的子元素
94.总算是碰到了一个对象拷贝的问题obj={"sdsd":"asdsd"};var obj2=obj;这个地方obj2并不是新建立了一个对象，而是对obj的一个引用，类似于指针，所以当delete obj.sdsd的时候，再调用obj.sdsd同样会遭遇无效的属性。
95.window.history.pushState(null,null,"asdsdds"),往增加一条历史记录，但页面保持不变，history.replaceState取代当前页面的历史记录为一条指定的历史记录
onpopstate监听后退事件
96.window.location对象使你可以操作url，你可以设置和读取一些有用的信息从URL中，如果你想通过URL传递一些信息的话，window.location.reload location.replace location.assign location.href都可以更改当前的文档为其他新的指定的文档
97.jquery获取 iframe元素 $('#ifrmid').contents().find("ifrmelem").html();
98.javascript or php 的短路写法 var1=p1 || "";
99.可以用一个图片占位，然后再判断鼠标滚动事件，当鼠标滚动到相应元素的时候再进行图片加载
100.注意jquery循环的时候不要用e[0],这种形式，这样就成了一个普通dom对象了，无法进行jquey的相关操作了，应该用e.eq(i);这种形式
101.$('#div1').appendTo('body');的时候并不是复制一个元素追加到body下面而是将元素移动到相应的节点下面.
102.$('#div').index()可以取到当前元素在其父元素中的序号。
103.注意一个坑 for(x in obj){obj[x]}应该用obj[x]这种方式来获取属性，否则x 会被视作obj的一个名为'x'的属性。
104.有时候需要传递this指针，于是又这种用法，that=this, function (that){this.asdfasdf;that.sdkfsdfsd;}这是防止弄混不同的this指针
105.
var myid= jQuery("#awesome").data('myid'); console.log(myid);
你还可以在"data-*" 属性里使用json语法，例如，如果你写出下面的html：
复制代码
代码如下:
<div id="awesome-json" data-awesome='{"game":"on"}'></div>
106. $.inArray并不是返回一个bool值，而是返回被查找项在数组中的index，没找到返回-1
107.
//json树转换成DOM树
function jsonToMenu(data){
var html="";
html+="<ul class='ul-level-"+data['level']+"'>";
if(data['isleaf']){
html+="<li data-id='"+data['id']+"'>"+data['name']+"</li>";
}else{
html+="<li class='li-has-children' data-id='"+data['id']+"'>"+data['name'];
for(var x in data['children_arr']){
html+=jsonToMenu(data['children_arr'][x]);
}
html+="</li>";
}
html+="</ul>";
return html;
}
108.jquery插件的一般形式
(function ($) {
function Slider(option) {
//深拷贝，修改每个对象的属性只能通过对象实例，避免初始化时候外部引用对象的影响
this.opt = $.extend(true, {}, option);
}
$.fn.slider = function (option) {
var defaults = { //默认设置
// 独立写出来，也许将来就用得到呢,也说不定...
};
//最终配置
var opt = $.extend({}, defaults, option);
//jQuery对象是一个伪数组对象，可能有多个元素
return $.each(this, function (index, ele) {
// code...
var slider = new Slider(opt);
$(ele).data("slider", slider);
});
};
})(jQuery);var str=$v.replace(/array/g,"");
str=str.replace(/\(/g,"{");
str=str.replace(/\)/g,"}");
str=str.replace(/=>/g,":");
eval("var abc="+str);
return abc;
}
合并到jquery的实例对象$.fn.extend({name:123}) $("#div").name //123
testfn.noConflict = function(){
window.testfn = old;
}
这里返回的this 表示的是函数本身
$(document)
.on('click.bs.dropdown.data-api', clearMenus)
.on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })//虽然这个事件后于上一个事件绑定，但是他会先被触发，而且会阻止事件冒泡
.on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle)//这里需要特别注意绑定的事件执行的顺序，这个事件仍然是先于第一个事件执行
.on('keydown.bs.dropdown.data-api', toggle, Dropdown.prototype.keydown)
.on('keydown.bs.dropdown.data-api', '.dropdown-menu', Dropdown.prototype.keydown) 如果是事件回调函数中使用了return false;那么就相当于调用了event.stopPropagation() 和 event.preventDefault();
var people=['Wayou','John','Sherlock'];
//sayHello函数本来接收三个单独的参数人妖，人二和人三
function sayHello(people1,people2,people3){
console.log(`Hello ${people1},${people2},${people3}`);
}
//但是我们将一个数组以拓展参数的形式传递，它能很好地映射到每个单独的参数
sayHello(...people);//输出：Hello Wayou,John,Sherlock
//而在以前，如果需要传递数组当参数，我们需要使用函数的apply方法
sayHello.apply(null,people);//输出：Hello Wayou,John,Sherloc
163. 关于view model state machine 以及 stream的一些设计
首先是流，整个页面可以看成是一个main函数，他是事件驱动的，也可以叫做action, 每一个事件会启动一个stream, stream之后会返回一个函数，这个函数用来更新UI，UI部分负责解析action，同时返回state, state交给react处理最终更新UI状态, 其中state.data是一个函数，这个函数返回一组值，用到react组件的各个部分。
164. props实际上就是一种依赖注入，注入的可以是数据，也可以是event handler
165. ReactDOM.render返回的是component的引用，这是和component内部的this一样的，都是component 这和react.createelement是不一样的
166. export default 和 export的区别，default import的时候不用 加大括号，export的时候需要加，但是export可以使用多次，而且不能是匿名的函数或对象或数组
167. js数组的reduce 函数 [1,2,3].reduce(cbk, 0) reduce可以接收两个参数，第一个是callback, 第二个是作为初始值， cbk要求第一个参数是初始值，第二个参数是数组项, 这样就可以利用reduce遍历数组并且返回单一值
168. 才知道underscore.js是干什么用的， 它其实是对js的扩展，是一个库，只不过他使用"_"来代表这个库，类似于jquery的$，用这个库来扩展了一些map reduce函数
169. 关于验证的 主要是使用skiponempty skiponerror这两个选项
170. html5 js 保存文件到本地
function download(data, filename, type) {
var a = document.createElement("a"),
file = new Blob([data], {type: type});
if (window.navigator.msSaveOrOpenBlob) // IE10+
window.navigator.msSaveOrOpenBlob(file, filename);
else { // Others
var url = URL.createObjectURL(file);
a.href = url;
a.download = filename;
document.body.appendChild(a);
a.click();
setTimeout(function() {
document.body.removeChild(a);
window.URL.revokeObjectURL(url);
}, 0);
}
}
171.https://eligrey.com/demos/FileSaver.js/
172. $.Event可以自定义事件 如果使用$('selector').trigger("test_event") 则事件不会冒泡，如果使用$.event.trigger("test_event")则事件会冒泡
173. 在js中如果不是new或者{} []的写法，那么赋值语句都是传递的都是引用
174.通过阅读d3风格的js代码，发现了两个比较有用的用法，一个是 +obj.value这种可以替代parseInt, 再就是逗号表达式的使用，其实就是类似于使用多个分号的用法，这样可以使代码更简洁一些，本质上就是串联起一串操作