javaScript对象基础

1、对象的引用

删除对象的引用:当变量object对象置为null时,对第一个创建的对象的引用就不存在了

2、对象的类型

javaScript对象的类型:内部对象、宿主对象、自定义对象
内部对象:Array Boolean Function Date Global Math Number Object RegExp String
宿主对象:执行javaScript时javascript脚本环境提供的对象
自定义对象:
2.1本地对象:独立于宿主环境的ECMAScript提供的对象

使用[]来调用对象的方法和属性

  function Car(color,mileage,brand){
        this.color=color;
        this.mileage=mileage;
        this.brand=brand;
        this.stop=function(){
            console.log("stop");
        }
    }
    function isload(){
        /*使用[]来调用方法和属性*/
       var car1=new Car("red",20,"奔驰");
        console.log(car1["color"]);  //red
        car1["stop"]();   //使用[]来调用了stop方法,但是必须得加上()才算调用了这个方法
    }

为对象添加属性和方法

  function Car(color,mileage,brand){
        this.color=color;
        this.mileage=mileage;
        this.brand=brand;
        this.stop=function(){
            console.log("stop");
        }
    }
    function isload(){
        /*使用[]来调用方法和属性*/
       var car1=new Car("red",20,"奔驰");
        console.log(car1["color"]);  //red
        car1["stop"]();   //使用[]来调用了stop方法,但是必须得加上()才算调用了这个方法
        car1.start=function(){
            console.log("开车了");
        };
        car1.start();  //为car1添加了一个方法
        var car2=new Car("red",20,"奔驰");
//        car2.start();  //这样访问会出错,因为Car2没有这个方法
    }

删除属性和方法

  function Car(color,mileage,brand){
        this.color=color;
        this.mileage=mileage;
        this.brand=brand;
        this.stop=function(){
            console.log("stop");
        }
    }
    function isload(){
        /*使用[]来调用方法和属性*/
       var car1=new Car("red",20,"奔驰");
        console.log(car1["color"]);  //red
        car1["stop"]();   //使用[]来调用了stop方法,但是必须得加上()才算调用了这个方法
        car1.start=function(){
            console.log("开车了");
        };
        //car1.stop="undefined";  //其实没有真正的删除,只不过将其设置为undefined
        delete car1.stop;   //删除了stop方法
        delete car1.color;    //删除了Car的属性
        car1.start();  //为car1添加了一个方法
        car1.stop();
        var car2=new Car("red",20,"奔驰");
//        car2.start();  //这样访问会出错,因为Car2没有这个方法
    }

应用于对象的语句

1、with

   function isload(){
       var date=new Date();
        with(date){
            setFullYear(2008);
            setMonth(11);
            setDate(13);
            setHours(3);
            setMinutes(23);
            setSeconds(35);
        }
        console.log(date.toString());   //Sat Dec 13 2008 03:23:35 GMT+0800 (中国标准时间)
    }

2、for___in语句

   function Car(color,mileage,brand){
        this.color=color;
        this.mileage=mileage;
        this.brand=brand;
        this.stop=function(){
            console.log("stop");
        }
    }
    function isload(){
       var car1=new Car("red",20,"奔驰");
       for(var xx in car1){
           console.log(xx);   //依次会输出car1的每个属性和方法
       }
    }

function对象

2.1.1Array类

