ای سی ایم اسکریپت کلاس یا آئی اینڈی تعریف

使用预定义对象只是面向对象语言的能力的一部分，它真正强大之处在于能够创建自己专用的类和对象。

ECMAScript 拥有很多创建对象或类的方法。

工厂方式

原始的方式

因为对象的属性可以在对象创建后动态定义，所有许多开发者都在 JavaScript 最初引入时编写类似下面的代码：

var oCar = new Object;
oCar.color = "blue";
oCar.doors = 4;
oCar.mpg = 25;
oCar.showColor = function() {
  alert(this.color);
};

TIY

在上面的代码中，创建对象 car。然后给它设置几个属性：它的颜色是蓝色，有四个门，每加仑油可以跑 25 英里。最后一个属性实际上是指向函数的指针，意味着该属性是个方法。执行这代码后，就可以使用对象 car。

ਪਰ ਇਥੇ ਇੱਕ ਸਮੱਸਿਆ ਹੈ ਕਿ ਕਈ ਵਾਰ ਕਰਕੇ car ਦੇ ਇੰਸਟੈਂਸਾਂ ਨੂੰ ਬਣਾਉਣੀ ਪੈਂਦੀ ਹੈ。

ਸਮਾਧਾਨ: ਫੈਕਟਰੀ ਤਰੀਕਾ

ਇਸ ਸਮੱਸਿਆ ਨੂੰ ਹੱਲ ਕਰਨ ਲਈ, ਵਿਕਾਸਕਾਰ ਨੇ ਫੈਕਟਰੀ ਫੰਕਸ਼ਨ ਦੀ ਰਚਨਾ ਕੀਤੀ ਹੈ ਜੋ ਕਿ ਵਿਸ਼ੇਸ਼ ਪ੍ਰਕਾਰ ਦੇ ਆਬਜੈਕਟ ਨੂੰ ਬਣਾਉਣ ਅਤੇ ਵਾਪਸ ਦੇਣ ਵਿੱਚ ਸਮਰੱਥ ਹੈ (factory function).

ਉਦਾਹਰਣ ਵਜੋਂ, createCar() ਫੰਕਸ਼ਨ ਨੂੰ ਇਸ ਤਰ੍ਹਾਂ ਦੇ ਕੰਮਾਂ ਨੂੰ ਸ਼ਾਮਲ ਕਰਨ ਵਿੱਚ ਵਰਤਿਆ ਜਾ ਸਕਦਾ ਹੈ:

function createCar() {
  var oTempCar = new Object;
  oTempCar.color = "blue";
  oTempCar.doors = 4;
  oTempCar.mpg = 25;
  oTempCar.showColor = function() {
    alert(this.color);
  };
  return oTempCar;
}
var oCar1 = createCar();
var oCar2 = createCar();

TIY

ਇੱਥੇ, ਪਹਿਲੇ ਉਦਾਹਰਣ ਵਿੱਚ ਸਾਰੀ ਸਕ੍ਰਿਪਟ createCar() ਫੰਕਸ਼ਨ ਵਿੱਚ ਹੀ ਹੈ। ਇਸ ਤੋਂ ਇਲਾਵਾ ਇੱਕ ਅਸਾਮਾਨ ਸਕ੍ਰਿਪਟ ਹੈ, ਜੋ ਕਿ car ਆਬਜੈਕਟ ਨੂੰ ਫੰਕਸ਼ਨ ਵਜੋਂ ਵਾਪਸ ਦਿੰਦੀ ਹੈ (oTempCar)। ਇਸ ਫੰਕਸ਼ਨ ਨੂੰ ਬੁਲਾਉਣ ਨਾਲ ਨਵਾਂ ਆਬਜੈਕਟ ਬਣਾਇਆ ਜਾਂਦਾ ਹੈ, ਜਿਸ ਨੂੰ ਸਾਰੇ ਜ਼ਰੂਰੀ ਅਕਾਰ ਦੇਣ ਦਾ ਕੰਮ ਕੀਤਾ ਜਾਂਦਾ ਹੈ ਅਤੇ ਇਸ ਤੋਂ ਇਲਾਵਾ ਇਹ ਪਹਿਲਾਂ ਦੇ ਉਦਾਹਰਣ ਵਿੱਚ ਦਿੱਤੇ ਗਏ car ਆਬਜੈਕਟ ਦਾ ਪਰਿਕਲਪਨ ਕਰਦਾ ਹੈ। ਇਸ ਤਰੀਕੇ ਨਾਲ, ਅਸੀਂ ਅਸਾਨੀ ਨਾਲ car ਆਬਜੈਕਟ ਦੀਆਂ ਦੋ ਸੰਸਕਰਣ (oCar1 ਅਤੇ oCar2) ਬਣਾ ਸਕਦੇ ਹਾਂ ਜਿਨ੍ਹਾਂ ਦੇ ਅਕਾਰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਮਿਲਦੇ ਹਨ。

ਫੰਕਸ਼ਨ ਨੂੰ ਪੈਰਾਮੀਟਰ ਦੇ ਦੇਣ

ਅਸੀਂ createCar() ਫੰਕਸ਼ਨ ਨੂੰ ਸੁਧਾਰ ਸਕਦੇ ਹਾਂ, ਉਸ ਨੂੰ ਵੱਖ-ਵੱਖ ਅਕਾਰਾਂ ਦੇ ਮੂਲ ਮੁੱਲ ਦੇਣ ਦੀ ਸਮਰੱਥਾ ਦੇ ਕੇ ਨਹੀਂ ਸਿਰਫ਼ ਅਕਾਰਾਂ ਦੇ ਮੂਲ ਮੁੱਲ ਦੇਣ ਦੀ ਸਮਰੱਥਾ ਦੇ ਕੇ:

function createCar(sColor,iDoors,iMpg) {
  var oTempCar = new Object;
  oTempCar.color = sColor;
  oTempCar.doors = iDoors;
  oTempCar.mpg = iMpg;
  oTempCar.showColor = function() {
    alert(this.color);
  };
  return oTempCar;
}
var oCar1 = createCar("red",4,23);
var oCar2 = createCar("blue",3,25);
oCar1.showColor();		//ਬਿਨਾਂ ਸਿੰਗਲ ਕੋਡ ਦੇ ਪ੍ਰਕਾਸ਼
oCar2.showColor();		//ਬਿਨਾਂ ਸਿੰਗਲ ਕੋਡ ਦੇ ਪ੍ਰਕਾਸ਼

TIY

