稳扎稳打JS——“对象”

一切皆“对象”

  • JS中一切皆“对象”
  • “对象”是属性的集合,而属性又是对象。既然属性又是对象,那么一个对象的属性也可以拥有属性,如:
//定义一个函数getName
var getName = function(){
    return "chaiMaoMao";
}

//由于一切皆对象,故getName也为对象,故可以给它添加属性,属性可以是任何类型
getName.value = "lalala";
getName.toString = function(){
    //……
}
  • JS中的“对象”只有属性,属性是一组键值对,键表示属性的名字,值表示属性值,属性值可以是任何JS类型(String、Number、Boolean、Object、Array、Function)
  • JS是“基于对象”语言,这意味着它并不是面向对象语言,它没有对象,但可以使用JS的特性模拟面向对象。
  • JQuery中的$其实是是一个函数,我们常看到的$(“#id”)其实是调用函数$,并传递参数 “#id”。
  • JQuery为函数还定义了一些属性,如还定义了一些属性,如.trim();

对象都是由函数创建的

  • JS中所有对象都由函数创建
//通过构造函数创建对象
var person = new Person();
//使用JSON创建对象
var person = {
    name : "chaiMaoMao",
    age : 12
}

//JSON创建对象是一种语法糖,该过程相当于
var person = new Object();
person.name = "chaiMaoMao";
person.age = 12;
//创建数组
var array = [1,2,3,4];

//该过程实则为:
var array = new Array(1,2,3,4);
//定义一个数字
var a = 3;

//该过程实则为:
var a = new Number(3);
//定义一个函数
var getName = function(){
    //……
}

//该过程实则为:
var getName = new Function();

由此可见,所有对象都是由函数创建的!


每个函数都有prototype属性

  • prototype属性用于存储函数的属性集合。
  • 初始情况下,一个函数的prototype属性中只含有一个constructor对象,指向函数本身。
  • 存储在函数中的属性值和存储在函数prototype属性中的属性值均能访问,并且访问方式相同,如下:
//定义一个函数Person(属性值存储在函数中)
var Person = function(){
    //……
}
Person.name = "chaimm";
Person.getName = function(){
    //……
}

//访问函数中的属性
var p = new Person();
p.name;
p.getName();
//定义一个函数Perosn(属性值存储在函数的prototype属性中)
var Person = function(){
    //……
}
Person.prototype.name = "chaimm";
Person.prototype.getName = function(){
    //……
}

//访问函数prototype中的属性
var p = new Person();
p.name;
p.getName();

由此可见,访问存储在函数prototype中的属性和访问存储在函数中的属性的方式是一样的。 虽然访问方式一样,但两者存在巨大的差别。

  • 当通过函数创建对象时,对象所有的属性值将会被复制给新的对象。但由于prototype是一个引用类型的变量,存储的是对象的地址,因此prototype中的所有属性值将会被该函数创建的所有对象共享,若一个对象修改了prototype中的某个属性,那所有对象prototype属性都会发生修改。 因此,prototype属性适合存储不变的属性,如函数;函数的普通属性适合存储基本类型类型的属性;而对象无论存储在哪里效果都一样。
  • 此外,将函数存储在prototype中可以达到节约内存的功效,不论创建多少对象,该对象的函数在内存中只有一份。但若将函数存在构造函数的属性中,那么每次new一个对象,都会拷贝一份函数体,从而造成浪费。

所有对象都有proto属性

  • 所有对象都有私有属性proto,它指向创建该对象的构造函数的prototype属性。
  • JS中所有属性都是共有的,但有个约定,若属性两端加上“_”,表示该属性不希望调用者使用,相当于是“私有属性”。
  • 通过Object创建的对象的proto属性指向Object.prototype
var p = new Object();
  • 通过构造函数创建的对象的proto属性指向该函数的prototype属性
var p = new Person();
  • 所有的函数均由Function创建,因此函数的proto属性指向Function.prototype。
  • Function.prototype._proto_ === Object.prototype Function.prototype本身也是个对象,它的_proto_属性指向Object.prototype。
  • Object._proto_ === Function.prototype Object是一个构造函数,既然是函数,那么它的_proto_指向Function.prototype
  • Objecet.prototype._proto_ === NULL
  • Function._proto_ === Function.prototype Function的_proto_指向创建Function的函数的prototype,Function由它自己创建。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏java一日一条

JavaScript 中 this 的使用技巧总结

在 js 中,this 这个上下文总是变化莫测,很多时候出现 bug 总是一头雾水,其实,只要分清楚不同的情况下如何执行就 ok 了。

493
来自专栏青枫的专栏

java中,方法参数是基本类型和引用类型的区别

当参数是基本类型时,在调用方法时将值传递到方法中,运行方法,运行结束方法退出,对原本main中定义的变量没有任何操作(方法中没有return)。即:此时只跟栈有...

622
来自专栏weixuqin 的专栏

java 复习总结

类采用首字母大写的方式来命名,如果是多个单词的类名,则每个单词首字母都大写,例如:HelloWorld 。

712
来自专栏Micro_awake web

JavaScript OOP(二):this关键字以及call、apply、bind

JavaScript的this关键字非常灵活! this 返回的总是对象;即返回属性或方法“当前”所在的对象 1 var o1={ 2 name:'...

1775
来自专栏测试开发架构之路

C++之类和对象的使用(二)

析构函数 析构函数的作用并不是删除对象,而是在撤销对象占用的内存之前完成一系列清理工作,使这部分内存可以被程序分配给新对象使用。对象生命周期结束,程序就自动执...

2697
来自专栏Python攻城狮

python高级编程1.==,is的使用 2.深拷贝、浅拷贝 3.属性property

@property成为属性函数,可以对属性赋值时做必要的检查,并保证代码的清晰短小,主要有2个作用

742
来自专栏Java后端技术

java中带继承类的加载顺序详解及实战

  在面试中,在java基础方面,类的加载顺序经常被问及,很多时候我们是搞不清楚到底类的加载顺序是怎么样的,那么今天我们就来看看带有继承的类的加载顺序到底是怎么...

692
来自专栏技术专栏

Python3入门与实践(四): 面向对象

==当通过 student.name获取变量值的时候,首先会查找实例变量里有没有name属性,如果有则返回,如果没有就会去类变量里找,如果还是没有则会报错==

672
来自专栏跟着阿笨一起玩NET

c#类的初始化顺序

本文转载:http://www.cnblogs.com/ybhcolin/archive/2010/09/24/1834219.html

614
来自专栏专注 Java 基础分享

java基础之继承(一)

虽然说java中的面向对象的概念不多,但是具体的细节还是值得大家学习研究,java中的继承实际上就是子类拥有父类所有的内容(除私有信息外),并对其进行扩展。下面...

1808

扫码关注云+社区