var ac=new Array(“red”,”green”,”blue”);
var ad=[“red”,”sss”,”sss”];
Array对象覆盖了toString()方法和valueOf()方法
var ac=new Array(“red”,”green”,”blue”);
var ad=[“red”,”sss”,”sss”];
console.log(ac.toString()); //red,green,blue
console.log(ac.valueOf()); //[“red”, “green”, “blue”]
jion()方法只有一个参数 通过这个参数把数组的每个元素连接成字符串
console.log(ac.join(“,”)); //red,green,blue
concat()方法和slice()方法 与字符串的该方法使用相同
pop()取元素 push()添加元素
var ac=new Array(“red”,”green”,”blue”);
var ad=[“red”,”sss”,”sss”];
console.log(ac.pop()); //blue
console.log(ac.push(“jsjaa”)); //3返回的是添加进去以后数组的长度
console.log(ac.pop()); //jsjaa
shift()方法和unshift()方法
var ac=new Array(“red”,”green”,”blue”);
console.log(ac.shift()); //red
console.log(ac.unshift(“jsss”)); //3返回的是添加进去以后数组的长度
console.log(ac.unshift(“jss”)); //4返回的是添加进去以后数组的长度
两种与数组顺序有关的方法sort() ,reverse()
var ac=new Array(“red”,”green”,”blue”);
ac.reverse();
console.log(ac.toString()); //blue,green,red
ac.unshift(“sss”);
ac.sort();
console.log(ac.toString()); //4返回的是添加进去以后数组的长度
splice()方法 区别于slice()方法
var ac=new Array(“red”,”green”,”blue”);
ac.splice(0,2); //起始位置,要删除的项的个数
console.log(ac.toString()); //删除数组的前两项 blue 删除
ac.splice(2,0,”red”,”sss”); //起始位置,要删除的项的个数,要插入的项
console.log(ac.toString()); //blue,red,sss 替换而不删除
ac.splice(2,1,”red”,”hshss”); //起始位置,要删除的项的个数,要插入的项
console.log(ac.toString()); //blue,red,red,hshss 替换并删除
2.1.2Date类
2.2内置对象
2.2.1Global对象
最强大的eval方法()该方法就像整个ECMAScript的解释程序,接受一个参数,即要执行的javaScript字符串
eval(“alert(1)”);这段代码的功能相当于alert(1)
2.2.2Math对象
2.2宿主对象
宿主对象:所有非本地对象都是宿主对象,由ECMAScript实现的宿主环境提供的对象
javascript中BOM和DOM都是宿主对象
3.4this关键字
在javascript中this总是指向调用该方法的对象
function test(){
var oo=new Object;
oo.color=”red”;
oo.showColor=function(){
alert(this.color); //red
};
oo.showColor();
}
window.onload =test;
3.5定义类或对象
3.5.1工厂方式
开发者创造了能创建并返回特定类型的对象的工厂函数
function createCar(){ //这就是一个工厂函数
var car=new Object;
car.color=”red”;
car.doors=4;
car.mgp=23;
car.showColr= function () {
alert(this.color);
}
return car;
}
window.onload =function(){
var car1=createCar();
var car2=createCar();
car1.color=”aaa”;
car2.color=”bbb”;
car1.showColr(); //aaa
car2.showColr(); //bbb
};
3.5.2构造函数方式
这种方式构造函数内部没有创建对象,而是使用this’关键字,使用new运算符调用构造函数时调用构造函数,在执行第一行代码之前先创建一个对象,只有使用this关键字才能访问的对象,然后直接赋予this属性,默认情况下是构造函数的返回值
function createCar(Scolor,iDoors,iMpg){ //这就是一个构造函数
this.color=Scolor;
this.doors=iDoors;
this.mgp=iMpg;
this.showColor=function(){
alert(this.color);
}
}

window.onload =function(){
var car1=new createCar(“red”,4,23);
var car2=new createCar(“green”,5,43);
car1.showColor();
car2.showColor();
};
3.5.3原型方式
该方式利用了对象的prototype属性,可把它看成创建新对象所依赖的模型,用空 的构造函数来设置类名,然后所有的属性和方法都被直接赋予了prototype属性:
function car(){}
car.prototype.color=”red”;
car.prototype.door=3;
car.prototype.mpg=12;
car.prototype.showColr=function(){
console.log(this.color);
}

window.onload =function(){
var car1=new car();

 var car2=new car();
 car1.showColr();
 car2.showColr();

};
注意:使用原型方式,不能通过给构造函数传递参数初始化属性,这就意味着必须在对象创建后才能改变属性的值,真正的问题是如果真的只使用这种方式的话,属性是对象的,改变一个对象的某个属性,会改变所有对象的这个属性
function car(){}
car.prototype.color=”red”;
car.prototype.door=3;
car.prototype.mpg=12;
car.prototype.drivers=new Array(“Mike”,”Sue”);
car.prototype.showColr=function(){
console.log(this.color);
}

window.onload =function(){
var car1=new car();
var car2=new car();
car1.drivers.push(“kdls”);
console.log(car1.drivers.toString()); //Mike,Sue,kdls 其实只改变了一个,但是程序都给了两个
console.log(car2.drivers.toString()); //Mike,Sue,kdls 其实只改变了一个,但是程序都给了两个
};

3.5.4混合的构造函数/原型方式
就是用构造函数定义对象的所有非函数的属性,用原型方式定义对象的函数属性,结果就是所有函数被创建一次,而且每个对象都有自己的对象的属性实例
function car(sColor,Doors,Mgp){
this.color=sColor;
this.door=Doors;
this.mpg=Mgp;
this.drivers=new Array(“Mike”,”Sue”);
}
car.prototype.showColr=function(){
console.log(this.color);
}
window.onload =function(){
var car1=new car();
var car2=new car();
car1.drivers.push(“kdls”);
console.log(car1.drivers.toString()); //Mike,Sue,kdls 程序只改变了一个
console.log(car2.drivers.toString()); //Mike,Sue 程序只改变了一个
};
3.5.5动态原型模式
这样做的好处是赋予对象的方式
function car(sColor,Doors,Mgp){
this.color=sColor;
this.door=Doors;
this.mpg=Mgp;
this.drivers=new Array(“Mike”,”Sue”);
if(typeof car._initialized==”undefined”){
car.prototype.showColr=function(){
console.log(this.color);
}
car._initialized=true;
}
}
car.prototype.showColr=function(){
console.log(this.color);
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值