没有合适的资源?快使用搜索试试~ 我知道了~
javascript本身,是没有类的概念的,只有对象的概念,除了基本类型(string,number,boolean,null,undefined)外,其余均是对象,就连function也是对象.那么,什么是对象?!javascript中的对象,类似于一组键值对的集合.你甚至可以以键值对的方式来操作javascript中的对象,就像这样:跟这种方式创建对象的效果是一样的:显然,第二种访问方式更加方便.通常只有在并不确定我们访问的对象的属性名字的时候(比如json数据),才会使用这种方式访问.当然,如果你想起一个类似"helloworld"(有空格)这样奇葩的属性名字,那你就必须使用键值对的方式
资源推荐
资源详情
资源评论
javascript创建对象创建对象—类,继承类,继承
1.什么是对象?
javascript本身,是没有类的概念的,只有对象的概念,除了基本类型(string,number,boolean,null,undefined)外,其余均是对象,就
连function也是对象.
那么,什么是对象?!javascript中的对象,类似于一组键值对的集合.你甚至可以以键值对的方式来操作javascript中的对象,就像这
样:
var myDog= new Object();
myDog["name"] = "Odie";
myDog["color"] = "Yellow";
console.log(myDog ["name"] );
console.log(myDog ["color"] );
跟这种方式创建对象的效果是一样的:
var myDog = new Object();
myDog .name = "Odie";
myDog .color = "Yellow";
console.log(myDog.name );
console.log(myDog.color );
显然,第二种访问方式更加方便.通常只有在并不确定我们访问的对象的属性名字的时候(比如json数据),才会使用这种方式访
问.当然,如果你想起一个类似"hello world"(有空格)这样奇葩的属性名字,那你就必须使用键值对的方式创建对象啦.
2.如何创建对象?
exampleA:
//字面量方式创建对象,简单方便,可以认为,这是exampleB方式的简写
var myDog= {name: "Odie", color: "Yellow"};
exampleB:
//使用new操作符创建对象,再追加属性
var myDog= new Object();
myDog.name = "Odie";
myDog.color = "Yellow";
在js中,如果你赋值操作的属性没有,就会创建一个,1话题中就已经用过这种方式了.exampleA中自然也可以这样继续追加属性,A
和B最大的区别在于创建对象的方式(主要区别在第一行),而不在于追加属性上.值得注意是只有在赋值操作时,才会这样,你
做一个访问的操作,它自然是不会创建的(记住这一点,在后面的话题中很重要).
简单验证一下:
var myDog= {name: "Odie", color: "Yellow"};
console.log(myDog.age);//undefined
for(var pro in myDog){console.log(pro);}//name,color,没有age
exampleC:
//一个很少使用的方式
var myDog= Object.create(new Object());
myDog.name = "Odie";
myDog.color = "Yellow";
这种方式着实很少用,它有什么用途在这里不好讲,留到后面吧.
其实A、B、C三种方式创建对象还是有差别的,在这里也不好说,也留在后面吧.
exampleD:
//如果是简单的对象,似乎exampleA是最方便的,
但当你要创建复杂的对象,亦或是大量类似的对象时,就应当考虑下面这个方法了.
function Dog(name, color) {
this.name = name;
this.color = color;
}
var myDog= new Dog("Odie", "Yellow");
等等,为什么new了一个function呢?!学过其他OO语言的人都会觉的怪怪的.之前说过,javascript根本就没有类这个概念,我们输出
一下浏览器内置的Object和Date:
console.log(Object);
console.log(Date);
在chrome中的结果:
function Object() { [native code] }
function Date() { [native code] }
真相了,Object和Date也不是所谓的类,而是function!在javascript中,就是使用"new function(参数)"这种方式创建对象的.我们称
这种function为构造函数,exampleB和exampleD是同一种方式,只是在exampleD中,使用了自己定义的构造函数.
那么在 "new 构造函数(参数)" 的过程中,都发生了什么呢?!
1.创建一个新对象//对象的隐性引用"__proto__"指向构造函数的"prototype"(先忽略后面这半句);
2.将构造函数的 "this" 指向新对象;
3.执行构造函数(初始化,向新对象添加属性);
4.返回这个对象.
经过以上步骤,一个新的对象就创建出来了.
构造函数与其他函数有什么区别么?!
唯一区别是你在调用构造函数上需要使用new关键字,但在语法上并没有区别,所有的函数都有prototype和this引用,构造函数只
是定义的时候通常首字母大写,调用的时候记得使用new关键字,但这都靠自觉,javascript本身没有语法强制规定什么样的函数才
是构造函数.你不用new关键字调用构造函数(非strict mode)亦或你new一个普通的函数也不会报错,当然,结果自然不是你想
要的(后面会讲会发生什么).
this是什么东西?!
this是function内部的一个引用,跟其他OO语言类似,它指向函数据以执行的对象.所有的函数都有这么一个引用.
什么叫据以执行的对象?!
不太好形容这个东西,大概可以理解为,这个函数运行在哪个对象之下(还是不大好理解),直接举例吧.
//输出自己的this
function log_this() {
console.log(this);
}
//初始化
window.onload = function() {
//example_one
log_division("example_one");
log_this();//window对象
//example_two假设你有一个btn按钮
document.getElementById("btn").onclick = log_this;//点击-->dom对象
//example_three
log_division("example_three");
var temp = {};//exampleA中创建对象的方法哦
temp.logThis = log_this;
//function也是对象,可以这么给对象添加function属性,上面那个onclick监听回调函数的原理,跟这个类似
temp.logThis();//Object
}
这回好理解了吧,this指向哪里,是根据运行环境有关的,this指向它的运行环境对象,one例子当中,它就指向了window,two中就指
向了dom对象,three中就指向了自定义对象.因此,如果你不用new调用构造函数,就会将属性添加到window上.//题外话,在strict
mode下,这么做会报错的.
剩余7页未读,继续阅读
资源评论
weixin_38737213
- 粉丝: 1
- 资源: 977
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功