对js的个人理解（2）

js的数组

第一种： var arr = [1,2,3] || var arr = [1,“2”,true]

第二种： 使用内置对象 Array，
var arr = new Array(5); //定义了一个长度为5的数组。 　　　
arr[0] = “1”; arr[1] = 2; arr[2] = true;

第三种： 使用内置对象 Araay， 　　　
var arr = new Array(3,“4”,true);//定义一个数组，其中值为：3，4，true

数组小常识

数组中有一个属性 length： 获得数组的长度。
数组的长度是可变的。
数组可以存放不同类型的值

数组常用的方法

• push
• pop
• unshift
• shift
• splice
• join
• concat
• forEach
• filter
• map
• sort
• some
• every

js的全局变量， 和局部变量

全局变量： 在script标签里面定义的一个变量，这个变量在页面中js部分都可以使用 在方法外部使用， 在方法内部使用，
在另一个scipt标签里使用。 局部变量： 在方法内部定义的一个变量，只能在在方法内部使用。

JS原生常用dom操作方法

查找

getElementByid,
getElementsByTagName,
querySelector,
querySelectorAll

插入

appendChild
insertBefore

删除

removeChild

克隆

cloneNode

设置和获取属性

• setAttribute(“属性名”,”值”)
• getAttibute(“属性名”)

js中的方法

第一种

使用一个关键字 function
　　　　　function 方法名（参数列表）{
　　　　　 方法体;
　　　　　　返回值（视需求，可有可无）;
　　　　}
　　　　　for example:
　　　　　　function add(a ,b,c){
　　　　　　　var sum = a+b+c;
　　　　　　　return sum;
　　　　}
　　 (调用方法名，使用定义的方法)

第二种

匿名方法。
*** var 变量名 = function（参数列表）{
　　　　方法体;
　　　　返回值;
}
如：
　var add = funtion(a,b){
　var sum = a+b;
　return sum;
}
(之后使用变量名调用方法)
**

第三种：动态方法

使用一个js的内置对象 Function var 变量名 = new Function（“参数列表”,“方法体 和 返回值”）;
(注意，参数和方法体之间是逗号) var add = new Function(“a,b”, “var sum=a+b; return
sum”); (之后使用变量名调用函数) 注意，此方式中，可以预先定义好参数列表，和方法体与方法名，在定义方法的时候直接传进来。

js事件委托

什么是事件委托：它还有一个名字叫事件代理，JavaScript高级程序设计上讲：事件委托就是利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。

事件委托原理

事件委托就是基于js的事件流产生的，事件委托是利用事件冒泡，将事件加在父元素或者祖先元素上，触发该事件。

<!-- html页面 -->
<ul id="parent-list">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
</ul>

window.onload = function() {　　
    var oUl = document.getElementById("parent-list");
    oUl.onclick = function(ev) {　　　　
        var ev = ev || window.event;　　　　
        var target = ev.target || ev.srcElement;　　　
        if (target.nodeName.toLowerCase() == 'li') {
            alert(target.innerHTML);　　　　
        }　　
    }
}
// addEventListener() 方法用于向指定元素添加事件句柄。
window.onload = function() {　　
    var oUl = document.getElementById("parent-list");
    oUl.addEventListener('click', function() {
        var ev = ev || window.event;　　　　
        var target = ev.target || ev.srcElement;
        if (target.nodeName.toLowerCase() == 'li') {　
            alert(target.innerHTML);　　　　
        }　
    });
}

事件委托优点

1.减少事件注册，节省内存，例如
在table上代理所有td的click事件.
在ul上代理所有li的click事件.

---

2.简化了dom节点更新时，相应事件的更新
不用在新添加的li上绑定click事件.
当删除某个li时，不用移解绑上面的click事件.