铁人赛 Day25 -- JavaScript 初体验(三) -- 建构子

前言

初学JavaScript 的时後,意外看到这个东西,也就是建构子,虽然之前从来没听过,
但而我们在写程序的时候,常常会不知道到底要建立几个物件,这时候建构子就可以帮得上忙啦

范例

用一般函式定义一个人的名子

function createNewPerson(name) {
  var abc = {};
  abc.name = name;
  abc.greeting = function () {
    alert('Hi! I\'m ' + this.name + '.');
  }
  return abc;
}

每当要建立物件的话,又要建立新的空白物件再回传,是如此的麻烦

使用建构子

function Person(name) {
  this.name = name;
  this.greeting = function() {
    alert('Hi! I\'m ' + this.name + '.');
  };
}

不论何时建立了这里的任一物件实例,物件的「name」属性均同等於「传送至建构子呼叫的名称值」;
且 greeting() 函式也会使用相同「传送至建构子呼叫的名称值」。

注意: 建构子函式名称往往以大写字母起头,如此可方便你在程序码中找出建构子函式。

建立完整的建构子

一、完整程序码

function Person(first, last, age, gender, interests) {
  this.name = {
    first,
    last
  };
  this.age = age;
  this.gender = gender;
  this.interests = interests;
  this.bio = function() {
    alert(this.name.first + ' ' + this.name.last + ' is ' + this.age + ' years old. He likes ' + this.interests[0] + ' and ' + this.interests[1] + '.');
  };
  this.greeting = function() {
    alert('Hi! I\'m ' + this.name.first + '.');
  };
};

二、再复制贴上下列程序码,就可以顺利的建立物件实例

var person1 = new Person('Mark', 'Smith', 25, 'male', ['music', 'skiing']);

这样我们简单的建构子范例就完成啦,明天再来看看还有哪些东西可以学
我们铁人赛Day26见罗!!


<<:  CSS微动画 - 不知道要吃什麽?Slot帮你选吧

>>:  D15 - 用 Swift 和公开资讯,打造投资理财的 Apps { 加权指数K线图实作.3 - 使用 Charts 实作 K 线图 }

[Day11] Let's Post!

虽然在 Day08 时已经新增过一篇文章,但因为是测试用的关系并没有深入,今天就让深入聊聊产出一篇文...

【从零开始的 C 语言笔记】第八篇-printf 介绍与应用

不怎麽重要的前言 上一篇我们介绍了与输入输出格式相关的语法,想必大家应该多少知道要怎麽使用了,如果有...

Day01-系列文介绍、规划

前言 大家好我是 Andy,在休息一次的铁人赛後这次又想不开的来报名了XD 有些读者在看我以前写的文...

Day 18 Docker Compose 简介和安装

实务上,一个服务往往可以拆解成数个微服务组成。以市占相当高的 Wordpress 内容管理系统 CM...

.NET Core第13天_View常见操作_Layout布局页_PartialView部分检视_强类型视图(大量资料或物件的传递)

_Layout布局(版面配置)页 预设当我们新建好.net5 mvc专案後 比方今天新增一个空的Ra...