- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>无标题文档</title>
- <script>
- var arr = [];
- arr.number = 10; //对象下面的变量:叫做对象的属性
- //alert( arr.number );
- //alert( arr.length );
- arr.test = function(){ //对象下面的函数 : 叫做对象的方法
- alert(123);
- };
- arr.test();
- arr.push();
- arr.sort();
- </script>
- </head>
- <body>
- </body>
- </html>
创建第一个面向对象程序
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>无标题文档</title>
- <script>
- //var obj = {};
- var obj = new Object(); //创建了一个空的对象
- obj.name = '小明'; //属性
- obj.showName = function(){ //方法
- alert(this.name);
- };
- obj.showName();
- var obj2 = new Object(); //创建了一个空的对象
- obj2.name = '小强'; //属性
- obj2.showName = function(){ //方法
- alert(this.name);
- };
- obj2.showName();
- </script>
- </head>
- <body>
- </body>
- </html>
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>无标题文档</title>
- <script>
- //工厂方式 : 封装函数
- function createPerson(name){
- //1.原料
- var obj = new Object();
- //2.加工
- obj.name = name;
- obj.showName = function(){
- alert( this.name );
- };
- //3.出场
- return obj;
- }
- var p1 = createPerson('小明');
- p1.showName();
- var p2 = createPerson('小强');
- p2.showName();
- </script>
- </head>
- <body>
- </body>
- </html>
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>无标题文档</title>
- <script>
- //当new去调用一个函数 : 这个时候函数中的this就是创建出来的对象,而且函数的的返回值直接就是this啦(隐式返回)
- //new后面调用的函数 : 叫做构造函数
- function CreatePerson(name){
- this.name = name;
- this.showName = function(){
- alert( this.name );
- };
- }
- var p1 = new CreatePerson('小明');
- //p1.showName();
- var p2 = new CreatePerson('小强');
- //p2.showName();
- alert( p1.showName == p2.showName ); //false
- var arr = new Array();
- var date = new Date();
- </script>
- </head>
- <body>
- </body>
- </html>
对象的引用
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>无标题文档</title>
- <script>
- /*var a = [1,2,3];
- var b = [1,2,3];
- alert( a == b ); //false*/
- //var a = 5;
- //var b = a;
- //b += 3;
- alert(b); //8
- //alert(a); //5 基本类型 : 赋值的时候只是值的复制
- //var a = [1,2,3];
- //var b = a;
- //b.push(4);
- alert(b); //[1,2,3,4]
- //alert(a); //[1,2,3,4] 对象类型 : 赋值不仅是值的复制,而且也是引用的传递
- //var a = [1,2,3];
- //var b = a;
- //b = [1,2,3,4];
- alert(b); //[1,2,3,4]
- //alert(a); //[1,2,3]
- //var a = 5;
- //var b = 5;
- //
- //alert(a == b); //基本类型 : 值相同就可以
- //var a = [1,2,3];
- //var b = [1,2,3];
- //alert( a == b ); //false //对象类型 : 值和引用都相同才行
- var a = [1,2,3];
- var b = a;
- alert( a==b ); //true
- </script>
- </head>
- <body>
- </body>
- </html>
原型的详细介绍
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>无标题文档</title>
- <script>
- //原型 : 去改写对象下面公用的方法或者属性 , 让公用的方法或者属性在内存中存在一份 ( 提高性能 )
- //原型 : CSS中的class
- //普通方法 : CSS中的style
- //原型 : prototype : 要写在构造函数的下面
- /*var arr = [1,2,3,4,5];
- var arr2 = [2,2,2,2,2];
- arr.sum = function(){
- var result = 0;
- for(var i=0;i<this.length;i++){
- result += this[i];
- }
- return result;
- };
- arr2.sum = function(){
- var result = 0;
- for(var i=0;i<this.length;i++){
- result += this[i];
- }
- return result;
- };
- //alert( arr.sum() ); //15
- //alert( arr2.sum() ); //10*/
- var arr = [1,2,3,4,5];
- var arr2 = [2,2,2,2,2];
- Array.prototype.sum = function(){
- var result = 0;
- for(var i=0;i<this.length;i++){
- result += this[i];
- }
- return result;
- };
- alert( arr.sum() ); //15
- alert( arr2.sum() ); //10
- </script>
- </head>
- <body>
- </body>
- </html>
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>无标题文档</title>
- <script>
- var arr = [];
- //arr.number = 10;
- Array.prototype.number = 20;
- alert(arr.number);
- </script>
- </head>
- <body>
- </body>
- </html>
工厂方法之原型
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>无标题文档</title>
- <script>
- //当new去调用一个函数 : 这个时候函数中的this就是创建出来的对象,而且函数的的返回值直接就是this啦(隐式返回)
- //new后面调用的函数 : 叫做构造函数
- function CreatePerson(name){
- this.name = name;
- }
- CreatePerson.prototype.showName = function(){
- alert( this.name );
- };
- var p1 = new CreatePerson('小明');
- //p1.showName();
- var p2 = new CreatePerson('小强');
- //p2.showName();
- alert( p1.showName == p2.showName ); //true
- var arr = new Array();
- var date = new Date();
- </script>
- </head>
- <body>
- </body>
- </html>