文章地址: https://www.cnblogs.com/sandraryan/

创建对象

创建对象的三种方式

构造函数 ,是一种特殊的方法。主要用来在创建对象时初始化对象

1. 调用系统的构造函数创建对象(又称为实例化一个对象)

  var obj = new Object();
  // 添加属性,方法
obj.name = 'jack';
obj.age = 20;
obj.eat = function(){
//匿名函数
console.log('hi');
}
  // 调用属性/方法
console.log(obj.name);
obj.eat();

2. 自定义构造函数创建对象和工厂模式(不同)

构造函数首字母大写(区分构造函数和普通函数的人为规定)

对象是一个特定事物的属性和方法的集合,构造函数是类似于一大类的集合(js中没有类的概念)

利用一个构造函数创建对象的过程称为实例化一个对象

  // 一个人的类型
var person = new Object();
person.name = 'lucy';
person.age = 20;
person.sayHi = function(){
console.log('person ' + person.name);
console.log('person ' + this.name); } // 一个学生的类型
var stu = new Object();
stu.name = 'sunny';
stu.age = 18;
stu.task = function(){
console.log('study ' + stu.name);
console.log('study ' + this.name);
}
// 在当前对象的方法中可以访问当前对象的属性,可用this指代 // 调用各自的属性
// 调用各自的方法 person.sayHi();
stu.task();
//判断person是否是一个对象,不能判断是那个对象(person还是stu)
console.log(person instanceof Object);
创建对象的代码封装在一个函数中,可以一次性创建多个对象
构造函数创建对象
 function Person(name,age) {
this.name=name;
this.age=age;
this.sayHi=function () {
console.log("您好");
};
}
//创建对象---->实例化一个对象,的同时对属性进行初始化 需要new关键字
var per=new Person("小红",20);
工厂模式创建对象
    // 工厂模式创建对象
function createObject(name,age){
// 创建对象
var obj = new Object();
// 对象添加属性
obj.name = name;
obj.age = age;
// 对象添加方法
obj.sayHi = function(){
console.log('hi');
};
return obj;
}
var per1 = createObject('mary',10);
console.log(per1); var per2 = createObject('jack',20);
console.log(per2);
  //new 用于创建空对象并使this指向当前对象

   // 方法也可以传递不同的值
function createObject(name,age){
var obj = new Object();
obj.name = name;
obj.age = age;
obj.sayHi = function(word){
console.log(word);
};
return obj;
}
var per1 = createObject('mary',10);
per1.word = 'hello';
console.log(per1); var per2 = createObject('jack',20);
per2.word = 'hi';
console.log(per2);

共同点:都是函数,都可以创建对象,都可以传入参数

工厂模式:

函数名是小写

有new,

有返回值

new之后的对象是当前的对象

直接调用函数就可以创建对象

自定义构造函数:

函数名是大写(首字母)

没有new

没有返回值

this是当前的对象

通过new的方式来创建对象

3. 字面量方式

 var Dog = {
name: 'jack',
age: 2,
eat: function(){
console.log('eating');
}
} Dog.eat();
console.log(Dog);
 // 创建一个叫dog的对象,添加名字/年龄/颜色的属性,行走和吃东西的方法

构造函数可以实例化对象

构造函数中有一个属性叫prototype,是构造函数的原型对象

构造函数的原型对象(prototype)中有一个constructor构造器,这个构造器指向的就是自己所在的原型对象所在的构造函数

实例对象的原型对象(__proto__)指向的是该构造函数的原型对象

构造函数的原型对象(prototype)中的方法是可以被实例对象直接访问的

