2017.11.15笔记

面向对象编程中的 this

1.this在对象中的运用

this 关键字是个非常重要的语法点，在 javascript 编程中如果对 this 不能理解，大部分的编程任务是无法完成的。
this 返回的是一个对象，简单的说就是返回属性或者方法当前所在的对象。
this.property，在这个代码中，this就是指property属性所在的对象

var person = {   name : "Tom",   description: function() {      return "name:" + this.name;   }};console.log(person.description()); // name:Tom

上面代码中，this.name表示 descriptioin 方法所在的对象的name属性。调用person.description（）方法时，descriptioin 方法所有在当前对象是 person，所有就是调用person.name。

var f = function() {   console.log("name:" + this.name);}var p1 = {    name : "Tom",   desc : f};var p2 = {    name : "Jack",    desc : f};p1.desc(); // name:Tomp2.desc(); // name:Jack

在上面的代码中，f函数中使用了this关键字，随着f所在的对象不同，this的指向也不同。

2.this在网页编程中的运用

<input type="button" value="删除" onclick="delLine(this)" />function delLine(obj){    var trNode = obj.parentNode.parentNode;    trNode.parentNode.removeChild(trNode);}

3.this在函数中的运用

列子1

this 的指向在函数定义的时候是确定不了的，只有函数执行的时候才能去确定this到底指向谁，实际上this最终指向的是调用它的对象。

function a(){var user = 'javascript';lg(this.user);//undifinedlg(this);//Window}a();        //window.a();

alert 实际上也是window的对象。

列子2

var o = {user:'javascript',fn:function(){lg(this.user);lg(this);}}o.fn();        window.o.fn();

wondow是JS中的全局对象，我们创建变量实际上是给window对象添加属性。

列子3

var o = {a:10,b:{a:12,fn:function(){lg(this.a);lg(this);}}}// window.o.b.fn();var j = o.b.fn;j();

最终是window调用的fn方法。

Web Storage

Storage接口用于在浏览器客户端中存储用户自定义的信息。
有几种存储形式：
LocalStorage：永久的存储在浏览器中，但是要注意，在不同的浏览器中间数据是不能共享的。
SessionStorage：当前页面会话基本的存储，当浏览器关闭或页面关闭时，数据就会丢失。
GlobalStorage:HTML5中被localStorage代替。

1.LocalStorage接口的方法

localStorage.setItem(key,value)：用于将key-value键值对的方式插入localStorage中。
localStorage.getItem(key)：读取key的localStorage字符串值。
localStorage.removeItem(key)：删除localStorage中key。
localStorage.clear()：清空localStorage所有key。
需要注意的是：在localStorage中只能存储字符串类型的数据。
key():在指定的数字位置获取该位置的名字。

//使用方法来存储数据localStorage.setItem('name','Bizzbee');//用属性设值localStorage.username = "bizzbee";console.log(localStorage);console.log(localStorage.getItem('username'));console.log(localStorage.name);