js

1,数组的常用操作

push()方法可向数组的末尾添加一个或者多个元素,并返回新数组的长度,

unshift() 方法可向数组的开头添加一个或更多元素，并返回新数组的长度。

Var arr = [1,2,3]  arr.push(4,5,6);  arr.unshift(-1,0,);

pop() 方法删除数组的最后一个元素，并且返回被删除的元素的值。如果数组已经为空，则 pop() 不改变数组，并返回 undefined 值。 arr.pop(); shift() 方法用于把数组的第一个元素删除，并返回被删除的元素的值。如果数组是空的，那么 shift() 方法不进行任何操作，返回 undefined 值。 concat() 连接数组，组成新数组   arr.concat(4,5,6);    创建新数组 该方法用于在一个数组后连接另一个或多个数组。它不会改变现有的数组，返回的是连接后的新数组。 concat(）方法可以接受值，也可以接受数组作为参数。 Var array1=[] ;  var array2,arry3 array1.concat(array2,array3,...); Number(); 把对象的值转换为数值

join()  将数组各个元素是通过指定的分隔符进行连接成为一个字符串。arr.join(“-”);  “1-2-3” split() 方法用于把一个字符串分割成字符串数组，必需指定要使用的分隔符。 如果分隔符为空字符串 (“”) ，string中的每个字符都会被分割 var str = “hello-world” str.split(“-” );     可指定howmany参数，该参数为数值，指定返回的数组的最大长度。 sort()  对数组进行排序，返回排序后的数组对象。可接受参数，必须是函数。 Var arr = [“b”,”a”,”d”] arr.sort(mysort);      function mysort(a, b){return  a-b} splice() 用于插入、删除或替换数组的元素。  首先，必须指定index，即从何处插入/删除元素。该参数为数值，为元素的下标。 其次，必须指定要删除的元素的个数，可以是0。如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。 如果要插入元素，可将新元素作为参数写在括号内，新元素之间用 , 隔开。 arr= [1,2,3,4] arr.splice(2,2,”5”,”6”)

2.DOM节点的操作

<div id=“div1”>    Var mydiv = document.getElementById(“div1”); 父节点： mydiv.parentNode;    相邻： mydiv.nextSibling;   mydiv.previousSibling 子节点： mydiv.childNodes();     firstChild()  lastChild() document.getElementById doucument.getElementsByName document.getElementsByTagName(“li”) document.getElementsByClassName

createElement(“”)     创建节点：返回一个元素对象 cloneNode(false)           克隆节点，接受一个参数deep，值为true或false。 子节点操作： appendChild()       向节点添加最后一个子节点 mydiv.appendChild(“p”); insertBefore()        在指定的已有子节点之前插入新的子节点。 如果未指定已有子节点，会在结尾插 入 newnode。 removeChild()        移除指定子节点 属性操作： div.getAttribute(“id”) setAttribute(“id”,”mydiv”) removeAttribute(“id”)

3.Data()类型

获取日期和时间  var mydate = new Date(“2016/8/20  00:00：00”); getDate()                     获取日 1-31 getDay ()                     获取星期 0-6       getMonth ()                 获取月  0-11 getFullYear ()             获取完整年份（浏览器都支持） getHours ()              获取小时 0-23 getMinutes ()               获取分钟 0-59 getSeconds ()                获取秒  0-59 getMilliseconds ()             获取当前的毫秒  getTime ()               返回累计毫秒数(从1970/1/1午夜) setInterval()     setTimeout()   

4.string类型

回答下列每个函数的用法： var  str =“hello world” indexOf(“l”); 根据字符返回位置 subStr(0, 2) 第一个参数是截取开始的位置， 第二个参数是截取的长度 subString(0,2) 第一个参数是截取开始的位置，第二个参数是结束位置 charAt (3) 根据位置返回字符 split join 合并字符串   slice 截取字符串   toLowerCase toUpperCase

5.offset与client

offsetWidth    offsetHeight 得到元素对象包括边框在内的宽度和高度 offsetWidth =  width  + border  +  padding    div {  width:220px;  border-left:2px solid red; padding:10px;} div.offsetWidth =  220 + 2 + 20      clientWidth clientHeight 得到元素对象边框以内的宽度和高度，不包括边框 注意：offsetWidth，clientWidth 与 div.style.width 的区别  

offsetLeft  offsetTop     返回对象与上级元素（最近的带有定位的父级元素）左边或上面的距离 如果父级都没有定位则以body 为准 距离从父级元素的外边距开始算。

offsetTop 与 style.top 的区别 一、最大区别在于  offsetLeft 、offsetTop 可以返回没有定位的元素距离左侧的位置。 而 style.left、style.top 不可以。只有定位的元素才有 left  top right   二、offsetTop 返回的是数字，而 style.top 返回的是字符串，除了数字外还带有单位：px。  style.left = 300px        三、offsetTop 只能返回，不能设置，而 style.top 可设置也可返回。 四、如果没有给 HTML 元素指定过 top 样式，则 style.top 返回的是空字符串。 五、style.left、style.top 只能得到行内样式。

6.event 事件属性

我们学过一些事件 :   onmouseover   onmouseout.....作用于元素本身以及其子元素 onmouseenter   onmouseleave 只作用于元素本身 onmousedown   onmouseup  onclick  例：btn.onclick = function(event) {  语句 } event  就是事件的本身。     在触发DOM上的某个事件时，会产生一个事件对象event，这个对象中包含着所有与事件有关的信息。所有浏览器都支持event对象，但支持的方式不同。 比如鼠标操作时候，会添加鼠标位置的相关信息到事件对象中。 普通浏览器支持 event   ie 678 支持 window.event 所以我们 采取兼容性的写法 ：   var event = event || window.event;  

7.scoll事件

onscroll 事件在元素滚动条在滚动时触发   window.onscroll = function() {   } scrollTop 网页被卷去的高度。 谷歌浏览器 和没有声明 DTD  <DOCTYPE> ：     document.body.scrollTop;   火狐 和其他浏览器      document.documentElement.scrollTop;  ie9+  和 最新浏览器    window.pageXOffset;     pageYOffset  （scrollTop）  兼容性写法：   var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;

scrollTo(x,y)   window.scrollTo(15,15);  方法可把内容滚动到指定的坐标。 格式： scrollTo(xpos,ypos) xpos 必需。要在窗口文档显示区左上角显示的文档的 x 坐标。 ypos必需。要在窗口文档显示区左上角显示的文档的 y 坐标 因为我们的网页大部分都没有水平滚动条，所以，这个x 不太常用。

9.冒泡问题

事件冒泡: 当一个元素上的事件被触发的时候，比如说鼠标点击了一个按钮，同样的事件将会在那个元素的所有祖先元素中被触发。这一过程被称为事件冒泡；这个事件从原始元素开始一直冒泡到DOM树的最上层。 顺序 IE 6.0:  div -> body -> html -> document 其他浏览器:  div -> body -> html -> document -> window 不是所有的事件都能冒泡。以下事件不冒泡：blur、focus、load、unload

阻止冒泡的方法  标准浏览器 和  ie浏览器    w3c的方法是event.stopPropagation()         IE则是使用event.cancelBubble = true       bubble   冒泡  泡泡       cancel 取消   兼容的写法：   if(event && event.stopPropagation)         {              event.stopPropagation();  //  w3c 标准         }           else           {               event.cancelBubble = true;  // ie 678  ie浏览器 8   }

9.闭包

用一个函数 去访问 另外一个函数内部定义的局部变量的方式就是闭包。 内部变量是局部变量 局部变量只能在函数作用域的内部使用。 闭包的特点：  优点：不产生全局变量，实现属性私有化。 缺点：闭包中的数据会常驻内存，在不用的时候要删掉否则会导致内存溢出。

function outerFun(){ var a=0; function innerFun(){ a++; alert(a); } return innerFun; } var obj=outerFun(); obj(); 1 obj(); 2 var obj2=outerFun(); obj2(); 1 obj2(); 2结果是:1,2,1,2

10.面向对象

面向对象：通过类可以创建多个具有相同属性和方法的对象。 面向对象有两种，基于类的（class-based）面向对象和 基于原型的 (prototype-based) 面向对象 在基于类的面向对象方式中，对象（object）依靠 类（class）来产生。 而在基于原型的面向对象方式中，对象（object）则是依靠 构造器（constructor）利用 原型（prototype）构造出来的。 ECMAScript中没有类的概念。ECMAScript中的对象是基于原型的面向对象方式。

面向对象的特性   1. 抽象 抽象就是忽略一个主题中与当前目标无关的那些方面，以便更充分地注意与当前目标有关的方面。   2. 封装    封装是把过程和数据包围起来，对数据的访问只能通过已定义的界面   3. 继承   4. 多态 多态是指两个或多个属于不同类的对象，对于同一个消息（方法调用）作出不同响应的方式

new   利用new 关键字 去声明新的对象     new运算符的作用是创建一个对象实例。这个对象可以是用户自定义的，也可以是带构造函数的一些系统自带的对象。 new 关键字可以让 this  指向新的对象  所谓"构造函数"，其实就是一个普通函数，但是内部使用了this变量。对构造函数使用new运算符，就能生成实例，并且this变量会绑定在实例对象上。

Object构造函数或对象字面量都可以创建单个对象，使用同一接口创建对象，会产生大量重复代码。 工厂模式：可创建多个对象，不能解决对象识别问题。 构造函数模式： 原型模式：

prototype    原型属性  主要解决：函数因为使用非常非常多，重复执行效率太低。 Person.prototype.showName = function() {  // 用的共同的父亲     alert("我的名字是"+ this.name); } 写法： 类.prototype.方法  = function() {}  具体格式  可以把那些不变的属性和方法，直接定义在prototype对象上