1.对象编程概述
JavaScript 中的所有事物都是对象:字符串、数字、数组、日期,等等。 在 JavaScript
中,对象是变量和函数集合,对象中的变量成为属性(property),对象中的函数称为方法(method),对象是拥有属性和方法的数据。
系统对象:
2.自定义对象的创建和使用
(1)var 对象名=new Object ( ) ;
(function () {
var yjq=new Object(); //创建yjq对象
yjq.name="好动得肥哈"; //yjq中的那么属性
yjq.CSDN="https://blog.csdn.net/weixin_43383738"; //yjq中的那么属性
yjq.id=43383738; //yjq中的那么属性
document.write("名字: "+yjq.name+"<br/>");
document.write("CSDN: "+yjq.CSDN+"<br/>");
document.write("id: "+yjq.id+"<br/>");
})();
(2)对象实现简单计算
(function () {
var yjq=new Object();
yjq.pi=3.14; //定义属性pi
yjq.add=function(n1,n2){return n1+n2};
yjq.sub=function (n1,n2) {return n1-n2};
yjq.mul=function (n1,n2) {return n1*n2};
yjq.div=function (n1,n2) {return n1/n2};
document.write("4 + 3 = "+yjq.add(4,3)+"<br/>");
document.write("4 - 3 = "+yjq.sub(4,3)+"<br/>");
document.write("4 * 3 = "+yjq.mul(4,3)+"<br/>");
document.write("4 ÷ 3 = "+yjq.div(4,3)+"<br/>");
document.write("yjq的属性pi "+yjq["pi"]+"<br/>"); //数组运算符访问属性
})();
(3)创建图片对象
(function () {
function image(_src,_width,_height) { //构造函数
this.src=_src;
this.width=_width;
this.height=_height;
}
var yjq=new image("images/seven.jpg",300,300);
yjq.print_img=function () { // 相当于function yjq.print_img(){};
document.write("下方出现图片"+"<br/>");
document.write("<img src="+this.src+" width="+this.width+" height="+this.height+"/>");
};
yjq.print_img(); //方法
})();
(4)使用with简化对象操作–with(对象名){… …}
(function () {
function yjq(username,age,website) {
this.username=username;
this.age=age;
this.website=website;
}
var personal=new yjq("yjq","21","www.520yjqcy.top");
with(personal){ //with简化后的方法
document.write("用户名: "+username+"<br/>")
document.write("年龄: "+age+"<br/>")
document.write("网站: "+website+"<br/>")
}
//对比旧方法
var old=new yjq("old","20","www.520yjqcy.top/seo");
document.write("<br/>")
document.write("用户名: "+old.username+"<br/>")
document.write("年龄: "+old.age+"<br/>")
document.write("网站: "+old.website+"<br/>")
})();
(5)instanceof运算符判断对象类型–对象名 instanceof 对象类型
(function () {
function Fruits() {}; //定义水果类
function Vegetables() {}; //定义蔬菜类
var apple=new Fruits();
var potato=new Vegetables();
document.write("var apple=new Fruits();"+"<br/>");
document.write("var potato=new Vegetables();"+"<br/>");
var belong=false;
document.write("<br/>"+"Fruits类型"+"<br/>");
belong=apple instanceof Fruits;
document.write("测试apple是否属于Fruits类型;"+belong+"<br/>");
belong=potato instanceof Fruits;
document.write("测试potato是否属于Fruits类型;"+belong+"<br/>");
document.write("<br/>"+"Vegetables类型"+"<br/>");
belong=apple instanceof Vegetables;
document.write("测试apple是否属于Vegetables类型;"+belong+"<br/>");
belong=potato instanceof Vegetables;
document.write("测试potato是否属于Vegetables类型;"+belong+"<br/>");
belong=apple instanceof Object;
document.write("<br/>"+"Object类型"+"<br/>");
document.write("测试apple是否属于Object类型;"+belong+"<br/>");
belong=potato instanceof Object;
document.write("测试potato是否属于Object类型;"+belong+"<br/>")
document.write("测试表明Object是JavaScript中根对象类型,任何对象都属于Object类型"+"<br/>");
})();
(6)使用instanceof运算符检查参数的类型
function yjq(name,age) {
this.username=username;
this.age=age;
}
function belong(s) { //belong测试函数
if(!(s instanceof yjq)){
document.write("对象不是yjq类型")
return;
}
with (s){
document.write("<br/>")
document.write("用户名: "+username+"<br/>")
document.write("年龄: "+age+"<br/>")
}
}
(function () {
var yjq1=new yjq("yjq","20"); //yjq对象
var yyy=100; //测试对象
document.write("yjq1的类型对象信息:");
belong(yjq1);
document.write("<br/>")
document.write("yyy的类型对象信息:");
document.write("<br/>")
belong(yyy);
})();
(7)使用for…in循环遍历对象成员
(function () {
function yjq(username,age,website) { //描述人物的对象类型
this.username=username;
this.age=age;
this.website=website;
};
var seven=new yjq("yjq","20","www.520yjqcy.top"); //创建对象人物seven
for(var property in seven){ //遍历seven中的属性
document.write("对象seven中的"+property+"属性:"+seven[property]+"<br/>");
}
})();