createCar() ਫੰਕਸ਼ਨ ਨੂੰ ਪੈਰਾਮੀਟਰ ਦੇ ਦੇਣ ਨਾਲ, ਕਰਕੇ ਬਣਾਏ ਗਏ car ਆਬਜੈਕਟ ਦੇ color, doors ਅਤੇ mpg ਅਕਾਰਾਂ ਨੂੰ ਮੁੱਲ ਦੇਣ ਸੰਭਵ ਹੁੰਦਾ ਹੈ। ਇਹ ਇਹ ਅਕਾਰਾਂ ਦੀ ਇੱਕ ਸੰਸਕਰਣ ਨੂੰ ਬਣਾਉਣ ਦੀ ਸਮਰੱਥਾ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ ਜੋ ਦੋਵੇਂ ਆਬਜੈਕਟ ਇੱਕ ਹੀ ਅਕਾਰ ਰੱਖਦੇ ਹਨ, ਪਰ ਉਨ੍ਹਾਂ ਦੇ ਮੁੱਲ ਅਲੱਗ ਹਨ。

ਫੈਕਟਰੀ ਫੰਕਸ਼ਨ ਬਾਹਰ ਆਬਜੈਕਟ ਦੇ ਤਰੀਕੇ ਨਿਰਧਾਰਿਤ ਕਰਨਾ

ਮੌਜੂਦਾ ਐਕਸਮਾਸਕ੍ਰਿਪਟ ਵਧੇਰੇ ਰਸਮੀ ਹੋ ਰਿਹਾ ਹੈ, ਪਰ ਆਬਜੈਕਟ ਬਣਾਉਣ ਦੇ ਤਰੀਕੇ ਨੂੰ ਅਣਦੇਖਿਆ ਗਿਆ ਹੈ ਅਤੇ ਇਸ ਦੀ ਰਸਮੀਕਰਨ ਅਜੇ ਵੀ ਕਿਸੇ ਨੂੰ ਖਿੜਕੀ ਲਗਾ ਰਿਹਾ ਹੈ। ਇਸ ਵਿੱਚੋਂ ਕੁਝ ਵਿਆਕਰਣਕ ਕਾਰਣਾਂ ਹਨ (ਇਹ ਨਾਲ ਕਿਉਂ ਨਹੀਂ ਲਗਦਾ ਕਿ ਇਹ new ਕੰਮੋਲੇਡਰ ਨਾਲ ਬਣਾਇਆ ਗਿਆ ਹੈ ਜਿਸ ਵਿੱਚ ਕਾਨਸਟਰਕਟਰ ਵਰਤਿਆ ਗਿਆ ਹੈ), ਕੁਝ ਵਿਕਾਸ ਕਾਰਣਾਂ ਹਨ। ਵਿਕਾਸ ਕਾਰਣ ਇਹ ਹੈ ਕਿ ਇਸ ਤਰੀਕੇ ਨਾਲ ਆਬਜੈਕਟ ਬਣਾਉਣ ਦਾ ਕੰਮ ਕਰਨਾ ਹੁੰਦਾ ਹੈ। ਪਹਿਲੇ ਉਦਾਹਰਣ ਵਿੱਚ, ਹਰ ਵਾਰ ਜਦੋਂ createCar() ਫੰਕਸ਼ਨ ਬੁਲਾਇਆ ਜਾਂਦਾ ਹੈ, ਤਾਂ ਨਵੀਂ ਫੰਕਸ਼ਨ showColor() ਬਣਾਈ ਜਾਂਦੀ ਹੈ, ਮਤਲਬ ਹਰ ਆਬਜੈਕਟ ਨੂੰ ਆਪਣੀ ਆਪਣੀ showColor() ਸੰਸਕਰਣ ਹੈ। ਪਰ ਇਸ ਤੇ ਤਰ੍ਹਾਂ, ਹਰ ਆਬਜੈਕਟ ਨੂੰ ਇੱਕ ਹੀ ਫੰਕਸ਼ਨ ਸਾਂਝਾ ਕਰਨਾ ਹੈ。

ਕੁਝ ਡਿਵੈਲਪਰ ਫੈਕਟਰੀ ਫੰਕਸ਼ਨ ਬਾਹਰ ਆਬਜੈਕਟ ਦੇ ਫੰਕਸ਼ਨ ਦੀ ਪ੍ਰਕਿਰਿਆ ਨੂੰ ਨਿਰਮਾਣ ਕਰਦੇ ਹਨ, ਫਿਰ ਇਸ ਨੂੰ ਪ੍ਰਕਿਰਿਆ ਦੇ ਰੂਪ ਵਿੱਚ ਅਤੇ ਇਸ ਨੂੰ ਆਪਣੇ ਆਪਣੇ ਪ੍ਰਕਿਰਿਆ ਵਿੱਚ ਦਿਸਾਉਂਦੇ ਹਨ ਤਾਕਿ ਇਹ ਪ੍ਰਸ਼ਨ ਹੱਲ ਹੋ ਸਕੇ:

function showColor() {
  alert(this.color);
}
function createCar(sColor,iDoors,iMpg) {
  var oTempCar = new Object;
  oTempCar.color = sColor;
  oTempCar.doors = iDoors;
  oTempCar.mpg = iMpg;
  oTempCar.showColor = showColor;
  return oTempCar;
}
var oCar1 = createCar("red",4,23);
var oCar2 = createCar("blue",3,25);
oCar1.showColor();		//ਬਿਨਾਂ ਸਿੰਗਲ ਕੋਡ ਦੇ ਪ੍ਰਕਾਸ਼
oCar2.showColor();		//ਬਿਨਾਂ ਸਿੰਗਲ ਕੋਡ ਦੇ ਪ੍ਰਕਾਸ਼

TIY

ਇਸ ਪੁਨਰ ਲਿਖਣ ਵਾਲੇ ਕੋਡ ਵਿੱਚ, function createCar() ਤੋਂ ਪਹਿਲਾਂ function showColor() ਦੀ ਪ੍ਰਕਿਰਿਆ ਨੂੰ ਦੇਖੋ। createCar() ਅੰਦਰ ਆਬਜੈਕਟ ਨੂੰ ਸਥਾਨਾਂ ਤੋਂ ਇੱਕ ਨਿਰਮਾਣ ਦੀ ਪ੍ਰਕਿਰਿਆ ਨੂੰ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ, ਇਸ ਤਰ੍ਹਾਂ ਫਲਾਣੇ ਕਰਕੇ ਫਲਾਣੇ ਦੀ ਫਲਾਣੇ ਨੂੰ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ; ਪਰ ਅਰਥਵਾਨ ਨਜ਼ਰ ਤੋਂ ਇਹ ਫੰਕਸ਼ਨ ਆਬਜੈਕਟ ਦਾ ਫੰਕਸ਼ਨ ਨਹੀਂ ਲਗਦਾ。

