在JavaScript中创建对象
2016-01-12 14:08
471 查看
这两天碰上了点儿前台的问题,大脑卡顿,Linux暂时顾不上了,/(ㄒoㄒ)/~~,为了调好程序,阅读了一些js代码,鉴于js就学了最基础的用法,看得迷迷糊糊的,好歹问题调好了,决定来补补js的课。
首先明确第一点:JavaScript中,所有的事物都是对象,字符串啦,数组啦,函数啦,统统都是对象!
第二点:对象拥有自己的属性和方法。
创建对象的方法呢,有以下几种,1是直接创建对象,2是使用构造器,3原型方法,4构造器与原型混合。
直接创建对象的语法是这样的:
对象还可以通过构造器来创建,比如:
这里 createcar() 就充当了一个构造器,通过 构造器 和 new 操作,我们又一次建立起了对象car,属性的读取、修改、增加操作与之前一样的啦。
对象除了拥有属性外,还可以拥有方法啦,让我们把上一段代码改一下,添加一个方法进去吧:
(~ o ~)~zZ,有没有把你们讲睡着……语言表达能力着实堪忧啊。
话说,第三种创建对象的方法就是原型方法了(第一次见这说法的时候,嗯,不明觉厉)。js里呢,对象都有一个叫做prototype的属性,原型就是指的它啦,与构造器不同,原型只能直接赋值,而不能根据需求传递(就是说,利用原型初始化的属性,其值是写死的,如果需要个性化设置,只能在对象创建后重新赋值)
Car.prototype={......} 就是对于原型的定义啦,凭嘛car一定属于dad,凭嘛color一定是white,这样好不方便有木有!!!
于是有了第四种方法,原型与构造器结合的版本,例如:
再有:
欧啦,以上就是今天的分享了~
首先明确第一点:JavaScript中,所有的事物都是对象,字符串啦,数组啦,函数啦,统统都是对象!
第二点:对象拥有自己的属性和方法。
创建对象的方法呢,有以下几种,1是直接创建对象,2是使用构造器,3原型方法,4构造器与原型混合。
直接创建对象的语法是这样的:
car=new Object(); car.color="green"; car.owner="dad";我创建了一个名叫car的对象,它有两个属性color和owner,创建该对象的方法还可以这么写:
car={color:"green",owner:"dad"};在创建对象之后通过 对象名.属性名 可以读取指定对象的属性值,也可以通过 对象名.属性名="xxx" ,为该对象的属性重新赋值,如
alert(car.color); car.color="red"; alert(car.color);
对象还可以通过构造器来创建,比如:
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);"></span><pre name="code" class="javascript">function Car(color,owner,users){ this.color=color; this.owner=owner; this.users=users; } var car=new Car("red","mum",""); alert("car.color: "+car.color+" car.owner: "+car.owner); car.users="mum, dad and me"; alert("car.users: "+car.users);
这里 createcar() 就充当了一个构造器,通过 构造器 和 new 操作,我们又一次建立起了对象car,属性的读取、修改、增加操作与之前一样的啦。
对象除了拥有属性外,还可以拥有方法啦,让我们把上一段代码改一下,添加一个方法进去吧:
function Car(color,owner,users){ this.color=color; this.owner=owner; this.users=users; this.getmsg=function(){alert("car.color: "+this.color+" this.owner: "+this.owner+" car.users: "+this.users);} } var car=new Car("red","mum","mum, dad and me"); car.getmsg();注意哦,在调用 对象car 的方法 getmsg() 时,不要丢了括号,O(∩_∩)O~~
(~ o ~)~zZ,有没有把你们讲睡着……语言表达能力着实堪忧啊。
话说,第三种创建对象的方法就是原型方法了(第一次见这说法的时候,嗯,不明觉厉)。js里呢,对象都有一个叫做prototype的属性,原型就是指的它啦,与构造器不同,原型只能直接赋值,而不能根据需求传递(就是说,利用原型初始化的属性,其值是写死的,如果需要个性化设置,只能在对象创建后重新赋值)
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);"><span></span></span><pre name="code" class="javascript">function Car(color,owner,users){ } Car.prototype= { color:"white", owner:"dad", users:"mum, dad and me", getcolor:function(){alert("car.color: "+this.color);}, getowner:function(){alert("car.owner: "+this.owner);}, getusers:function(){alert("car.users: "+this.users);} }; var js_test=new Car("","",""); js_test.getcolor(); js_test.getowner(); js_test.getusers();
Car.prototype={......} 就是对于原型的定义啦,凭嘛car一定属于dad,凭嘛color一定是white,这样好不方便有木有!!!
于是有了第四种方法,原型与构造器结合的版本,例如:
function Car(color,owner){ this.color=color; this.owner=owner; } Car.prototype= { users:"mum, dad and me", getcolor:function(){alert("car.color: "+this.color);}, getowner:function(){alert("car.owner: "+this.owner);}, getusers:function(){alert("car.users: "+this.users);}, getmsg:function(){alert("car.color: "+this.color+" this.owner: "+this.owner+" car.users: "+this.users)} }; var js_test=new Car("gray","me"); js_test.getmsg();据说,通常是“用构造函数定义对象的所有非函数属性(包括普通属性和指向对象的属性),用原型方式定义对象的函数属性(方法)”
再有:
function Car(color,owner){ this.color=color; this.owner=owner; this.users="mum, dad and me"; Car.prototype.getmsg=function(){alert("car.color: "+this.color+" this.owner: "+this.owner+" car.users: "+this.users)} } var js_test=new Car("gray","me"); js_test.getmsg();把对原型的定义挪到构造器的里面,据说这样看上去和类更像啦,不过,这样在构造器里定义的原型不能写成 Car.prototype={......} 的样子啦,要写 Car.prototype.属性或方法=......
欧啦,以上就是今天的分享了~
相关文章推荐
- 探析浏览器执行JavaScript脚本加载与代码执行顺序
- 各个JSON技术的比较
- IE、FF、Chrome浏览器中的JS差异介绍
- javascript的构造函数,原型和以其实现的经典继承
- javascript 与vbscript 互相调用
- ExtJS 5.1 - tabpanel setActiveTab: Uncaught TypeError: c.isFocusable is not a function
- mybatis 处理数组类型及使用Json格式保存数据 JsonTypeHandler and ArrayTypeHandler
- js数组字符串转换
- 浏览器环境下JavaScript脚本加载与执行探析之代码执行顺序
- js中的this指针
- 4、CreateJS介绍-PreLoadJS
- JavaScript里的类和继承
- 3、CreateJS介绍-SoundJS
- js模拟连接a点击事件无效
- 2、CreateJS介绍-TweenJS
- 常用JS代码整理
- 1、CreateJS介绍-EaselJS
- CreateJS介绍-了解CreateJS
- 学习JavaScript设计模式之策略模式
- 登录验证码编写(jsp+servlet+dao)