/**
?* 解析器在調用函數時，每次都會向函數內部傳遞一個隱含的參數
?* ?? ?這個隱含的參數就是this，this指向的是一個對象，
?* ?? ?這個對象我們稱為函數執行的上下文對象，
?* ?? ?根據函數的調用方式的不同，this會指向不同的對象
?* ?? ??? ?1、以函數方式調用，this是window
?* ?? ??? ?2、以方法的形式調用時，this就是調用方法的那個對象
?* ?? ??? ?3、以構造函數的形式調用時，this是新創建的對象
?* */

function func(){console.log(this.name); }// 創建一個對象 var obj = {name:"sun",sayName:func };var obj2 = {name:"zhu",sayName:func };var name = "全局的name屬性"; //以函數方式調用，this是window func(); //以方法的形式調用，this是調用方法的對象 obj.sayName(); obj2.sayName();

?/**

?* 由于普通創建多個對象時會占用大量篇幅，而此類代碼嗎是可以復用的，因此
?* 使用工廠方法創建對象
?* ?? ??? ?通過該方法可以大批量的創建對象
?* ?? ??? ?使用工廠方法創建的對象，使用的構造函數都是Object
?* ?? ??? ?所以創造的對象都是objec類型
?* ?? ??? ?就導致我們無法區分出多種不同類型的對象?? ?
?* */

普通創建與工廠方法創建對象對比如下所示：

// 普通創建對象 var obj01 = {name:"sun",age:28,gender:"男",sayName:function(){console.log(this.name);} }var obj02 = {name:"zhu",age:218,gender:"男",sayName:function(){console.log(this.name);} } var obj03 = {name:"sha",age:286,gender:"nv",sayName:function(){console.log(this.name);} }obj03.sayName(); // 使用工廠方法創建對象 function createPerson(name, age, gender){// 創建一個新的對象var obj = new Object();// 向對象中添加屬性obj.name = name;obj.age = age;obj.gender = gender;obj.sayName = function(){console.log(this.name);}return obj; }var sun = createPerson("sun", 28, "男"); var zhu = createPerson("豬", 28, "男"); var bai = createPerson("白", 228, "女");bai.sayName();

/**
?* 由于工廠方法每次都要創建一個新的對象，所以我們使用構造函數
?* 構造函數
?* 創建一個構造函數，專門用來創建Person對象的
?* ?? ??? ?構造函數就是一個普通的函數，創建方式和普通函數沒有區別，
?* ?? ??? ?不用的是構造函數習慣上首字母大寫
?*?
?* 構造函數和普通函數的區別就是調用方式的不同
?*?? ??? ?普通函數是直接調用，而構造函數需要使用new關鍵字來調用?
?*
?* */

代碼如下所示（分為加入形參與不加形參兩種）：

function Person(){this.name = "hanzi";this.age = 18;this.sayName = function(){console.log(this.name);} }// 加入形參以能復用構造函數 function Person_New(name, age){this.name = name;this.age = age;this.sayName = function(){console.log(this.name);} }var per = new Person(); var per1 = new Person_New("卓", 888); var per2 = new Person_New("卓", 888);per.sayName(); per1.sayName(); per2.sayName();// 使用instanceof 可以檢查一個對象是否是一個類的實例 // 語法：對象instanceof 構造函數，如果是，則返回true，否則返回false console.log(per instanceof Person); // 判斷兩個對象調用的方法是否一致，此處返回值應為false，因為每次調用方法都是創建新的對象 // 想要解決這種問題就要優化構造函數 console.log(per1.sayName == per2.sayName);

/**
?* 優化構造函數
?* 將function寫到構造函數的屬性中的時候，構造函數執行一次就會創建一個方法
?* ?? ??? ?執行1000次就會創建1000次的方法，但其作用是一樣的，
?* ?? ??? ?因此，我們將它寫到全局中
?*?
?* 但是！！！！將函數定義在全局作用域，污染了全局作用域的命名空間
?* 而且定義在全局作用域中也很不安全，所以使用prototype（原型）
?* 將函數寫到構造函數的原型中，可以讓所有對象訪問到它
?* */

function Person_New02(name, age){this.name = name;this.age = age;this.sayName = fun; }function fun(){console.log(this.name); }var per3 = new Person_New02("卓11", 888); var per4 = new Person_New02("卓11", 888);per3.sayName(); per4.sayName(); console.log(per3.sayName == per4.sayName);

/**
?* prototype原型
?* 我們所創建的每一個函數，解析器都會向函數中添加一個屬性prototype
?* ?? ??? ?這個屬性對應著一個對象，這個對象就是我們所謂的原型對象
?* 如果函數作為普通函數調用prototype沒有任何作用
?* 當函數通過以構造函數調用時， 他所創建的對象中都會有一個隱含的屬性指向該構造函數的原型對象
?* 我們可以通過__proto__來訪問屬性
?* 原型對象就相當于一個公共的區域，所有同一個類的實例都可以訪問到這個原型對象
?* ?? ??? ?我們可以將對象中共有的內容，統一設置到原型對象中
?*?
?* 當我們訪問對象的一個屬性或者方法時，它會先在對象自身中尋找，如果有則直接使用
?* ?? ??? ?如果沒有則在對象的原型對象中尋找，如果有則直接使用
?* ?? ??? ?一直找到Object對象，若沒有則返回Undefined
?* ?? ?
?* 以后我們創建構造函數時，可以將這些對象共有的屬性和方法，同一添加到構造函數的原型對象中，
?* ?? ??? ?這樣不用分別為每一個對象添加，也不會影響到全局作用域就可以使每個對象都具有這些屬性和方法了
?*?
?* */
?

function MyClass(){}// 向MyClass的原型中添加屬性a MyClass.prototype.a = 123;var myc = new MyClass();console.log(myc.__proto__ == MyClass.prototype); console.log(myc.a);// 向myc中添加a屬性 myc.name = "我是myc中的name"; console.log(myc.name);//向MyClass的原型中添加方法 MyClass.prototype.sayHello = function(){console.log("我是原型中的方法 "); } myc.sayHello();// 可以使用hasOwnProperty()來檢查自身中是否含有該函數 console.log(myc.hasOwnProperty("name"));

/**
?* forEach()方法需要一個函數作為參數
?* ?? ??? ?像這種函數，由我們創建但不由我們調用，我們稱為回調函數
?*?
?* */

//創建一個數組 var arr = ["孫悟空","豬八戒","白骨精","牛魔王"];arr.forEach(function(value, index, obj){console.log(value); });

?

?

總結

以上是生活随笔為你收集整理的【JS小知识】this的指向、工厂方法、构造函数及优化、prototype原型、forEach()的使用的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。