ਸਾਰੇ ਇਹ ਪ੍ਰਸ਼ਨ ਉਤਪੰਨ ਹੁੰਦੇ ਹਨਡਿਵੈਲਪਰ ਦੁਆਰਾਦੇ ਨਿਰਮਾਣ ਦੀ ਪ੍ਰਕਿਰਿਆ

ਨਿਰਮਾਣ ਫੰਕਸ਼ਨ ਤਰੀਕਾ

ਨਿਰਮਾਣ ਫੰਕਸ਼ਨ ਬਣਾਉਣਾ ਫੈਕਟਰੀ ਫੰਕਸ਼ਨ ਜਿਸ ਤਰ੍ਹਾਂ ਦਾ ਹੈ। ਪਹਿਲਾ ਕਦਮ ਹੈ ਕਿ ਕਲਾਸ ਦਾ ਨਾਮ ਚੁਣਨਾ, ਯਾਨੀ ਨਿਰਮਾਣ ਫੰਕਸ਼ਨ ਦਾ ਨਾਮ। ਮਾਣਯੋਗ ਪਰੰਪਰਾ ਦੇ ਅਨੁਸਾਰ, ਇਸ ਦਾ ਪਹਿਲਾ ਅੱਖਰ ਬੜਾ ਹੁੰਦਾ ਹੈ ਤਾਕਿ ਇਹ ਸਾਧਾਰਨ ਬੜੇ ਅੱਖਰ ਨਾਲ ਬਣੇ ਵਾਰਡ ਨਾਲ ਅਲੱਗ ਰਹੇ ਹੋਣ। ਇਸ ਤੋਂ ਇਲਾਵਾ ਇਹ ਫੰਕਸ਼ਨ ਫੈਕਟਰੀ ਫੰਕਸ਼ਨ ਨਾਲ ਸਾਦਾ ਹੀ ਹੁੰਦਾ ਹੈ। ਦੇਖੋ ਹੇਠਲਾ ਉਦਾਹਰਣ:

function Car(sColor,iDoors,iMpg) {
  this.color = sColor;
  this.doors = iDoors;
  this.mpg = iMpg;
  this.showColor = function() {
    alert(this.color);
  };
}
var oCar1 = new Car("red",4,23);
var oCar2 = new Car("blue",3,25);

TIY

ਇਥੇ ਤੁਹਾਨੂੰ ਉੱਪਰਲੇ ਕੋਡ ਅਤੇ ਫੈਕਟਰੀ ਤਰੀਕੇ ਦਰਮਿਆਨ ਅੰਤਰ ਦੇਖਾਇਆ ਜਾਵੇਗਾ। ਪਹਿਲਾਂ ਨਿਰਮਾਣ ਕਿੰਨਾ ਕਰਕੇ ਨਹੀਂ ਕੀਤਾ ਗਿਆ ਹੈ, ਬਲਕਿ this ਕੀਵਰਡ ਦੀ ਵਰਤੋਂ ਕੀਤੀ ਗਈ ਹੈ। new ਆਪਣੇ ਕੋਡ ਨੂੰ ਚਲਾਉਣ ਤੋਂ ਪਹਿਲਾਂ new ਅਪਣੇ ਨਿਰਮਾਣ ਕਰਕੇ ਨਿਰਮਾਣ ਕਰਕੇ ਫੰਕਸ਼ਨ ਵਿੱਚ ਇੱਕ ਆਬਜੈਕਟ ਬਣਾਉਂਦਾ ਹੈ, ਅਤੇ ਇਸ ਨੂੰ ਤੁਹਾਨੂੰ ਪਹੁੰਚਾਉਣ ਲਈ ਤੁਹਾਡੇ ਇਸਤੇਮਾਲ ਕੀਤਾ ਜਾਂਦਾ ਹੈ ਕੇਵਲ ਤੁਹਾਡੇ ਇਸਤੇਮਾਲ ਕੀਤਾ ਜਾਂਦਾ ਹੈ ਅਤੇ ਇਸ ਨੂੰ ਤੁਹਾਡੇ ਇਸਤੇਮਾਲ ਕੀਤਾ ਜਾਂਦਾ ਹੈ। ਇਸ ਤੋਂ ਬਾਅਦ ਤੁਹਾਡੇ this ਆਪਣੇ ਗੁਣਾਂ ਨੂੰ ਸੰਜੋਗ ਕਰ ਸਕਦੇ ਹਨ, ਮੂਲ ਰੂਪ ਵਿੱਚ ਇਹ ਨਿਰਮਾਣ ਫੰਕਸ਼ਨ ਦਾ ਪਰਤਣ ਹੈ (ਨਹੀਂ ਹੋਣਾ ਚਾਹੀਦਾ ਕਿਉਂਕਿ return ਅਪਣੇ ਕੋਡ ਨੂੰ ਕਰਨਾ ਹੋਵੇ)。

现在，用 new 运算符和类名 Car 创建对象，就更像 ECMAScript 中一般对象的创建方式了。

你也许会问，这种方式在管理函数方面是否存在于前一种方式相同的问题呢？是的。

就像工厂函数，构造函数会重复生成函数，为每个对象都创建独立的函数版本。不过，与工厂函数相似，也可以用外部函数重写构造函数，同样地，这么做语义上无任何意义。这正是下面要讲的原型方式的优势所在。

ਪ੍ਰੋਟੋਟਾਈਪ ਤਰੀਕਾ

ਇਸ ਤਰੀਕੇ ਨਾਲ, ਆਬਜ਼ਦ ਦੀਆਂ prototype ਪ੍ਰਾਪਰਟੀ ਦਾ ਉਪਯੋਗ ਕੀਤਾ ਜਾਂਦਾ ਹੈ, ਇਸ ਨੂੰ ਨਵੇਂ ਆਬਜ਼ਦ ਬਣਾਉਣ ਲਈ ਜਿਸ ਦੇ ਅਧਾਰ ਦੇ ਰੂਪ ਵਿੱਚ ਦੇਖਿਆ ਜਾ ਸਕਦਾ ਹੈ。

ਇੱਥੇ, ਪਹਿਲਾਂ ਖਾਲੀ ਕੰਸਟਰੱਕਟਰ ਨਾਲ ਕਲਾਸ ਨਾਮ ਸੈਟ ਕੀਤਾ ਗਿਆ ਹੈ। ਤਦ ਸਾਰੇ ਪ੍ਰਾਪਰਟੀਆਂ ਅਤੇ ਮੇਥਾਡ ਪ੍ਰੋਟੋਟਾਈਪ ਪ੍ਰਾਪਰਟੀ ਨੂੰ ਸਿੱਧੇ ਸੈਟ ਕੀਤੇ ਗਏ ਹਨ। ਪਹਿਲਾਂ ਦੇ ਉਦਾਹਰਣ ਨੂੰ ਪੁਨਰ ਲਿਖਿਆ ਗਿਆ ਹੈ, ਕੋਡ ਇਹ ਹੈ:

