javascript - js 关于面向对象写法问题？？-PHP中文网问答

js 面向对象的写法：

// 第一种写法： 
// 也是我通常的写法，不过我感觉这样的写法看上去太过于分散，不像一个整体，总感觉不优雅
function Person(){
  this._name = 'test';
  ...
}

Person.prototype = {
  sayHello: function(){
    console.log(this.name);
  }
}

// 第二种写法： 
// 前几天又看了别人写的关于实现 jquery 框架的写法，这种写法不知道有什么优势？？
// 我感觉就是 把 简单的 复杂化了 ...
// 看上去比较分散
var jQuery = function(selector , context){
   return new jQuery.fn.init(selector , context);
}
jQuery.fn = jQuery.prototype = {
  init: function(selector , context){
      // 这段看不太懂，应该是返回 实例的意思
      return this;
  }
  ....
}

jQuery.fn.init.prototype.init.prototype = jQuery.fn;

// 第三种写法： 
// 我感觉是最优雅的写法，不好的地方是在于成员变量共用，导致不支持并发使用...
// 构造函数可以通过 prototype 实现 实例化后的对象继承；这个无需实例化，该如何实现继承？？
var Tool = {
   name: 'test' , 
   sayName: function(){
     console.log(this.name);
   }
}

// 第四种写法：
// 看上去比较比较分散...
function Move(){
  this.name = 'test';
}

(function(fn){
  fn.sayName = function(){
     console.log(this.name);
  };
})(Move.prototype);

以上是我所知的js面相对象的写法，我非常想使用第三种写法，可我不知道怎么解决他存在的问题？？也麻烦大家对比下这几种写法的优劣。

核心的还是，如何使第三种写法成为通用写法（我打算以后就用这种写法，若是能够解决它存在的问题的话）？？

function Factory(){ var Tool = { name: 'test' , sayName: function(){ console.log(this.name); } } return Tool; } // 实例化 var example = Factory(); //当然一般来说Factory会有参数传递，用于内部添加内部对象的属性

全部回复(4)

伊谢尔伦2017-04-11 12:41:42 4楼

你要是嫌原型和构造函数分开写这种写法分散，看着不爽，你可以试试ES6的class语法，虽然class使用起来不够灵活，而且本质上也只是语法糖而已，不过看起来是要紧凑许多。
```
class Person{
    constructor() {
        this._name = 'test';
        ...
    }
    
    sayHello(){
        console.log(this.name);
    }
}
```
jq的这种写法原因其实很简单，为了省略一个new。创建类的实例，从来都是var test = new Person()这样的。但是你在使用jq的时候肯定没有这么写过吧var test = new $("#id")。jq的这种看起来比较复杂的写法就是为了省掉前面那个new。
字面量创建对象挺好的，但是不能直接继承，而且如果你想构造的类逻辑很复杂怎么办？字面量创建可都是一对一的属性赋值，不能像普通构造函数那样运行复杂逻辑。
这么奇怪的写法没见过。立即运行函数毫无疑问是为了隐藏内部变量，这么写毫无意义。
你所谓的“紧凑”、“分散”，我敢打赌肯定是你想在编辑器里面把一个类折叠成一行…………说真的，这类强迫症是病，得治。

赞 +0

添加回复

PHP中文网2017-04-11 12:41:42 3楼

可以去查一下红宝书的第六章

巴扎黑2017-04-11 12:41:42 2楼

第三种叫工厂模式，需要加一些东西：

天蓬老师2017-04-11 12:41:42 1楼

the good part of javascript