一,定义:
对象是JavaScript的一个基本数据类型,是一种复合值,它将很多值(原始值或者其他对象)聚合在一起,可通过名字(name/作为属性名)访问这些值。即属性的无序集合。

关键是name属性名可以是什么类型,以下是一些测试(不完整):

 二,创建对象的方法

1.在{}内直接创建键值对,如上测试示例

2.使用实例化类的方法:new + Object()

let car = new Object(); //实际上,car.type的写法最终在后台自动转为car['type']执行的
car.type = 'Honda'; //等同于car['type'] = 'Honda'
car.color = 'white'; //等同于 car['color'] = 'white'
cat.seat = ; //等同于 cat['seat'] = 5
car.sayColor = function(){alert(this.color)}

由于1,2两种方法在使用同一接口创建多个对象时,会产生大量的重复代码,为此,有了工厂模式

3.工厂模式--函数返回的形式

function creaeCar(type,color,seat){
let obj = new Object();
obj.type = type;
obj.color = color;
obj.seat = seat;
obj.sayColor = function(){alert(this.color)}
return obj;
} let car01 = createCar('Honda','white',5);//instanceof 无法判断它是谁的实例,只能判断是对象 person1 instanceof Object //true

由于工厂模式没有解决对象的识别问题,检测到的都是object类型,不像是具体的Array,Date等类型,因此又出现了构造函数模式的创建方法。

4.构造函数模式

 function Car(type,color,seat){
this.type = type;
this.color = color;
this.seat = seat;
this.sayColor = function(){alert(this.color)}
} let car01 = Car('Honda','white',5); //此时car01 instanceof Car //true
console.log(Car.constructor);//返回创建此对象的数组,函数的引用

有上例可以看出工厂模式和构造函数模式的不同之处:

(1)没有显式地创建对象;(2)直接将属性和方法赋给了this对象;(3)没有return语句

实际上,调用构造函数的过程如下:

创建一个新对象==》将构造函数的作用域赋给新对象,即是将this指向这个新对象==》执行构造函数,为新对象添加属性==》自动返回新对象

不过构造函数也是有缺陷的,每个实例都包含不同的function实例,构造函数内的方法在做同一件事,但是实例化后却产生了不同的对象(方法sayColor是函数,函数也是对象)。

因此又产生了原型模式。

5.原型模式

function Car(){}

Car.prototype.type = 'Honda';  //相当于python中公共的类变量
Car.prototype.color = 'white';
Car.prototype.seat = 5;
Car.prototype.sayColor = function(){aleart(this.color)}; console.log(Car.prototype);//Object {type:'Honda',color:'white',seat:5} let car01 = new Car();
console.log(car01.type);//Honda
let car02 = new Car();
car02.color = 'red';
console.log(car02);//Car {color:'red'}
console.log(car02.prototype.color); //报错的
console.log(car02.type); // 显示的将会是原型默认的‘Honda'

原型模式的好处是所有实例共享它的属性和方法,即公共属性,可以设置私有属性值,如car02.color='red',只是针对实例car02,将覆盖原型对象上的同名属性(方法)。