function Car() {
}
Car.prototype.color = "blue";
Car.prototype.doors = 4;
Car.prototype.mpg = 25;
Car.prototype.showColor = function() {
  alert(this.color);
};
var oCar1 = new Car();
var oCar2 = new Car();

TIY

ਇਸ ਕੋਡ ਵਿੱਚ, ਪਹਿਲਾਂ ਕੰਸਟਰੱਕਟਰ (Car) ਦਾ ਪਰਿਭਾਸ਼ਣ ਕੀਤਾ ਗਿਆ ਹੈ ਜਿਸ ਵਿੱਚ ਕੋਈ ਕੋਡ ਨਹੀਂ ਹੈ। ਅਗਲੇ ਕੋਡ ਵਿੱਚ, Car ਦੇ prototype ਪ੍ਰਾਪਰਟੀ ਨੂੰ ਪ੍ਰਾਪਰਟੀਆਂ ਜੋੜ ਕੇ Car ਆਬਜ਼ਦ ਦੀਆਂ ਪ੍ਰਾਪਰਟੀਆਂ ਨਿਰਧਾਰਿਤ ਕੀਤੀਆਂ ਜਾਂਦੀਆਂ ਹਨ। new Car() ਦੀ ਬੁਲਾਈ ਕਰਨ ਤੇ, ਪ੍ਰੋਟੋਟਾਈਪ ਦੀਆਂ ਸਾਰੀਆਂ ਪ੍ਰਾਪਰਟੀਆਂ ਤੇਜ਼ੀ ਨਾਲ ਬਣਾਏ ਗਏ ਆਬਜ਼ਦ ਨੂੰ ਸਾਂਝੀਆਂ ਕੀਤੀਆਂ ਜਾਂਦੀਆਂ ਹਨ, ਮਤਲਬ ਸਾਰੇ Car ਇੰਸਟੈਂਸ ਸਾਰੇ showColor() ਫੰਕਸ਼ਨ ਦੇ ਹਵਾਲੇ ਰੱਖਦੇ ਹਨ। ਮਤਲਬ ਸਾਰੇ ਪ੍ਰਾਪਰਟੀਆਂ ਇੱਕ ਆਬਜ਼ਦ ਨੂੰ ਲੱਗਦੀਆਂ ਹਨ, ਇਸ ਤਰ੍ਹਾਂ ਪਹਿਲਾਂ ਦੋ ਤਰੀਕਿਆਂ ਦੀਆਂ ਸਮੱਸਿਆਵਾਂ ਨੂੰ ਹੱਲ ਕੀਤਾ ਗਿਆ ਹੈ。

ਇਸ ਤਰੀਕੇ ਨਾਲ, instanceof ਆਪਰੇਟਰ ਦੀ ਮਦਦ ਨਾਲ, ਦਿੱਤੀ ਗਈ ਵੈਰੀਬਲ ਦੇ ਆਬਜ਼ਦ ਦੀ ਕਿਸਮ ਨੂੰ ਚੇਕ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ। ਇਸ ਲਈ, ਹੇਠ ਲਿਖੇ ਕੋਡ ਦਾ ਆਉਟਪੁਟ TRUE ਹੋਵੇਗਾ:

alert(oCar1 instanceof Car);	// ਆਉਟਪੁਟ "true"

ਪ੍ਰੋਟੋਟਾਈਪ ਤਰੀਕੇ ਦੀਆਂ ਸਮੱਸਿਆਵਾਂ

ਪ੍ਰੋਟੋਟਾਈਪ ਤਰੀਕਾ ਇੱਕ ਬਹੁਤ ਚੰਗਾ ਸਲੂਸ਼ਨ ਲਗਦਾ ਹੈ। ਦੁਖ ਦਾ ਹਲਾਤ ਇਹ ਹੈ ਕਿ ਇਹ ਬਹੁਤ ਚੰਗਾ ਨਹੀਂ ਹੈ。

ਪਹਿਲਾਂ ਇਹ ਕੰਸਟਰੱਕਟਰ ਕੋਈ ਪੈਰਾਮੀਟਰ ਨਹੀਂ ਹੈ। ਪ੍ਰੋਟੋਟਾਈਪ ਤਰੀਕੇ ਨਾਲ, ਕੰਸਟਰੱਕਟਰ ਨੂੰ ਪੈਰਾਮੀਟਰ ਪਾ ਕੇ ਪ੍ਰਾਪਰਟੀਆਂ ਦਾ ਮੁੱਢਲਾ ਮੁੱਲ ਸ਼ੁਰੂ ਕਰਨ ਨਹੀਂ ਸਕਦੇ ਕਿਉਂਕਿ Car1 ਅਤੇ Car2 ਦੀਆਂ color ਪ੍ਰਾਪਰਟੀਆਂ "blue" ਹਨ, doors ਪ੍ਰਾਪਰਟੀਆਂ 4 ਹਨ, mpg ਪ੍ਰਾਪਰਟੀਆਂ 25 ਹਨ। ਇਹ ਮਤਲਬ ਹੈ ਕਿ ਪ੍ਰਾਪਰਟੀਆਂ ਦੇ ਮੁੱਢਲੇ ਮੁੱਲ ਦਾ ਬਦਲਾਅ ਕਰਨਾ ਹੈ ਤਾਂ ਬਾਅਦ ਹੀ ਬਣਾਏ ਗਏ ਆਬਜ਼ਦਾਂ ਤੇ ਕੀਤਾ ਜਾਵੇਗਾ, ਇਹ ਬਹੁਤ ਖ਼ਰਾਬ ਹੈ, ਪਰ ਇਹ ਹੀ ਨਹੀਂ ਹੈ। ਅਸਲ ਵਿੱਚ ਸਮੱਸਿਆ ਇਹ ਹੈ ਕਿ ਪ੍ਰਾਪਰਟੀਆਂ ਦਾ ਹਵਾਲਾ ਫੰਕਸ਼ਨ ਨਹੀਂ ਹੈ ਬਲਕਿ ਆਬਜ਼ਦ ਨੂੰ ਦਿੱਤਾ ਗਿਆ ਹੈ। ਫੰਕਸ਼ਨ ਸਾਂਝੇ ਰਹਿਣ ਨਾਲ ਸਮੱਸਿਆ ਨਹੀਂ ਹੁੰਦੀ, ਪਰ ਆਬਜ਼ਦ ਨੂੰ ਕਈ ਇੰਸਟੈਂਸ ਦੁਆਰਾ ਸਾਂਝਾ ਕੀਤਾ ਜਾਂਦਾ ਹੈ। ਇਹ ਉਦਾਹਰਣ ਵਿਚਾਰ ਕਰੋ:

