JS高級03

注意:

1.將不同的功能放到不同的js文件中

2.將不同的功能代碼劃分到不同的函數中

3.每個js中的代碼都放到一個自調用函數中,防止變量的全局污染

①在自調用函數內部通過window.Food = Food這種形式,將內部的變量暴露到全局環(huán)境中

4.每個js文件都是通過面向對象的方式組織代碼的
構造函數+原型

5.方法 放到原型中, 屬性 放到構造函數中

原型對象constructor屬性

原型對象的默認屬性

原型對象.constructor----->構造函數

實例對象.constructor----->構造函數(屬性搜索原則)

實力對象.__proto---------->原型對象

構造函數.prototype------->原型對象

方法

.hasOwnPeototype()

//判斷屬性是不是提供檢測的對象提供的

語法:var ret = obj.hasOwnPrototype("name");

//返回值 布爾值

//如果是當前對象提供的返回true,若不是返回false

//注意: for in 在遍歷對象時,內置對象不會被遍歷出來,只有自己手動添加的屬性和方法才會被遍歷出來,包括原型對象的屬性和方法

instanceof

判斷構造函數的原型對象是否在被檢測的對象的原型鏈上,返回值boolean;

function Person() {

  }
  var p = new Person();
//  p原型鏈  Person.prototype-->Object.prototype--->null
//  person的原型對象  Person.prototyp
//  判斷person的原型對象是否在p的原型鏈上
  var ret = p instanceof Person
  console.log(ret);

面向對象特征介紹

繼承

//混入式繼承:

var dog1 = {name:"哈士奇",age:1,weight:"5kg"}
  
  Object.prototype.say = function () {
    console.log(haha);
  }
  
  var pipigou = {};
  
  pipigou.extend = function (obj) {
  
  for (var k in obj){
  
  this[k] = obj[k]
      
    }
  
  }
  
  pipigou.extend(dog1)
  
//注意:混入式繼承會將被繼承對象的原型對象中添加的屬性繼承過來
// 可通過.hasOwnPrototype()進項篩選

//原型繼承

//原型繼承:如果想要讓一個對象繼承自另一個對象中的屬性和方法,
//只需要將這些屬性和方法添加到原型對象中,那么這個實例對象就可以直接使用這些屬性和方法,這就是原型繼承
//原型繼承利用了js自身的一個特點,實例對象可以直接使用原型對象中的屬性和方法(屬性搜索原則)

//1.利用對象的動態(tài)性(對象創(chuàng)建好之后,可以在任何時候給對象添加屬性和方法)

function Person() {}
 Person.prototype.say = function() {
      console.log('hello world');
    };
    Person.prototype.coding = function() {
      console.log('敲代碼');
    };
    var p = new Person();
    var p1 = new Person();
    p.say();
    p.coding();
    p1.say();
    p1.coding();

//利用覆蓋原型對象

function Person() {};
Person.prototype = {
//覆蓋了原來的原型對象,若要與原來的原型對象結構保持一致,
//需手動添加constructor:Person
say:function() {
      console.log('hello world');
    },
coding : function() {
      console.log('敲代碼');
    }
}

3.利用混入式繼承給原型對象添加屬性和方法

//給原型對象添加extend方法,通過extend方法給原型對象添加屬性和方法

// 利用 混入式繼承

function Person() { }
    // 給 原型對象 添加一個extend方法, 通過extend方法來給原型對象添加屬性或方法
    Person.prototype.extend = function (obj) {
      for(var k in obj) {
        this[k] = obj[k];
      }
    };
    // 調用方式: 通過原型對象來調用extend放, 此時的作用才是 給原型對象 添加屬性或方法
    
    Person.prototype.extend( {
      name: '小明',
      age: 19
    } );
    var p = new Person();
    // p.extend();
    console.log(p.age);
    var p1 = new Person();
    console.log(p1.name);

Object.creat(參數對象)繼承

// Object.create() 方法的基本使用介紹:
// 語法: var newObj = Object.create( 參數對象 )
// 作用: 創(chuàng)建一個新對象, 新對象 繼承 參數對象
//       新對象.__proto__ === 參數對象
//參數對象為新對象的原型

函數的三種創(chuàng)建方式

1.函數的聲明

注意:

函數聲明只能出現在全局中或函數內部

不能出現在if這樣的語句中

function fn(){}

聲明的函數會進行提升

2.函數表達式

注意:

函數表達式也是有名字的,這種名字只能在函數內部使用
var fn = function( ) { }
函數表達式在預解析時不會進行提升

3.new Function

從這種創(chuàng)建方式可以看書函數也是對象
            var fn = new Function()
1.所有的參數都是字符串類型
2.最后一個參數表示函數體
eg: var max = new Function("num1","num2","num1>num2?num1:num2;");
   max(10,2)