JavaScript中创建对象主要有3种方式
使用new关键字调用构造器创建函数 <script> function Student(name,age){ this.name = name; this.age = age; } var s1=new Student();//没有传入参数 var s2=new Student("meinv",20); document.write(s1.name+"---"+s1.age+"<br/>");//输出undefined--undefined 对象名.属性名访问属性 在JavaScript中访问属性的方式还有一种对象名(属性名) document.write(s2.name+"--"+s2.age);//meinv--20 </script>当没有给函数传参时返回undefined,对象的本身其实就是一个关联数组,关联数组其实就是由键值对key value组成的,key对应的就是属性,value对应的就是值, 这个值可以是基本数据类型,也可以是function函数,假设当value为函数时,这个函数就是这个对象的一个方法
使用Object直接创建对象 <script> var myObj = new Object();//先创建一个空的对象 myObj.name = "meinv";//动态添加两个属性 myObj.age = 20; myObj.info = function(){//动态添加一个function函数 document.write("我是"+this.name+"<br/>");//我是美女 document.write("我今年"+this.age+"岁<br>");//我今年20岁 } myObj.info(); </script> 使用JSON语法创建对象JSON的概念 JSON(JavaScript Object Notation) 是一种轻量级的数据交换个格式。易于人阅读和编写
JSON的格式 JSON对象是以一对"大括号"括起来,大括号内以多个"名值对"组成,多个名值对之间用"逗号"隔开,名所对象的值可以是各种数据类型的值,也可以是JSON对象。JSON数组用"[]"括起来
<script> {"name":"meinv","age":20,"email":"123456789.@qq.com"}//名值用分号隔开,名值对用逗号隔开 {"peoples":[ {"firstName":"xiaohong","lastName":"xiaolv"}, {"firstName":"xiaoming","lastName":"xiaolan"}, {"firstName":"xiaohei","lastName":"xiaobai"} ]} </script>提示: JSON数据格式比XML数据格式更简洁,数据传输量也更小,因此在需要跨平台、跨语言进行数据交换时,有时宁愿选择JSON作为数据交换格式,而不是XML。
JavaScript使用JSON创建对象的语法 object={属性名1:属性值1,属性名2:属性值2,…}
<script> var p = { name : "John", gender : "male", info:function(){ document.write("姓名:"+this.name+",性别:"+this.gender); }, }; p.info(); </script> <script> //以上几个方法的运行小案例和他们的运行结果 //第一种 使用new关键字创建 function student(name,age){ this.name = name;//对象属性 this.age = age; student.gender = 'male';//此属于类的一个属性 this.info=function(){ document.write("姓名:"+this.name+",年龄:"+this.age+",性别:"+student.gender+"<br/>") } } var s1 = new student("zhangyi",12) s1.info(); //第二种 使用Object直接创建对象 var student = new Object(); student.name='仗义'; student.age=30; function abc(){ document.write("姓名:"+this.name+",年龄:"+this.age) } student.info=abc; student.info(); //第三种 JSON创建对象的语法 var person={ "name":"zhangyi", "age":30, "son":[ { "name":"jack", "age":2 }, { "name":"rose", "age":5 } ], "info":function(){ document.write("父亲姓名:"+this.name+",年龄:"+this.age+"<br>"); for(var child in this.son){//遍历数组用for in 循环 document.write("儿子姓名:"+this.son[child].name+",年龄:"+this.son[child].age+"<br>"); } } }; person.info(); </script>运行效果如下图: 在此补充一个知识点方法中的this关键字
面向对象语言中 this 表示当前对象的一个引用。
但在 JavaScript 中 this 不是固定不变的,它会随着执行环境的改变而改变。
在方法中,this 表示该方法所属的对象。如果单独使用,this 表示全局对象。在函数中,this 表示全局对象。在函数中,在严格模式下,this 是未定义的(undefined)。在事件中,this 表示接收事件的元素。类似 call() 和 apply() 方法可以将 this 引用到任何对象。 <body> <!-- 方法中的this : 代表当前调用该方法的对象 this指向对象的好处在于,可以更加方便的对象自身的内部成员 --> <script> //第一种:使用new实例化对象 var car = new Object(); //添加属性 car.color = "red"; car.price = "20w"; car.wheel = 4; //添加方法 //console.log(car.color) car.showColor = function(){ console.log("汽车的颜色:"+car.color); } car.showPrice = function(){ console.log("汽车的价格:20w") } car.showCar = function(){ console.log("汽车的颜色:"+this.color+",汽车的价格:"+this.price+",汽车有"+this.wheel+"个车轮") } //访问对象 car.showColor() car.showCar() </script> </body>