function Car() {
}
Car.prototype.color = "blue";
Car.prototype.doors = 4;
Car.prototype.mpg = 25;
Car.prototype.drivers = new Array("Mike","John");
Car.prototype.showColor = function() {
  alert(this.color);
};
var oCar1 = new Car();
var oCar2 = new Car();
oCar1.drivers.push("Bill");
alert(oCar1.drivers);	//输出 "Mike,John,Bill"
alert(oCar2.drivers);	//输出 "Mike,John,Bill"

TIY

上面的代码中，属性 drivers 是指向 Array 对象的指针，该数组中包含两个名字 "Mike" 和 "John"。由于 drivers 是引用值，Car 的两个实例都指向同一个数组。这意味着给 oCar1.drivers 添加值 "Bill"，在 oCar2.drivers 中也能看到。输出这两个指针中的任何一个，结果都是显示字符串 "Mike,John,Bill"。

由于创建对象时有这么多问题，你一定会想，是否有种合理的创建对象的方法呢？答案是有，需要联合使用构造函数和原型方式。

混合的构造函数/原型方式

联合使用构造函数和原型方式，就可像用其他程序设计语言一样创建对象。这种概念非常简单，即用构造函数定义对象的所有非函数属性，用原型方式定义对象的函数属性（方法）。结果是，所有函数都只创建一次，而每个对象都具有自己的对象属性实例。

我们重写了前面的例子，代码如下：

function Car(sColor,iDoors,iMpg) {
  this.color = sColor;
  this.doors = iDoors;
  this.mpg = iMpg;
  this.drivers = new Array("Mike","John");
}
Car.prototype.showColor = function() {
  alert(this.color);
};
var oCar1 = new Car("red",4,23);
var oCar2 = new Car("blue",3,25);
oCar1.drivers.push("Bill");
alert(oCar1.drivers);	//输出 "Mike,John,Bill"
alert(oCar2.drivers);	//输出 "Mike,John"

TIY

现在就更像创建一般对象了。所有的非函数属性都在构造函数中创建，意味着又能够用构造函数的参数赋予属性默认值了。因为只创建 showColor() 函数的一个实例，所以没有内存浪费。此外，给 oCar1 的 drivers 数组添加 "Bill" 值，不会影响到 oCar2 的数组，所以输出这些数组的值时，oCar1.drivers 显示的是 "Mike,John,Bill"，而 oCar2.drivers 显示的是 "Mike,John"。因为使用了原型方式，所以仍然能利用 instanceof 运算符来判断对象的类型。

ਇਹ ਤਰੀਕਾ ECMAScript ਵੱਲੋਂ ਮੁੱਖ ਤੌਰ 'ਤੇ ਅਪਣਾਇਆ ਗਿਆ ਹੈ, ਇਹ ਹੋਰ ਤਰੀਕਿਆਂ ਦੀਆਂ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਰੱਖਦਾ ਹੈ, ਪਰ ਉਨ੍ਹਾਂ ਦੇ ਨਾਲ ਮਿਲਣ ਵਾਲੇ ਪ੍ਰਭਾਵਾਂ ਨੂੰ ਨਹੀਂ ਰੱਖਦਾ।ਫਿਰ ਵੀ, ਕੁਝ ਵਿਕਾਸਕਾਰਾਂ ਨੂੰ ਇਹ ਤਰੀਕਾ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸੰਪੂਰਨ ਨਹੀਂ ਲਗਦਾ।

ਡਾਇਨਾਮਿਕ ਪ੍ਰੋਟੋਟਾਈਪ ਮੈਥਡ

ਹੋਰ ਭਾਸ਼ਾਵਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨ ਵਾਲੇ ਵਿਕਾਸਕਾਰਾਂ ਲਈ, ਮਿਕਸਡ ਕੰਸਟਰਕਟਰ/ਪ੍ਰੋਟੋਟਾਈਪ ਤਰੀਕੇ ਵਰਤਣਾ ਕਿਉਂਕਿ ਬਹੁਤ ਸਾਰੇ ਅਨੁਕੂਲ ਨਹੀਂ ਲਗਦਾ।ਕਾਰਣ, ਕਲਾਸ ਦੇ ਨਿਰਧਾਰਿਤ ਕਰਨ ਦੇ ਸਮੇਂ, ਅਧਿਕਾਂਤਕ ਤੌਰ 'ਤੇ ਸਾਰੇ ਆਪਣੇ ਪ੍ਰੋਗਰਾਮਿੰਗ ਭਾਸ਼ਾਵਾਂ ਵਿੱਚ ਗੁਣ ਅਤੇ ਫੰਕਸ਼ਨਾਂ ਨੂੰ ਦਿਸ਼ਾ-ਨਿਰਦੇਸ਼ਿਤ ਵਰਤੋਂ ਕੀਤੀ ਜਾਂਦੀ ਹੈ।ਧਿਆਨ ਦੇਵੇ ਨਿਮਨਲਿਖਤ Java ਕਲਾਸ:

class Car {
  public String color = "blue";
  public int doors = 4;
  public int mpg = 25;
  public Car(String color, int doors, int mpg) {
    this.color = color;
    this.doors = doors;
    this.mpg = mpg;
  }
  public void showColor() {
    System.out.println(color);
  }
}

Java ਨੇ Car ਕਲਾਸ ਦੇ ਸਾਰੇ ਗੁਣ ਅਤੇ ਫੰਕਸ਼ਨਾਂ ਨੂੰ ਬਹੁਤ ਵਧੀਆ ਪੈਕ ਕੀਤਾ ਹੈ, ਇਸ ਲਈ ਇਸ ਕੋਡ ਨੂੰ ਦੇਖਣ ਨਾਲ ਹੀ ਇਹ ਪਤਾ ਚਲਦਾ ਹੈ ਕਿ ਇਹ ਕੀ ਕਰਨ ਵਾਲਾ ਹੈ, ਇਹ ਇੱਕ ਆਬੋਹਵਾ ਦਾ ਸੂਚਨਾ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ।ਮਿਕਸਡ ਕੰਸਟਰਕਟਰ/ਪ੍ਰੋਟੋਟਾਈਪ ਤਰੀਕੇ ਦੇ ਵਿਰੋਧੀਆਂ ਨੇ ਕਿਹਾ ਕਿ ਕੰਸਟਰਕਟਰ ਅੰਦਰ ਗੁਣ ਲੱਭਣਾ ਅਤੇ ਫੰਕਸ਼ਨਾਂ ਦੇ ਬਾਹਰ ਲੱਭਣਾ ਅਤਿਅਧਿਕ ਤਰਕਸੰਗਤ ਨਹੀਂ ਹੈ।ਇਸ ਲਈ, ਉਹਨਾਂ ਨੇ ਡਾਇਨਾਮਿਕ ਪ੍ਰੋਟੋਟਾਈਪ ਮੈਥਡ ਦਾ ਸੁਝਾਅ ਦਿੱਤਾ ਹੈ, ਤਾਕਿ ਸਹੀ ਕੋਡਿੰਗ ਸਟਾਈਲ ਪ੍ਰਦਾਨ ਕੀਤਾ ਜਾ ਸਕੇ。