6.混合模式(构造函数+原型模式

构造函数模式用于定义实例属性,原型模式用于定义方法和共享属性

function Car(type,color,seat){
this.type = type;
this.color = color;
this.seat = seat;
} Car.prototype = {
constructor: Car, //每个函数都有prototype属性,指向该函数原型对象,原型对象都有constructor属性,这是一个指向prototype属性所在函数的指针
sayColor: function(){
alert(this.color);
}
} let car01 = new Car("Honda",'white',5);
console.log(car01);
let car02 = new Car("BMW",'blue',2);
console.log(car02);

可以看出,混合模式共享着对相同方法的引用,又保证了每个实例有自己的私有属性。最大限度的节省了内存

https://www.cnblogs.com/libin-1/p/5911190.html

https://www.cnblogs.com/juggdxy/p/8245491.html

javescript 的 对象的更多相关文章

  1. JaveScript对象(JS知识点归纳七)

    1.JS中的对象表示的是一个具体的事物. a)静态的特征=>对象的属性 b)动态的行为=>对象的方法=>保存的值==>函数 2.对象的创建方式 a)构造函数的创建方式 ``` ...

  2. JaveScript内置对象(JS知识点归纳八)

    1)JS自身提供的方式 用于对数据进行简便的操作,根据方法可以操作的数据类型不同,形成了不同的对象--内置对象 2)数组 ​ a)基本操作方法--对数组进行修改 从数组最后进行操作 1)数组.push ...

  3. JaveScript基础(2)之数据类型转换和常用字符串的操作方法

    1.JaveScript数据类型转换: A.转字符串:通过"+"或toString(); PS:如果都是数值类型,'+'会进行求和运算,否则会做字符串连接: var s=2.5;d ...

  4. JaveScript基础(1)之变量和数据类型

    1.JaveScript变量的定义方式: A:隐式定义:直接给变量赋值: temp='hello'; alert(temp); PS:使用变量前要先进行初始化工作,否则会报变量未被定义的错误; B:显 ...

  5. 在纯JaveScript中实现报表导出:从“PDF”到“JPG”

    我们在前端报表中完成了各种工作数据的输入或内容处理之后,需要做什么? 数据的导出! 这些数据的常用导出格式有:PDF.Excel.HTML和图片几大类型. 但总有一些实际应用场景,需要的不仅仅是将现有 ...

  6. 如何一步一步用DDD设计一个电商网站(九)—— 小心陷入值对象持久化的坑

    阅读目录 前言 场景1的思考 场景2的思考 避坑方式 实践 结语 一.前言 在上一篇中(如何一步一步用DDD设计一个电商网站(八)—— 会员价的集成),有一行注释的代码: public interfa ...

  7. javascript中的Array对象 —— 数组的合并、转换、迭代、排序、堆栈

    Array 是javascript中经常用到的数据类型.javascript 的数组其他语言中数组的最大的区别是其每个数组项都可以保存任何类型的数据.本文主要讨论javascript中数组的声明.转换 ...

  8. 探究javascript对象和数组的异同,及函数变量缓存技巧

    javascript中最经典也最受非议的一句话就是:javascript中一切皆是对象.这篇重点要提到的,就是任何jser都不陌生的Object和Array. 有段时间曾经很诧异,到底两种数据类型用来 ...

  9. Asp.Net WebApi核心对象解析(下篇)

    在接着写Asp.Net WebApi核心对象解析(下篇)之前,还是一如既往的扯扯淡,元旦刚过,整个人还是处于晕的状态,一大早就来处理系统BUG,简直是坑爹(好在没让我元旦赶过来该BUG),队友挖的坑, ...

随机推荐

  1. django2-创建项目

    方式一:cmd或linux命令行下创建django项目(不常用,此处不做详细介绍) django-admin.py startproject autotest 方式二:使用pycharm专业版创建dj ...

  2. .NET Core 3.0之深入源码理解ObjectPool(二)

    写在前面 前文主要介绍了ObjectPool的一些理论基础,本文主要从源码角度理解Microsoft.Extensions.ObjectPool是如何实现的.下图为其三大核心组件图: 核心组件 Obj ...

  3. 如果有人问你 MySql 怎么存取 Emoji,把这篇文章扔给他

    01.前言 Emoji 在我们生活中真的是越来越常见了,几乎每次发消息的时候不带个 Emoji,总觉得少了点什么,似乎干巴巴的文字已经无法承载我们丰富的感情了.对于我们开发者来说,如何将 Emoji ...

  4. CodeForces - 1214D B2. Books Exchange (hard version)

    题目链接:http://codeforces.com/problemset/problem/1249/B2 思路:用并查集模拟链表,把关系串联起来,如果成环,则满足题意.之后再用并查集合并一个链,一个 ...

  5. calendar类-时间处理类

    calendar类 calendar类是时间处理类 比如在scala中 //字符串转化日期格式 val df = new SimpleDateFormat("yyyy-MM-dd hh:mm ...

  6. docker-compose下的java应用启动顺序两部曲之一:问题分析

    在docker-compose编排多个容器时,需要按实际情况控制各容器的启动顺序,本文是<docker-compose下的java应用启动顺序两部曲>的第一篇,文中会分析启动顺序的重要性, ...

  7. 命运Ⅰ&命运Ⅱ

    upd:为啥下面的相关博文都是各种退役记(这TM怎么就相关了) 竟然被卡线了,16名,我这几次考试也是炸到了一定境界了... 前三次模拟总榜rk1,第一次分机房rk4,第二次分机房rk11,第三次分机 ...

  8. MinIO 参数解析与限制

    MinIO 参数解析与限制 MinIO server 在默认情况下会将所有配置信息存到 ${HOME}/.minio/config.json 文件中. 以下部分提供每个字段的详细说明以及如何自定义它们 ...

  9. 给一个整数数组,找到两个数使得他们的和等于一个给定的数 target。

    描述 给一个整数数组,找到两个数使得他们的和等于一个给定的数 target. 你需要实现的函数twoSum需要返回这两个数的下标, 并且第一个下标小于第二个下标.注意这里下标的范围是 0 到 n-1. ...

  10. python——float()函数用法

    float()函数是python中一个比较常用的内建函数,我们要详细掌握它的使用方法,避免在编写代码的过程中错误使用. float()函数返回一个十进制浮点型数值(小数). float()括号内只能是 ...