javascript
JS OOP -01 面向对象的基础
JS面向對象的基礎:
1.用定義函數的方式定義類
2.用new操作符獲得一個類的實例
3.使用 [ ] 引用對象的屬性和方法
4.動態添加,修改,刪除對象的屬性和方法
5.使用 { } 語法創建無類型的對象
6.prototype原型對象
?
1.函數的方式定義類
function class1 () {.......}
**class1既是一個函數也是一個類,可以將它理解為類的構造函數,負責初始化工作。
?
2.new 操作符獲得一個類的實例
**JS中,函數和類是一個概念,當對一個函數進行new操作時,就會返回一個對象。如果這個函數中沒有初始化類成員,那就會返回一個空的對象
function Hello(){alert('hello');};var obj = new Hello();//這里執行了alert('hello'); 把Hello當作是一個構造函數。alert(typeof(obj));//打印出obj變量是一個object。?
3.使用 [] 引用對象的屬性和方法
**在JS中,每個對象可以看作是多個屬性(方法)的集合,引用一個屬性(方法),如下:
對象名.屬性(方法)名
對象名["屬性(方法)名"]
var arr = new Array();arr.push('111');arr['push']('333');var len =arr.length;var len =arr['length'];alert(len);**這種引用屬性(方法)的方式和數組類似,體現了JS對象就是一組屬性(方法)的集合這個性質。
<!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><script type="text/javascript" src="js/0318.js" ></script><script>function User(){this.age=21;this.sex='male';}var user = new User();function show(slt){if(slt.selectedIndex!=0){alert(user[slt.value]);}}</script></head><body><select onchange="show(this)"><option value="0">請選擇信息</option><option value="age">年齡</option><option value="sex">性別</option></select></body> </html>**eval函數!!
**eval() 函數計算 JavaScript 字符串,并把它作為腳本代碼來執行。
**如果參數是一個表達式,eval() 函數將執行表達式。如果參數是Javascript語句,eval()將執行 Javascript 語句。
<script> eval("x=10;y=20;document.write(x*y)"); document.write("<br>" + eval("2+2")); document.write("<br>" + eval(x+17)); </script>輸出:200? 4? 27
?
4.動態添加,修改,刪除對象的屬性和方法
**JS提供了靈活的機制來修改對象的行為,可以動態添加,修改,刪除屬性和方法。
var user =new Object();user.id=1;//動態生成id屬性user.name='zhang';//動態生成name屬性 alert(user.name);//訪問東西生成的name屬性 user.show=function(){//動態添加方法alert('ok');}user.show();//**動態生成的方法,可以如下:
function Myshow(arg01){//聲明一個函數alert('ok'+arg01);}var user =new Object();user.id=1;//動態生成id屬性user.name='zhang';//動態生成name屬性 user.show =Myshow;//將Myshow方法的指針指向user.show user.show(' qq');**注意:undefined和null的區別
**調試:console.log(obj);
**修改就是重新賦值,誰在后把之前的覆蓋!
**JS里面不存在重載!
**動態刪除:
function Myshow(arg01){//聲明一個函數alert('ok'+arg01);}var user =new Object();user.id=1;//動態生成id屬性user.name='zhang';//動態生成name屬性 user.show =Myshow;//將Myshow方法的指針指向user.show user.show(' qq');//動態刪除user.id=undefined;user.name=undefined;delete user.show;alert(user.id);//undefineduser.show('zq');//沒有打印出來,沒有該方法了**標準標簽,可以動態添加額外的屬性,不過要注意到瀏覽器的兼容性!!
<!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><script>function TestTT(){var obj = document.getElementById('btn');//獲取btn對象 obj.tab='ZQ';//給該對象添加一個tab的屬性,但是input標準標簽并沒有這個屬性的!動態添加后是可以訪問的 alert(obj.tab);alert(obj.value);}</script></head><body><input id="btn" type="text" value="123" /><button onclick="TestTT()" >TT</button></body> </html>?
5.使用 { } 大括號語法創建無類型對象 --(更原生的語法,用處較多)
**JS中的對象其實就是屬性(方法)的一個集合,并沒嚴格意義上的類的概念。所以可以使用 { } 直接聲明一個對象,而不是類。
var arr= new Array();var arr=[];var obj = new Object();var obj ={};//大括號創建的是對象不是類var user ={name:'zq',age:12};//alert(user.age);//var user1= new User();//js會報錯//alert(user1.age);function User(){};var user_1 = new User();user_1={name:'zq',age:12};alert(user_1.name);?
6.prototype原型對象
**prototype對象是實現面向對象的一個重要機制。每個函數(function)其實也是一個對象,它們對應的類是‘Function’,但它們的身份特殊,每個函數對象都具有一個子對象prototype。
**即prototype表示了該函數的原型,而函數也是類,prototype就是表示了一個類的成員的集合。當通過 new 來獲取一個類的對象時,prototype對象的成員都會成為實例化對象的成員。
**這里可以理解為C#的靜態成員,并且可以動態聲明!
function User(){this.name='zq';this.age=12;};User.prototype.show=function(){//給這個類的原型添加了一個show方法alert('User Show!!!');};var user1=new User();user1.name='qq';//alert(user1.name); user1.show();var user2=new User();//alert(user2.name); user2.show();?
轉載于:https://www.cnblogs.com/youguess/p/10551782.html
總結
以上是生活随笔為你收集整理的JS OOP -01 面向对象的基础的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 2021年各大银行大额存单利率 大额存单
- 下一篇: gradle idea java ssm