ਡਾਇਨਾਮਿਕ ਪ੍ਰੋਟੋਟਾਈਪ ਮੈਥਡ ਦਾ ਮੁੱਖ ਵਿਚਾਰ ਮਿਕਸਡ ਕੰਸਟਰਕਟਰ/ਪ੍ਰੋਟੋਟਾਈਪ ਤਰੀਕੇ ਨਾਲ ਸਮਾਨ ਹੈ, ਯਾਨੀ ਕੰਸਟਰਕਟਰ ਅੰਦਰ ਗ਼ੈਰ-ਫੰਕਸ਼ਨ ਗੁਣ ਨਿਰਧਾਰਿਤ ਕਰੋ, ਫੰਕਸ਼ਨ ਗੁਣ ਪ੍ਰੋਟੋਟਾਈਪ ਗੁਣ ਦੀ ਵਰਤੋਂ ਕਰ ਕੇ ਨਿਰਧਾਰਿਤ ਕਰੋ।ਇੱਕਮਾਤਰ ਅੰਤਰ ਹੈ ਕਿ ਅਜਿਹੇ ਕੰਪਿਊਟਰ ਮੰਡਲ ਨੂੰ ਮੰਡਲ ਦੀ ਜਗ੍ਹਾ ਵਿੱਚ ਦਿੱਤਾ ਜਾਂਦਾ ਹੈ।ਨਿਮਨਲਿਖਤ Car ਕਲਾਸ ਨੂੰ ਡਾਇਨਾਮਿਕ ਪ੍ਰੋਟੋਟਾਈਪ ਮੈਥਡ ਦੇ ਰੂਪ ਵਿੱਚ ਲਿਖਿਆ ਗਿਆ ਹੈ:

function Car(sColor,iDoors,iMpg) {
  this.color = sColor;
  this.doors = iDoors;
  this.mpg = iMpg;
  this.drivers = new Array("Mike","John");
  if (typeof Car._initialized == "undefined") {
    Car.prototype.showColor = function() {
      alert(this.color);
    };
    Car._initialized = true;
  }
}

TIY

直到检查 typeof Car._initialized 是否等于 "undefined" 之前，这个构造函数都未发生变化。这行代码是动态原型方法中最重要的部分。如果这个值未定义，构造函数将用原型方式继续定义对象的方法，然后把 Car._initialized 设置为 true。如果这个值定义了（它的值为 true 时，typeof 的值为 Boolean），那么就不再创建该方法。简而言之，该方法使用标志（_initialized）来判断是否已给原型赋予了任何方法。该方法只创建并赋值一次，传统的 OOP 开发者会高兴地发现，这代码看起来更像其他语言中的类定义了。

ਮਿਸ਼ਰਿਤ ਫੈਕਟਰੀ ਤਰੀਕਾ

ਇਹ ਤਰੀਕਾ ਆਮ ਤੌਰ 'ਤੇ ਪਹਿਲਾਂ ਦੇ ਤਰੀਕੇ ਨੂੰ ਲਾਗੂ ਨਹੀਂ ਹੋਣ ਵਾਲੇ ਸਥਿਤੀਆਂ ਵਿੱਚ ਇੱਕ ਮੌਜੂਦਾ ਪਰਿਭਾਸ਼ਾ ਹੈ। ਇਸ ਦਾ ਉਦੇਸ਼ ਫਾਲਸਾ ਕਾਨਸਟਰਕਟਰ ਦੀ ਪਰਿਭਾਸ਼ਾ ਕਰਨਾ ਹੈ, ਜੋ ਕਿ ਹੋਰ ਇਕਾਈਆਂ ਦੇ ਨਵੇਂ ਪ੍ਰਤੀਭਾਸ਼ਾਵਾਂ ਨੂੰ ਵਾਪਸ ਦਿੰਦਾ ਹੈ।

ਇਹ ਕੋਡ ਫੈਕਟਰੀ ਫੰਕਸ਼ਨ ਨਾਲ ਬਹੁਤ ਹੀ ਮਿਲਦਾ-ਜੁਲਦਾ ਦਿਖਾਈ ਦਿੰਦਾ ਹੈ:

function Car() {
  var oTempCar = new Object;
  oTempCar.color = "blue";
  oTempCar.doors = 4;
  oTempCar.mpg = 25;
  oTempCar.showColor = function() {
    alert(this.color);
  };
  return oTempCar;
}

TIY

ਕਲਾਸਿਕ ਤਰੀਕੇ ਨਾਲ ਅੰਤਰਿਕਲਪਿਤ ਹੋਣ ਤੋਂ ਬਿਨਾ, ਇਹ ਤਰੀਕਾ new ਕੰਡੀਸ਼ਨ ਵਰਤ ਕੇ ਇਸ ਨੂੰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਕਾਨਸਟਰਕਟਰ ਵਾਂਗ ਦਿਖਾਉਂਦਾ ਹੈ:

var car = new Car();

Car() ਕਾਨਸਟਰਕਟਰ ਅੰਦਰ new ਕੰਡੀਸ਼ਨ ਵਾਲੇ ਕਾਰਣ ਇਹ ਦੂਜਾ new ਕੰਡੀਸ਼ਨ (ਕਾਨਸਟਰਕਟਰ ਬਾਹਰ) ਨੂੰ ਨਾਜਾਇਜ਼ ਕਰ ਦਿੱਤਾ ਜਾਵੇਗਾ, ਕਾਨਸਟਰਕਟਰ ਅੰਦਰ ਬਣਾਈ ਗਈ ਇਕਾਈ ਨੂੰ ਵਾਰਤਾ ਵਿੱਚ ਪਾਸ ਕੀਤਾ ਜਾਵੇਗਾ car ਵਾਰਤਾ ਵਿੱਚ।