js创建对象的三种方式和js工厂模式创建对象的更多相关文章

  1. js创建对象的三种方式

    <script> //创建对象的三种方式 // 1.利用对象字面量(传说中的大括号)创建对象 var obj1 = { uname: 'ash', age: 18, sex: " ...

  2. spring入门:beans.xml不提示、别名、创建对象的三种方式

    spring的版本是2.5 一.beans.xml文件不提示 Location:spring-framework-2.5.6.SEC01\dist\resources\spring-beans-2.5 ...

  3. Spring笔记03(Spring创建对象的三种方式)

    1.创建对象的三种方式和bean的生命周期的验证: Animal接口代码: package cn.pb.dao; /** * 动物接口 */ public interface Animal { //吃 ...

  4. Spring创建对象的三种方式以及创建时间

    创建对象的三种方式: 1.采用默认的构造函数创建 2.采用静态工厂方法 1.写一个静态工厂方法类 public class HelloWorldFactory { public static Hell ...

  5. JavaScript中创建对象的三种方式!

    JavaScript中创建对象的三种方式! 第一种 利用对象字面量! // 创建对象的三种方式! // 1 对象字面量. var obj = { // 对象的属性和方法! name: 'lvhang' ...

  6. Spark部署三种方式介绍:YARN模式、Standalone模式、HA模式

    参考自:Spark部署三种方式介绍:YARN模式.Standalone模式.HA模式http://www.aboutyun.com/forum.php?mod=viewthread&tid=7 ...

  7. js 函数定义三种方式

    <p>Js 函数定义的三种方式:</p> <br> <p>方式一:function</p> <script type="te ...

  8. JavaScript 基础——使用js的三种方式,js中的变量,js中的输出语句,js中的运算符;js中的分支结构

    JavaScript 1.是什么:基于浏览器 基于(面向)对象 事件驱动 脚本语言 2.作用:表单验证,减轻服务器压力 添加野面动画效果 动态更改页面内容 Ajax网络请求 () 3.组成部分:ECM ...

  9. C++创建对象的三种方式

    C++在创建对象的时候,有三种方式: #include <iostream> using namespace std; class A { private: int n; public: ...

随机推荐

  1. iview 中table列 一列显示多个数据(后台返回数组显示在列内)

    一.首先出现的是比较复杂的一种情况(多个key) 1.首先页面显示效果如下 2.后台返回数据格式如下: 3.在iview中table的columns中的render函数: 4.具体代码 render: ...

  2. OpenLayers使用点要素作为标记

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head ...

  3. SpringBoot 使用 @Value 从 YAML文件读取属性

    在 YAML中有如下配置 paypal: mode:live 在类中,通过 @Value属性读取 @Value("${paypal.mode}") private String m ...

  4. [Vue CLI 3] 配置解析之 indexPath

    在 vue.config.js 配置中有一个 indexPath 的配置,我们先看看它有什么用? 用来指定 index.html 最终生成的路径(相对于 outputDir) 先看看它的默认值:在文件 ...

  5. 【水滴石穿】ReactNativeMobxFrame

    项目地址如下:https://github.com/FTD-ZF/ReactNativeMobxFrame 应该可以说的是,项目也只是一个花架子,不过底部的tab稍微改变了 我们一起来看代码 //in ...

  6. phpcms推送文章同时推送自定义字段

    首先进入phpcms后台,模型管理-字段管理里,新建字段,新建字段必须是主表字段,如图所示 2 来到网站根目录,寻找phpcms\modules\content\classes\push_api.cl ...

  7. Linux 内存管理之mmap详解

    找了好多,最后发现下面这篇时讲的比较通俗易懂的. Linux内存管理之mmap详解-heavent2010-ChinaUnix博客 http://blog.chinaunix.net/uid-2666 ...

  8. List分页

    listObj.Skip((pagecount-1)*pagesize).Take(pagesize) 假设你每页10条数据当前是第3页 跳到第4页则:listObj.Skip((4-1)*10).T ...

  9. man命令及help命令

    一.man命令 man命令常用工具命令 man命令是Linux下的帮助指令,通过man指令可以查看Linux中的指令帮助.配置文件帮助和编程帮助等信息. 语法: man(选项)(参数) 选项: -a: ...

  10. Directx11教程(13) D3D11管线(1)

    原文:Directx11教程(13) D3D11管线(1)       从本篇教程开始,我们暂停代码的学习,先来了解一下D3D11的管线,这些管线不涉及具体的硬件,而是着重于理解能够支持D3D11的管 ...