面向物件：
對代碼的一種抽象，對外統一提供呼叫介面的編程思想
物件的屬性：事物自身擁有的東西
物件的方法：事物的功能
物件：事物的一個實體
物件的原型：.prototype -> 記憶體地址 -> 存盤了一個物件
function fn(){ return 1; } alert(fn.prototype);//[object Object]
通過new Function創建的物件是函式物件，其他的都是普通物件
var obj=new Function(n1,n2,n3,...functionBody()); //建構式物件 前面是一系列引數，后面是自定義函式體 //不過構造器構造的物件，效率比較低 //引數順序不能改變，必須一一對應 var add=new Function("a","b","return a+b"); var sum=add(3,5); alert(sum);//8
閉包
閉包是一個擁有許多變數和系結了這些變數的環境的運算式（通常是一個函式）
全域變數在函式內部可以訪問
var n=100; function fn(){ alert(n);//100 } fn();
函式內部的變數，在外部不能訪問
function fn(){ var n=100; } fn(); alert(n);//報錯 n is not defined
有時需要在外部訪問函式內部的變數
解決方法：在函式內部再定義一個函式，輸出需要的變數，然后將該內部函式作為回傳值
function fn(){ var n=100; function fn2(){ alert(++n); } return fn2; } fn()();//101
閉包：函式b在函式a內嵌套，函式a需要回傳函式b
用途：1、讀取函式內部變數 2、讓函式內部變數保留在記憶體中，不隨著函式的執行結束而被銷毀
function fn(){ var n=100; nAdd=function(){ n++; } function fn2(){ alert(n); } return fn2; } var res=fn();//將fn()賦值給變數后，內部變數不會在每次執行時被初始化 res();//100 nAdd(); res();//101
閉包的優缺點：
優點-有利用封裝，可以訪問區域變數
缺點-記憶體占用，容易產生記憶體泄漏
閉包可以使用，但要謹慎使用
在html中創建任意幾個li，利用閉包特性實作點擊li彈出它的索引值
var lis=document.querySelectorAll("li"); for(var i=0;i<lis.length;i++){ (function(i){ lis[i].onclick=function(){ alert(i); } })(i); }
匿名函式自呼叫，傳入了for回圈里面的i值，保存每一次回圈的i值
for回圈會先執行完畢，然后形成多個作用域
每個i值會作為實參傳入函式中，當點擊li的時候，彈出的i值就是作用域中的i值
字面式宣告物件-最基本的方式
//字面式 var person={ name:"cyy", age:25, eat:function(food){ alert("我在吃"+food); } } console.log(person.name);//cyy person.eat("西瓜");//我在吃西瓜 console.log(person instanceof Object);//true
new Object() 建構式
Object是所有物件的基類，所有javascript物件都是由object延伸的
//new Object()建構式 var person=new Object(); person.name="cyy"; person.age=25; person.infos=function(str){ return this.name+" "+this.age+" "+str;//this指向當前物件 } alert(person.infos("很可愛"));//cyy 25 很可愛
構造方法宣告物件
使用new來實體化
函式內部只能用this來訪問屬性和方法
//構造方法宣告物件 function Person(name,age){ this.name=name;//this.name是屬性 name是引數 this.age=age; this.show=function(){ alert(this.name+" "+this.age);//this指向當前物件，不同的實體物件是獨立的 } } var cyy=new Person("cyy",25); cyy.show();//cyy 25 var cyy2=new Person("cyy2",18); cyy2.show();//cyy2 18
工廠方式宣告物件：按照某種模式，可以不斷的創造物件
在一個函式內部使用 new Object() 創建一個物件，并且回傳這個物件
//工廠模式 function person(name,age){ var obj=new Object(); obj.name=name; obj.age=age; obj.infos=function(){ return this.name+" "+this.age+" 很可愛";//物件的方法中要呼叫屬性，必須使用this } return obj; } var cyy=person("cyy",25); alert(cyy.infos());//cyy 25 很可愛 var cyy2=person("cyy2",25); alert(cyy2.infos());//cyy2 25 很可愛 // cyy和cyy2兩者沒有聯系
構造方式和工廠模式的區別：
構造方式不會創建出一個物件，也不會回傳這個物件，將屬性賦值給this
原型模式宣告物件
任何js方法或者函式，都自帶prototype屬性，并且以物件方式存在
函式本身宣告為空內容，通過prototype宣告屬性和方法，最后new這個函式
//原型模式 function person(){ } //alert(person.prototype);//[object Object] person.prototype.name="cyy"; person.prototype.age=25; person.prototype.infos=function(){ return this.name+" "+this.age; } var p=new person(); alert(p.infos());//cyy 25
原型模式也可以以json資料的方式來定義屬性和方法
//原型模式 function person(){ } //json資料格式 person.prototype={ name:"cyy", age:25, infos:function(){ alert(this.name+" "+this.age); } } var p=new person(); p.infos();//cyy 25
混合模式：構造模式+原型模式
//混合模式：構造+原型 function person(name,age){ this.name=name; this.age=age; } person.prototype={ addr:"China", infos:function(){ alert(this.name+" "+this.age+" "+this.addr); } } var p=new person("cyy",25);//建構式部分需要傳參，原型部分直接定義 p.infos();//cyy 25 China
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/149365.html
標籤：JavaScript
下一篇：JS 多載父頁面