ਇਹ ਤਰੀਕਾ ਕਾਨਸਟਰਕਟਰ ਦੀਆਂ ਮੈਟਾਡਾਂ ਦੇ ਅੰਦਰੂਨੀ ਪ੍ਰਬੰਧਨ ਵਿੱਚ ਕਲਾਸਿਕ ਤਰੀਕੇ ਨਾਲ ਇੱਕ ਜਿਸ਼ਤ ਹੈ। ਬਹੁਤ ਸਰਵਸ੍ਰੇਸ਼ਠ ਸਿਫਾਰਸ਼: ਹਾਲਾਂਕਿ ਜ਼ਰੂਰਤ ਹੋਵੇ ਤਾਂ ਹੀ ਇਹ ਤਰੀਕਾ ਵਰਤੋਂ ਕਰੋ।

ਕਿਸ ਤਰੀਕੇ ਨੂੰ ਅਪਣਾਓ

ਜਿਵੇਂ ਕਿ ਪਹਿਲਾਂ ਦੱਸਿਆ ਗਿਆ ਹੈ, ਇਸ ਵੇਲੇ ਸਭ ਤੋਂ ਵਧੇਰੇ ਵਰਤਾਏ ਜਾਣ ਵਾਲਾ ਹੈ ਮਿਸ਼ਰਿਤ ਕਾਨਸਟਰਕਟਰ/ਪ੍ਰੋਟੋਟਾਈਪ ਤਰੀਕਾ। ਇਸ ਤੋਂ ਇਲਾਵਾ, ਗਤੀਸ਼ੀਲ ਪ੍ਰਾਥਮਿਕ ਮੇਥਡ ਵੀ ਬਹੁਤ ਪ੍ਰਸਿੱਧ ਹਨ, ਜੋ ਕਿ ਕਾਨਸਟਰਕਟਰ/ਪ੍ਰੋਟੋਟਾਈਪ ਤਰੀਕੇ ਨਾਲ ਸਮਾਨ ਹਨ। ਇਨ੍ਹਾਂ ਦੋਵਾਂ ਤਰੀਕਿਆਂ ਵਿੱਚੋਂ ਕਿਸੇ ਨੂੰ ਵੀ ਵਰਤ ਸਕਦੇ ਹੋ। ਪਰ ਇੱਕੋ ਤੌਰ 'ਤੇ ਕਲਾਸਿਕ ਕਾਨਸਟਰਕਟਰ ਜਾਂ ਪ੍ਰੋਟੋਟਾਈਪ ਤਰੀਕਾ ਨਾ ਵਰਤੋਂ ਕਰੋ, ਕਿਉਂਕਿ ਇਸ ਨਾਲ ਕੋਡ ਵਿੱਚ ਸਮੱਸਿਆਵਾਂ ਆ ਸਕਦੀਆਂ ਹਨ।

ਉਦਾਹਰਣ

ਇੱਕ ਅਜਿਹਾ ਵਿਸ਼ਾ ਹੈ ਜਿਸ ਵਿੱਚ ਇਹ ਇਕਾਈਆਂ ਨਾਲ ਸਮੱਸਿਆਵਾਂ ਨੂੰ ਹੱਲ ਕੀਤਾ ਜਾਂਦਾ ਹੈ। ECMAScript ਵਿੱਚ ਸਭ ਤੋਂ ਆਮ ਇੱਕ ਸਮੱਸਿਆ ਹੈ ਕਿ ਸਟਰਿੰਗ ਜੋਡਣ ਦੀ ਸ਼ਾਨਦਾਰਤਾ। ਹੋਰ ਭਾਸ਼ਾਵਾਂ ਵਾਂਗ ਐਕਮਾਸਕ੍ਰਿਪਟ ਦੀਆਂ ਸਟਰਿੰਗਾਂ ਅਣਮਾਨਵਯ ਹਨ ਯਾਨੀ ਉਨ੍ਹਾਂ ਦਾ ਮੁੱਲ ਬਦਲ ਨਹੀਂ ਸਕਦਾ। ਹੇਠ ਲਿਖੇ ਕੋਡ ਨੂੰ ਦੇਖੋ:

var str = "hello ";
str += "world";

ਅਸਲ ਵਿੱਚ, ਇਹ ਕੋਡ ਪਿੱਛੇ ਇਹ ਕਦਮ ਚਲਾਉਂਦਾ ਹੈ:

  1. hello " ਦੀ ਸਿਰਜਣਾ ਕੀਤੀ ਜਾਂਦੀ ਹੈ
  2. world" ਦੀ ਸਿਰਜਣਾ ਕੀਤੀ ਜਾਂਦੀ ਹੈ
  3. ਜੋਈਨ ਕਰਨ ਵਾਲੇ ਨਤੀਜੇ ਵਿੱਚ ਸਟੋਰ ਕਰਨ ਵਾਲੇ ਚਿੰਨ੍ਹ ਸ਼ਬਦ ਦੀ ਸਿਰਜਣਾ ਕੀਤੀ ਜਾਂਦੀ ਹੈ
  4. str ਦੀ ਮੌਜੂਦਾ ਸਮਾਚਾਰ ਨੂੰ ਨਤੀਜੇ ਵਿੱਚ ਪਾਇਆ ਜਾਂਦਾ ਹੈ
  5. world" ਨੂੰ ਨਤੀਜੇ ਵਿੱਚ ਪਾਇਆ ਜਾਂਦਾ ਹੈ
  6. str ਨੂੰ ਅੰਤਿਮ ਨਤੀਜੇ ਦੇ ਸੰਦਰਭ ਵਿੱਚ ਅੱਪਡੇਟ ਕਰੋ

ਹਰ ਵਾਰ ਚਿੰਨ੍ਹ ਸ਼ਬਦ ਜੋੜਨ ਦੇ ਬਾਅਦ ਕਦਮ 2 ਤੋਂ 6 ਤੱਕ ਚਲਾਇਆ ਜਾਵੇਗਾ, ਜਿਸ ਨਾਲ ਇਹ ਕੰਮ ਬਹੁਤ ਕਾਰਜ ਕਰਦਾ ਹੈ। ਇਹ ਪ੍ਰਕਿਰਿਆ ਕਈ ਵਾਰ ਕਰਨ ਤੋਂ ਬਾਅਦ, ਉਦੋਂ ਤੱਕ ਕਈ ਸੌ ਤੋਂ ਕਈ ਹਜ਼ਾਰ ਵਾਰ ਕਰਨ ਤੋਂ ਬਾਅਦ, ਪ੍ਰਦਰਸ਼ਨ ਸਮੱਸਿਆ ਪੈਦਾ ਹੋ ਸਕਦੀ ਹੈ। ਇਸ ਸਮੱਸਿਆ ਦਾ ਹੱਲ ਇਹ ਹੈ ਕਿ ਚਿੰਨ੍ਹ ਸ਼ਬਦ ਸਟੋਰ ਕਰਨ ਵਾਲੇ Array ਆਬੋਹਵਾ ਵਿੱਚ ਰੱਖੋ ਅਤੇ ਫਿਰ join() ਤਰੀਕੇ (ਪੈਰਾਮੀਟਰ ਖਾਲੀ ਚਿੰਨ੍ਹ ਸ਼ਬਦ) ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਅੰਤਿਮ ਚਿੰਨ੍ਹ ਸ਼ਬਦ ਦੀ ਸਿਰਜਣਾ ਕਰੋ। ਪਹਿਲੇ ਕੋਡ ਦੀ ਥਾਂ ਇਹ ਕੋਡ ਵਰਤੋਂ ਕਰੋ:

