JavaScript基礎

核心知識點

• 對象
  • 4種創建對象的方式
  • 操作對象（取值，賦值）

今日學習目標

• 能夠使用對象方式保存數據
• 能夠理解自定義構造函數如何創建對象
• 能夠獲取對象中的值及給對象賦值

對象

思考： 如何通過js函數將人的信息輸出？

什么是對象？

?現實世界： 萬事萬物皆對象。?對象： 必須是一個具體的事物。 （手機，汽車不是對象，屬于一類對象）◆ 對象是由 特征（名詞）【屬性】 和 行為（動詞）【方法】?程序中的對象： 對現實對象的抽象? 總結：
1. 程序中的對象：? 對象必須有對應的屬性【描述對象的特點，在程序中一般使用名詞描述】? 對象必須有行為動作方法 【方法用來描述具體對象的行為動作，一般方法使用動詞】

對象字面量創建對象

? 通過字面量方式創建對象var  變量名  =  {  key: value, key: value,  key: functon () {}  };備注：1. 創建對象，必須要確定具體的事物2. 創建對象，必須要確定對象有哪些屬性【特征】或者方法【動作，行為】3. 如果一次想要輸出多個對象，那么可以將每一個對象放到一個數組中。? 訪問對象屬性    （對象.屬性   |  對象['屬性名']）
? 訪問對象方法    （對象.方法名）注意：1、 如果通過  對象['屬性名']訪問對象的屬性時候，必須保證使用字符串格式? 函數：獨立存在的函數? 方法： 屬于對象的函數（匿名函數）

課堂練習

1. 創建一個英雄對象? 姓名? 年齡? 職業? 武器裝備 (weapon)? 愛好? 技能 (移動, 攻擊(attack))

通過Object創建對象

?   var  變量  =  new Object();1. Object 是一個構造函數2. 通過new調用構造函數? 添加屬性：對象變量.屬性名 = 值;? 添加方法：
對象變量.方法名 =  function () {}

工廠方式創建對象

 1. 思考如何創建多個游戲對象？2. 例如：
function  create ( name, age, height ) {
var  Ob = new Object()Ob.name = name;Ob.age = age;Ob.height = height;Ob.eat = function () {}return Ob;
}

自定義構造函數創建對象

? 使用帕斯卡命名法 （每個單詞首字母大寫）? 例如：
function  CreateHero ( name, age, height ) {this.name = name;this.age = age;this.height = height;}? 課堂案例：1. 使用自定義構造函數方式創建3個對象，并添加到數組中 【對象基本的屬性有： name， age, gender】

new 關鍵字執行過程

1. 在內存中創建一個空對象
2. this指向創建的對象
3. 執行函數
4. 返回當前對象注意：1. 在構造函數中，默認的返回值就是當前創建的對象

this關鍵字

1. 普通函數中的this     指向Window
2. 在方法中的this	   指向當前方法所屬的對象
3. 在構造函數的this	  指向創建的對象
總結：構造函數誰調用函數，this就指向誰

遍歷對象刪除對象屬性

? 通過   for   in  遍歷 對象的成員? 遍歷對象中的屬性? 遍歷對象中的值

對象案例

1. 通過構造函數創建3個對象，并將3個對象放到數組中，最后再將數組中每一個對象的信息輸出。
備注：?對象的信息需要從用戶輸入中獲取

檢測對象的數據類型

對象  instanceof  構造函數

對象總結

 1. 程序中的對象： 在程序中對具體事物的抽象2. 對象的基本的組成：  屬性【描述對象特征特點】  |  方法 【描述對象行為動作功能】3. 創建對象方式：? 字面量方式var  obj = {key ： 值,key ： function () {}}? 通過構造函數var  obj = new Object();	obj.自定義屬性名 = 值;obj.自定義方法名 = function () {}? 工廠模式創建對象（本質就是對第二種方式的封裝，創建多個對象）function people (name) {var obj = new Object();obj.自定義屬性名 = name;return obj}var zs = people('zs');? 自定義構造函數創建對象（確定對象的類型）function People (name) {this.自定義屬性名 = name;}var zs  = new People('zs');4. 對象的基本操作? 獲取對象的屬性或方法1.  對象.自定義屬性名  ||  對象['屬性名']2.  對象.自定義方法名()5. 判斷對象的具體類型對象名稱  instanceOf  構造函數

其他擴展部分

簡單數據類型在內存中的存儲

  ? 簡單數據類型（值類型） 存儲在內存的 棧 上? Number  String   Boolean  Null Undefined? 分析簡單數據類型在內存中的存儲方式var  n1 = 10;var  n2 = n1;

復雜數據類型在內存中的存儲

  ? 復雜數據類型（引用類型） 存儲在內存的 堆 上?  Object | Array | 函數

簡單數據類型作為函數的參數在內存存儲

 ?  分析案例代碼function  fn ( a, b ) {a = a+1;b = b+1;console.log( a );console.log( b );}var  x = 10；var  y = 5;fn(x, y);console.log( x, y );   思考：x ， y 的值是多少？

復雜數據類型作為函數的參數在內存存儲

  ? function Person ( name, age ) {this.name =  name; this.age = age;this.sayHi = function () {console.log( "你好" );}}var p1 = new Peron( "張三", 18 );function getperson ( person ) {person.name = "李四";}getperson( p1 );console.log( p1.name );   思考： p1 的name值是什么？

?