Javascript中创建函数的几种方法

Stella981
• 阅读 780
// 工厂函数模式
// 无法解决对象识别问题
function person0(name, age, job) {
  var obj = new Object();
  obj.name = name;
  obj.age = age;
  obj.job = job;
  return obj;
}
// ---------------------------------------------------
// 构造函数模式
function Person(name, age, job) {
  this.name = name;
  this.age = age;
  this.job = job;
  // 这个方法实例化时,会创建两次
  this.sayName = function() {
    alert(this.name);
  };
}

const person1 = new Person("test1", 19, "pig");
const person2 = new Person("test2", 19, "dog");

// ---------------------------------------------------
// 原型模式
// 初始化时无法自定义属性
function Person1() {}
Person1.prototype.name = "looyulong";
Person1.prototype.age = age;
Person1.prototype.job = job;
Person1.sayName = function() {
  alert(this.name);
};
// ---------------------------------------------------
// 组合构造函数模式
// 构造函数定义属性,原型模式定义方法
function Per(name, age, job) {
  this.name = name;
  this.age = age;
  this.job = job;
}

Per.prototype = {
  constructor: Per,
  sayName: function() {
    alert(this.name);
  }
};

const per1 = new Per("test1", 19, "pig");
const per2 = new Per("test2", 19, "dog");

// ---------------------------------------------------
// 动态构造模式
// 就是加了一个判断,判断原型上面是否有对应的方法
function Person2(name, age, job) {
  this.name = name;
  this.age = age;
  this.job = job;
  if (typeof this.sayName !== "function") {
    Person2.prototype.sayName = function() {
      alert(this.name);
    };
  }
}

// ---------------------------------------------------
// 寄生构造函数模式
// 在构造函数的内部返回一个对象,也就是new的时候返回一个对象
// 与工厂函数其实没有很大区别,只是在写法上,工厂函数创建对象需要执行一个函数
// 通过这种模式,可以达到和工厂函数相同的效果,但是却是用new操作符调用的
function Person3(name, age, job) {
  var obj = new Object();
  obj.name = name;
  obj.age = age;
  obj.job = job;
  obj.sayName = function() {
    alert(this.name);
    alert(obj.name);
  };
  return obj;
}

// ---------------------------------------------------
// 稳妥构造函数模式
// 没有公共属性,没有公共属性,不用this
// 因为有些环境无法是用this和new
function Person4(name, age, job) {
  var obj = new Object();
  obj.getName = function() {
    return name;
  };
  obj.getAge = function() {
    return age;
  };
  obj.getJob = function() {
    return job;
  };
  obj.sayName = function() {
    alert(name);
  };
  return obj;
}
点赞
收藏
评论区
推荐文章
待兔 待兔
4个月前
手写Java HashMap源码
HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程22
小嫌 小嫌
3年前
js中箭头函数在对象内部的继承
function函数functionPerson()this.name'Jack',this.age25,this.sayNamefunction()console.log(this.name)functioninner()console.log(this.n
Stella981 Stella981
3年前
List的Select 和Select().tolist()
List<PersondelpnewList<Person{newPerson{Id1,Name"小明1",Age11,Sign0},newPerson{Id2,Name"小明2",Age12,
Stella981 Stella981
3年前
JavaScript 对象和包装类
对象的创建方法{}varobj{}系统自带的构造函数varobjnewObject()//Array()//Number()自定义的构造函数functionPerson(){}varperson1newPe
Stella981 Stella981
3年前
Lua基础(对象)
:和.区别.   stu{id100,name"Tom",age21}成员变量   function stu.toString()成员函数    return stu.id .. stu.name .. stu.age   endprint(stu
Stella981 Stella981
3年前
JavaScript Prototype
定义和用法prototype属性使您有能力向对象添加属性和方法。实例在本例中,将展示如何使用prototype属性来向对象添加属性:<scripttype"text/javascript"functionemployee(name,job,born){this.n
Stella981 Stella981
3年前
JS 对象数组Array 根据对象object key的值排序sort,很风骚哦
有个js对象数组varary\{id:1,name:"b"},{id:2,name:"b"}\需求是根据name或者id的值来排序,这里有个风骚的函数函数定义:function keysrt(key,desc) {  return function(a,b){    return desc ? ~~(ak
Wesley13 Wesley13
3年前
ES6 简单整理
1.变量声明let和constlet与const都是块级作用域,letfunctionname(){letage12;//age只在name()函数中存在}constconstname'tom'name'jack'//
Stella981 Stella981
3年前
JS 中的this指向问题和call、apply、bind的区别
this的指向问题一般情况下this对象指向调用函数的对象,全局环境中执行函数this对象指向window。functiona(){console.log(this);//输出函数a中的this对象}functionb(){};varc{name:"call"}
Wesley13 Wesley13
3年前
JS创建对象模式7种方法详解
创建对象的几种模式虽然Object构造函数或者字面量,都可以用来创建对象,但这些方式有明显的缺点:使用同一个接口创建很多对象,会产生大量的代码,于是,工厂模式诞生了1工厂模式工厂模式是广为人知的设计模式,抽象了创建具体对象的过程。在ES6的Class创建类之前,是无法创建类的,开发人员就发明了一种函数,用函数来封