var arr = new Array();
arr[0] = "hello ";
arr[1] = "world";
var str = arr.join("");

ਇਸ ਤਰ੍ਹਾਂ, ਗਰੁੱਪ ਵਿੱਚ ਕਿੰਨੇ ਚਿੰਨ੍ਹ ਸ਼ਬਦ ਲਿਆ ਜਾਵੇ ਉਹ ਚੰਗਾ ਨਹੀਂ ਹੈ, ਕਿਉਂਕਿ ਜੋਈਨ() ਤਰੀਕੇ ਨੂੰ ਕਿਵੇਂ ਹੀ ਚਲਾਇਆ ਜਾਵੇਗਾ, ਜਦੋਂ ਤਕ ਜੋਈਨ() ਤਰੀਕੇ ਦਾ ਆਉਣ ਨਹੀਂ ਹੈ। ਇਸ ਵਾਰ ਚਲਾਇਆ ਜਾਣ ਵਾਲੇ ਕਦਮ ਇਹ ਹੋਣਗੇ:

  1. ਨਤੀਜੇ ਵਿੱਚ ਸਟੋਰ ਕਰਨ ਵਾਲੇ ਚਿੰਨ੍ਹ ਸ਼ਬਦ ਦੀ ਸਿਰਜਣਾ ਕੀਤੀ ਜਾਂਦੀ ਹੈ
  2. ਹਰੇਕ ਚਿੰਨ੍ਹ ਸ਼ਬਦ ਨੂੰ ਨਤੀਜੇ ਵਿੱਚ ਉਚਿਤ ਸਥਾਨ 'ਤੇ ਪਾਇਆ ਜਾਂਦਾ ਹੈ

ਹਾਲੇ ਇਹ ਹੱਲ ਬਹੁਤ ਚੰਗਾ ਹੈ, ਪਰ ਬਿਹਤਰ ਹੱਲ ਹੈ। ਸਮੱਸਿਆ ਹੈ ਕਿ ਇਹ ਕੋਡ ਇਸ ਦੇ ਇਰਾਦੇ ਨੂੰ ਸਹੀ ਤਰ੍ਹਾਂ ਪ੍ਰਗਟ ਨਹੀਂ ਕਰਦਾ। ਇਸ ਨੂੰ ਹੋਰ ਸਹੀ ਸਮਝਣ ਲਈ StringBuffer ਕਲਾਸ ਨਾਲ ਇਸ ਹੱਲ ਨੂੰ ਪੈਕ ਕਰ ਸਕਦੇ ਹਨ:

function StringBuffer () {
  this._strings_ = new Array();
}
StringBuffer.prototype.append = function(str) {
  this._strings_.push(str);
};
StringBuffer.prototype.toString = function() {
  return this._strings_.join("");
};

ਇਹ ਕੋਡ ਦੀ ਪਹਿਲੀ ਚੰਗੀ ਧਿਆਨ ਦੇਣ ਵਾਲੀ ਵਿਸ਼ੇਸ਼ਤਾ ਹੈ strings ਪ੍ਰਤਿਯਾਇਕਤਾ, ਜਿਸ ਦਾ ਮੂਲ ਇਰਾਦਾ ਪ੍ਰਤਿਯਾਇਕ ਹੈ। ਇਸ ਕੋਲ ਦੋ ਤਰੀਕੇ ਹਨ, ਯਾਨੀ append() ਅਤੇ toString() ਤਰੀਕੇ। append() ਤਰੀਕੇ ਵਿੱਚ ਇੱਕ ਪੈਰਾਮੀਟਰ ਹੈ, ਜੋ ਉਹ ਪੈਰਾਮੀਟਰ ਚੰਗੀ ਤਰ੍ਹਾਂ ਚਿੰਨ੍ਹ ਸ਼ਬਦ ਗਰੁੱਪ ਵਿੱਚ ਜੋੜਦਾ ਹੈ, toString() ਤਰੀਕੇ ਗਰੁੱਪ ਦੀ join ਮੰਥਨ ਕਰਦਾ ਹੈ, ਜੋ ਕਿ ਸਾਚੀ ਜੋੜੀ ਚਿੰਨ੍ਹ ਸ਼ਬਦ ਵਾਪਸ ਦਿੰਦਾ ਹੈ। StringBuffer ਆਬੋਹਵਾ ਦੇ ਆਬੋਹਵਾ ਗਰੁੱਪ ਨੂੰ ਜੋੜਨ ਲਈ ਇਹ ਕੋਡ ਵਰਤ ਸਕਦੇ ਹਨ:

var buffer = new StringBuffer ();
buffer.append("hello ");
buffer.append("world");
var result = buffer.toString();

TIY

可用下面的代码测试 StringBuffer 对象和传统的字符串连接方法的性能：

var d1 = new Date();
var str = "";
for (var i=0; i < 10000; i++) {
    str += "text";
}
var d2 = new Date();
document.write("Concatenation with plus: "
 + (d2.getTime() - d1.getTime()) + " milliseconds");
var buffer = new StringBuffer();
d1 = new Date();
for (var i=0; i < 10000; i++) {
    buffer.append("text");
}
var result = buffer.toString();
d2 = new Date();
document.write("
Concatenation with StringBuffer: "
 + (d2.getTime() - d1.getTime()) + " milliseconds");

TIY

这代码对字符串连接进行两个测试，第一个使用加号，第二个使用 StringBuffer 类。每个操作都连接 10000 个字符串。日期值 d1 和 d2 用于判断完成操作需要的时间。请注意，创建 Date 对象时，如果没有参数，赋予对象的是当前的日期和时间。要计算连接操作历经多少时间，把日期的毫秒表示（用 getTime() 方法的返回值）相减即可。这是衡量 JavaScript 性能的常见方法。该测试的结果可以帮助您比较使用 StringBuffer 类与使用加号的效率差异。