-
函數的創建方式:
① 函數聲明
② 函數表達式
③ 使用Function類型的構造器創建
代碼示例
//01 函數聲明
function functionName() {
console.log('以函數聲明的方式來定義函數');
}
functionName();
//02 函數表達式
var func = function () {
console.log('函數表達式的方式來定義函數');
};
func();
//03 使用Function構造器來創建
var funcName = new Function();
funcName();
//上面的代碼等價于
/*
function funcName() {
}
*/
關鍵字new的使用
可以使用new關鍵字來創建新的對象
———————————————————————————————————————
-
可以使用new關鍵字來創建新的對象
-
01 面向過程和面向對象編程
1 面向對象編程和面向過程編程是一種編程思想,和具體的語言關系不大。
02 面向過程編程和面向對象編程的主要區別
面向過程編程:
關注點在于解決問題需要的每一個詳細的步驟
示例:
自己洗衣服的過程
① 收集需要洗的臟衣服
② 準備洗衣粉、洗衣液等
③ 把衣服放到一個盆里
④ 接水
⑤ 把洗衣粉放到盆里
⑥ 摩擦,摩擦,不斷的摩擦
⑦ 把洗好的衣服用清水沖洗干凈
⑧ 盡量把把洗好的衣服的水分擰干
⑨ 晾曬
面向對象編程:
關注點在于解決問題需要的對象身上
示例:
使用洗衣機洗衣服的過程
① 收集需要洗的臟衣服
② 找到合適的洗衣機
③ 設定洗衣服和烘干的程序
03 面向過程和面向對象他們的區別就類似于自己洗衣服和使用洗衣機洗衣服|自己做飯吃和去餐館吃飯
-
面向對象編程的相關概念
- 01 對象
- 什么是對象? 所有的一切都是對象,在開發中有一項重要的工作就是對象的劃分
一般來說,我們所指的對象是某個具體的事物,而非泛泛的類別
- 什么是對象? 所有的一切都是對象,在開發中有一項重要的工作就是對象的劃分
- 02 對象的特征(靜態描述信息)
- 所謂特征就是一些特定的描述信息
如:學生(性別、年齡、班級、專業、籍貫、家庭住址)
如:汽車(顏色、車牌、品牌、價格等)
- 所謂特征就是一些特定的描述信息
- 03 對象的行為(動態特性)
- 如:人(吃飯、睡覺、玩游戲、奔跑、運動等)
如:狗(吃、睡、咬人、叫、流口水)
- 如:人(吃飯、睡覺、玩游戲、奔跑、運動等)
- 04 js中的對象
- 鍵-值對(key-value)的集合。
- 05 現實生活中的對象和js對象的對應關系
- 靜態的描述信息 - js對象中的屬性(屬性就是定義在對象內部的變量)
動態的行為特征 - js對象中的方法(方法就是定義在對象內部的函數)
- 靜態的描述信息 - js對象中的屬性(屬性就是定義在對象內部的變量)
- 01 對象
** 06 代碼示例:**
var zhangsan = {
name:"張三",
sex:"男",
age:18,
address:"天上人間1號公館",
eat:function () {
console.log('能吃');
},
sleep:function () {
console.log("能睡");
},
say:function () {
console.log("能說話");
},
run:function () {
console.log("能運動");
},
song:function () {
console.log("能唱歌");
}
};
//打印對象的屬性并調用相關的方法
console.log(zhangsan.name,zhangsan.age,zhangsan.address);
zhangsan.say();
zhangsan.sleep();
```
_______________________________________________________________________
**為什么要使用面向對象編程?**
` *面向對象編程的優點: 更方便 + 提高代碼的復用性*`
##### 典型的面向過程
```
<script>
//01 創建標簽
var div = document.createElement("div");
//02 設置樣式
div.style.width = "200px";
div.style.height = "50px";
div.style.backgroundColor = "red";
//03 添加到頁面上
document.body.appendChild(div);
</script>
```
##### 面向對象的代碼
```
<script>
// $("body").append("<div>sdshdfskfsk</div>")
$("body").append("<div style='height: 200px;width: 100px;border: 2px solid #2aa198'></div>");
</script>
```
**總結:面向對象編程其實是對面向過程的封裝**