javascript 學習筆記之物件導向程式設計

2021-08-21 06:45:05 字數 3319 閱讀 4682

物件特殊屬性:資料屬性和訪問器屬性

1)資料屬性:

[configurable]-是否可刪除 [enumerable]-是否可列舉for in [writable]-是否可寫 [value]值

要修改預設屬性必須使用defineproperty(object,key,descriptor)方法

例如:var person =

}object.defineproperty(person,"age",)

console.log(person.age);//28

console.log(delete(person.age));//不可刪 false

console.log(person.age=20);

prson.age = 20;

console.log(person.age)//28,唯讀

定義多個屬性 definepropertys(object,,

name:

});2)訪問器屬性:不包含資料,在讀取時呼叫geter函式,寫入時呼叫seter函式,該屬性必須用defineproperty方法定義

如:object.defineproperty(person,'name',,

set:function()

});person.name = "li";//修改

讀取特性:object.getownpropertydescriptor(object,"property")(..還好不常用);

*重點來了:*

工廠模式:

function person(name,age)

return object;

}var p1 =new person("許濤",32);

建構函式模式:

var person = function(name,age)

}var p1 = new person(name,age);

建構函式模式缺點:物件方法建立太多了影響效能,因為每個物件建立時都new

了乙個方法

原型模式:

var person = function(){};

person.prototype.name = "馬雲";

person.prototype.age = 11;

person.prototype.sayname = function()

簡寫:person.prototype =

}var p1 = new person();

原型模式缺點,每個物件例項屬性一樣

例如:person.prototype.friends =["許濤","馬雲","張三"];

var p2 = new person();

//這裡在p2例項中加了

p2.friends.push("john");

console.log(p1.friends);//["許濤","馬雲","張三","john"]

所以組合使用建構函式模式與原型模式可以有效避免缺點,集二者之長(使用最多):

function person(name,age)

//把方法寫在原型鏈中,所有例項共享

person.prototype =

}var p1 =new person("peter",32);

var p2 = new person("安琪",18);

p2.friends.push("peter");

console.log(p1.friends);//['john','li'];

console.log(p2.friends);//[...'peter'];

還有其他自定義模式都是基於前三種模式進化出來的。。

原型鏈繼承:

function person()

person.prototype.saytype = function()

//子物件

function student()

//繼承

student.prototype =new person();

var xiaoming = new student();

console.log(xiaoming.type);

缺點:屬性共享問題

person.prototype.hairs =["black","green","yellow"];

var stu1 = new student();

var stu2 = new student();

stu2.hairs.push("blue");

console.log(stu1.hairs,stu2.hairs);

//建構函式繼承:

//子物件

function chinese()

var c1 = new chinese();

console.log(c1.type);//man

//組合繼承:(常用)

//這裡新建立乙個people物件作為父物件

function people(name)

people.prototype.sayname = function()

//子物件

function man(name)

man.prototype = new people();

man.prototype.constructor = man;

var man1 = new man();

console.log(man1.name);

console.log(man1.sayname());

//缺點:無論何時都要呼叫兩次父類

//原型式繼承

//這裡定義乙個object方法用作原型繼承返回乙個子例項

function object(superobject);

f.prototype = superobject;

return new f();

}//es5 新增object.create()方法與object()方法一樣

//寄生式繼承 相當於對object進行擴充套件

function clone(o)

return clone;

}//寄生組合式繼承

function iher(subtype,supertype)

//例項

function supertype(name)

supertype.prototype.sayname = function()

//子物件

function subtype(name,age)

//不用兩次呼叫父類了

iher(subtype,supertype);

Javascript 學習筆記

如果在生成的html裡面有事件需要傳遞帶特殊字元的引數,處理如下 singletext 輸入 1.singletext value.escapehtml 為 將html編碼 2.singletext value.escapehtml inspect 為 3.在 jsdebugtext innerht...

javascript學習筆記

視窗操作 1改變視窗的位置 window.location 2視窗的歷史操作 previous 3建立新的視窗 window.open url 視窗名稱 視窗特徵字元 細節 不能換行寫 視窗特徵 width,height,yes,no munubar,status,scrollbars,resiza...

javaScript學習筆記

2018 12 26 標題 var num1 10 var num2 0 var result num1 num2 console.log result infinity 表示超出了js的數值範圍 類似高數里的整數除以無窮小的數,得到無窮大的結果。var num1 a var num2 3 或其它n...