01學習 JS面向對象筆記

一切皆對象

屬性：升高 體重

方法：唱歌 跳舞 打招呼

數據類型：字元串、數字、布爾、數組、對象、Null、Undefined （面試會考）

Null：空 false

Undefined 沒有聲明 false

面向對象 鍵值對

數據類型：字元串 數組 布爾 對象 NAN undefined

---------------------------------

知識點1

創建對象

三種方法

第一種 通過new

關鍵字來創建

var obj = new Object();

obj.name="shaozhu"
obj.age=22
obj.sex=156
obj.shaozhu=function(){

return this.age;
};

第二種(對象字面量 )

2.1簡單字面量 通過隱式

var obj2={};
obj2.name="shaozhu"
obj2.age=22
obj2.sex=156
obj2.shaozhu=function(){

return this.age;
};

2.2嵌套字面量

var obj3 = {
mame:"shaozhu",
age:18,
todo:function(){
console.log(this.name);
}
address:'wh'
}

註意：最後一個不要加逗號

如果key有空格和特殊符號 保留字 那麼value 要加引號。！！！！

---------------------------------

知識點2

函數表達式 和 函數聲明的區別

function add(){} 函數聲明

var addl = function(){} 函數表達式

--函數聲明預載入先 可以在函數前調用函數

--函數表達式 預載入慢，不能在函數前面調用函數

---------------------------------

構造函數

function Shaozhu(age,name){
this.age = age;
this.name = name;
this.todo = function(){
console.log(this.name);
}
}
var s = new Shaozhu(22,"xiaoyi");
s.todo();

註意：首字母大寫

聲明一個構造函數 3

function Person(name,age){
this.name=name;
this.age=age;
this.todo = function(){
return this.name;
}
}

實例化：

var person = new Person("shaozhu",22);

調用：調用的時候 是用 person var 後面的 例如

person.name
person.todo();

構造函數中的this 指的是的實例化的那個對象 不是指的Person

var aa = new Person('shaozhu',22); //aa.age
var bb = new Person('cole',23); //bb.age

優點：同一個方法 可以實例化多個然後去使用 構造函數可以通用！

返回一個對象

function person(name,age){
var obj = new Object();
obj.name = name;
obj.age = age;
return obj;//返回對象
}

var a1 = person('qqq',23);//這種方法就不用new 了 裡面new了

a1.name

'qqq'

上面這個模式稱為 工廠模式

普通模式 就是日常的函數

以後寫插件 公用的 構造器用的特別的多！！

構造函數都要通過new 來調用的

---------------------------------

總結：構造函數與普通函數的區別

1.this 指向

--構造函數的this 指向創建對象的實例上 ！！！

--普通函數 指向調用者

2.調用方式

NEW new

3.命名方式
構造函數首字母大寫!!

----------------------------------------------

通過面向對象來寫功能

註意點 ：jq 選擇器 帶上父元素 權重大 不會出問題 (別人可能也寫了這個類 )

嵌套字面量 好東西！！

獲取瀏覽器的寬高

document.body.clientwidth

document.body.clientwidth

document.body.clientheight

例子：把一個簡單的例子 換成對象字面量

嵌套字面量 好東西！！