ای سی ایم اسکریپت کلاس یا اوبجیکٹ تعریف

پیش تعریف شدہ آئیٹموں کا استعمال صرف اوبجیکٹ آئرن پریز لینگویج کی صلاحیت کا ایک حصہ ہے، وہ اصل میں مضبوط جگہ اس کی قوت میں ہے کہ وہ اپنے خود کی خصوصی کلاس اور آئیٹم بناسکتے ہیں。

ECMAScript کا متعدد طریقوں سے آئیٹم یا کلاس بنانے کے متعدد طریقوں موجود ہیں。

فیکٹری طریقہ

مستقل طریقہ

کیونکہ آئیٹم کی خصوصیات کو آئیٹم کی تخلیق کے بعد دینا ممکن ہے، لہذا کئی پروگرامر JavaScript کی ابتدائی پیشکش کے دوران اس طرح کے کوڈ لکھتے تھے:

var oCar = new Object;
oCar.color = "blue";
oCar.doors = 4;
oCar.mpg = 25;
oCar.showColor = function() {
  الرٹ(اینٹھی کلر);
};

تی آئی آئی

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

不过这里有一个问题,就是可能需要创建多个 car 的实例。

解决方案:工厂方式

要解决该问题,开发者创造了能创建并返回特定类型的对象的工厂函数(factory function)。

例如,函数 createCar() 可用于封装前面列出的创建 car 对象的操作:

function createCar() {
  وار اوٹمپکار = نیو اوبجیکٹ;
  اوٹمپکار.کلر = "بلو";
  اوٹمپکار.درز = 4;
  اوٹمپکار.ایم پی جی = 25;
  اوٹمپکار.شو کلر = فانکشن() {
    الرٹ(اینٹھی کلر);
  };
  ریٹرن اوٹمپکار;
}
var oCar1 = createCar();
var oCar2 = createCar();

تی آئی آئی

在这里,第一个例子中的所有代码都包含在 createCar() 函数中。此外,还有一行额外的代码,返回 car 对象(oTempCar)作为函数值。调用此函数,将创建新对象,并赋予它所有必要的属性,复制出一个我们在前面说明过的 car 对象。因此,通过这种方法,我们可以很容易地创建 car 对象的两个版本(oCar1 和 oCar2),它们的属性完全一样。

为函数传递参数

我们还可以修改 createCar() 函数,给它传递各个属性的默认值,而不是简单地赋予属性默认值:

function createCar(sColor,iDoors,iMpg) {
  وار اوٹمپکار = نیو اوبجیکٹ;
  oTempCar.color = sColor;
  oTempCar.doors = iDoors;
  oTempCar.mpg = iMpg;
  اوٹمپکار.شو کلر = فانکشن() {
    الرٹ(اینٹھی کلر);
  };
  ریٹرن اوٹمپکار;
}
var oCar1 = createCar("red",4,23);
var oCar2 = createCar("blue",3,25);
oCar1.showColor();		// نکالنا "red"
oCar2.showColor();		// نکالنا "blue"

تی آئی آئی

给 createCar() 函数加上参数,即可为要创建的 car 对象的 color、doors 和 mpg 属性赋值。这使两个对象具有相同的属性,却有不同的属性值。

在工厂函数外定义对象的方法

虽然 ECMAScript 越来越正式化,但创建对象的方法却被置之不理,且其规范化至今还遭人反对。一部分是语义上的原因(它看起来不像使用带有构造函数 new 运算符那么正规),一部分是功能上的原因。功能原因在于用这种方式必须创建对象的方法。前面的例子中,每次调用函数 createCar(),都要创建新函数 showColor(),意味着每个对象都有自己的 showColor() 版本。而事实上,每个对象都共享同一个函数。

کچھ پروگرام کار اس سوال کو حل کرسکتے ہیں جو فیکٹری فونکشن کے باہر اوبجیکٹ کا فونکشن تعریف کرتے ہیں، اور اس کو اپنے پرپرتی کے ذریعے اس فونکشن تک نکال دیتی ہیں، تاکہ اس سوال کو حل کرسکیں: }}

function showColor() {
  الرٹ(اینٹھی کلر);
}
function createCar(sColor,iDoors,iMpg) {
  وار اوٹمپکار = نیو اوبجیکٹ;
  oTempCar.color = sColor;
  oTempCar.doors = iDoors;
  oTempCar.mpg = iMpg;
  oTempCar.showColor = showColor;
  ریٹرن اوٹمپکار;
}
var oCar1 = createCar("red",4,23);
var oCar2 = createCar("blue",3,25);
oCar1.showColor();		// نکالنا "red"
oCar2.showColor();		// نکالنا "blue"

تی آئی آئی

مجھے پائی جانے والی اس کد میں، فونکشن createCar() سے پہلے فونکشن showColor() کا تعریف کیا گیا ہے۔ createCar() کے اندر، اوبجیکٹ کو موجود فونکشن showColor() کی سمت نکال دی جاتی ہے۔ فنکشن کی تعمیر کو روکنے کی صلاحیت میں اس طرح کا حل مل جاتا ہے؛ لیکن اس کی معنویت میں اس فونکشن کو اوبجیکٹ کا فونکشن نہیں لگتا۔

تمام یہ مسائل کوبرائے پروگرام کارمیکس کونسٹرکٹر کی آمد

میکس کونسٹرکٹر طریقہ

میکس کونسٹرکٹر بنانا جیسا کہ فیکٹری فونکشن بنانا آسان ہوتا ہے۔ پہلے قدم، کلاس کا نام منتخب کرنا، یعنی میکس کونسٹرکٹر کا نام چنا جاتا ہے۔ روایت کے مطابق اس نام کا پہلا حرف بڑا لکھا جاتا ہے، تاکہ وہ سادے متغیر کے نام سے الگ رہ جائے۔ اس کے علاوہ، میکس کونسٹرکٹر کی طرح اس میکس کونسٹرکٹر کا انداز دیکھنے میں آسان ہوتا ہے۔ درست کی مثال دیکھیئے:

function Car(sColor,iDoors,iMpg) {
  this.color = sColor;
  this.doors = iDoors;
  this.mpg = iMpg;
  this.showColor = function() {
    الرٹ(اینٹھی کلر);
  };
}
var oCar1 = نیو Car("red",4,23);
var oCar2 = نیو Car("blue",3,25);

تی آئی آئی

آپ کو اپنے اوپر والی کد کی فرق کا تفصیل دیا جارہا ہے۔ ابتدا میں تعمیر کے فونکشن میں کوئی اوبجیکٹ نہیں بنایا گیا، بلکہ 'this' کلید استعمال کیا گیا۔'new' آپریٹر کے ذریعے تعمیر کے فونکشن استعمال کیا جاتا ہے، پہلے سارے کدوں پر آگے چلنے سے پہلے ایک اوبجیکٹ بنایا جاتا ہے، صرف 'this' سے ابجیکٹ تک رسائی حاصل کی جاسکتی ہے۔ بعد میں 'this' پر مستقیماً اپنائی جاسکتی ہیں، جو دفعتی طور پر تعمیر کے فونکشن کی واپسی کی حکمت عملی ہے (بغیر 'return' آپریٹر استعمال کی ضرورت نہیں ہوتی)۔

حالا، با استفاده از عملگر new و نام کلاس Car، ایجاد اشیاء بیشتر شبیه به ایجاد اشیاء معمولی در ECMAScript خواهد بود.

شاید بپرسید، آیا این روش مشکلات مدیریت توابع مشابه روش قبلی دارد؟ بله.

مثل توابع کارخانه، توابع ساختیارگر توابع را به طور مداوم ایجاد می‌کنند، به این معنا که برای هر اشیاء یک نسخه مستقل از توابع ایجاد می‌شود. اما مثل توابع کارخانه، می‌توان توابع ساختیارگر را با استفاده از توابع خارجی بازنویسی کرد، که از نظر معنایی هیچ معنایی ندارد. این دقیقاً مزیت روش پیشوند است که در ادامه توضیح داده خواهد شد.

روش پیشوند

این روش از ویژگی prototype اشیاء استفاده می‌کند، که می‌توان آن را به عنوان نمونه‌ای از prototype مورد استفاده برای ایجاد اشیاء جدید در نظر گرفت.

در اینجا، ابتدا با استفاده از توابع ساختیارگر خالی نام کلاس را تنظیم می‌کنیم. سپس تمام ویژگی‌ها و روش‌ها به طور مستقیم به ویژگی prototype نسبت داده می‌شوند. مثال قبلی را با کد زیر بازنویسی می‌کنیم:

فانکشن کار() {
}
Car.prototype.color = "blue";
Car.prototype.doors = 4;
Car.prototype.mpg = 25;
Car.prototype.showColor = function() {
  الرٹ(اینٹھی کلر);
};
var oCar1 = new Car();
var oCar2 = new Car();

تی آئی آئی

در این کد، ابتدا توابع ساختیارگر (Car) تعریف می‌شود که هیچ کد داخلی ندارد. چندین خط بعد، با اضافه کردن ویژگی‌ها به ویژگی prototype توابع، ویژگی‌های پیشوند به تعریف می‌شوند. با استفاده از new Car()، تمام ویژگی‌های پیشوند به طور مستقیم به اشیاء ایجاد شده نسبت داده می‌شوند، به این معنا که تمام نمونه‌های Car به یک اشاره‌گر به توابع showColor() اشاره دارند. از نظر معنایی، تمام ویژگی‌ها به نظر می‌رسد که به یک اشیاء تعلق دارند، بنابراین مشکلات دو روش قبلی حل شده‌اند.

علاوه بر این، با استفاده از این روش، می‌توان با استفاده از عملگر instanceof نوع اشیاء به که داده شده اشاره دارد را بررسی کرد. بنابراین، کد زیر TRUE را خروجی خواهد داد:

alert(oCar1 instanceof Car);	// خروجی "true"

مشکلات روش پیشوند

به نظر می‌رسد که روش پیشوند یک راه حل خوب باشد. متاسفانه، اینطور نیست.

ابتدا، این توابع ساختیارگر بدون پارامتر هستند. با استفاده از روش پیشوند، نمی‌توان از طریق انتقال پارامتر به توابع ساختیارگر برای تنظیم مقادیر اولیه ویژگی‌ها استفاده کرد، زیرا ویژگی color برای Car1 و Car2 برابر با "blue" است، ویژگی doors برای هر دو برابر با 4 است و ویژگی mpg برای هر دو برابر با 25 است. این به این معناست که باید پس از ایجاد اشیاء ویژگی‌های پیش‌فرض را تغییر داد، که بسیار ناخوشایند است و هنوز تمام ماجرا تمام نشده است. مشکل واقعی وقتی رخ می‌دهد که ویژگی‌ها به جای توابع به اشیاء اشاره دارند. اشتراک‌گذاری توابع مشکل ایجاد نمی‌کند، اما اشیاء به ندرت بین چندین نمونه اشتراک‌گذاری می‌شوند. بیایید به مثال زیر فکر کنیم:

فانکشن کار() {
}
Car.prototype.color = "blue";
Car.prototype.doors = 4;
Car.prototype.mpg = 25;
Car.prototype.drivers = new Array("Mike","John");
Car.prototype.showColor = function() {
  الرٹ(اینٹھی کلر);
};
var oCar1 = new Car();
var oCar2 = new Car();
oCar1.drivers.push("Bill");
alert(oCar1.drivers);	// نمائش "Mike,John,Bill"
alert(oCar2.drivers);	// نمائش "Mike,John,Bill"

تی آئی آئی

علیکم دیئے گئے کوئی کد میں، پرزنل اٹرائیب drivers کا آئیٹم پوائنٹر ہے جس میں دو نام "Mike" اور "John" شامل ہیں۔ چونکہ drivers کا پوائنٹر مریمنٹ کا آئیٹم ہے، دونوں نمونوں کا آئیٹم دونوں نمونوں کی جانب کا حوالہ دیتا ہے۔ یعنی 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() {
  الرٹ(اینٹھی کلر);
};
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"

تی آئی آئی

ابجائی وضاحت ہوئی ہے کہ یہ اب عام آئیٹم بنانے کی طرح ہے۔تمام غیر فنکشن پرزنل اٹرائیب اٹرائز میں بنائی جاتی ہیں، جس سے وضاحت ہوتی ہے کہ اب اٹرائز کے پارامتروں کی مدد سے اٹرائیب کی دفعتی وقوعی اٹرائیب دی جاسکتی ہیں۔ چونکہ صرف 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() {
      الرٹ(اینٹھی کلر);
    };
    کار._initialized = تور;
  }
}

تی آئی آئی

تکمیل Car._initialized کا چیک کرنے تک، یہ کانسٹرکٹر تبدیل نہیں ہوتا۔ یہ سطر دینامک پرایمٹائپ طریقوں میں سب سے اہم حصہ ہے۔ اگر یہ مرتبہ نہیں بنا ہوا ہے (یعنی اس کا مرتبہ undefined ہے)، تو کانسٹرکٹر پروٹوٹائپ طریقے کے ذریعے اوبجیکٹ کی طریقیں تعریف کرے گا، اور Car._initialized کو true رکھے گا۔ اگر یہ مرتبہ بنا ہوا ہے (یعنی اس کا مرتبہ true ہے)، تو اس طریقے کو اب بنا نہیں کیا جائے گا۔ خلاصہ کہ اس طریقے میں (آئی این ڈی) نشان کار استعمال کیا جاتا ہے تاکہ پتہ لگایا جائے کہ پروٹوٹائپ کو کیا ملا ہوا ہے۔ اس طریقے میں صرف ایک بار ایجاد اور تعین کیا جاتا ہے، قدیمی OOP ترقی کاروں کو یہ خوش آمدید آور کا لگتا ہوگا کہ اس کد نے دیگر زبانوں میں کلاس کی تعریف کی طرح دیکھائی دیتی ہے۔

مکمل کارخانہ طریقہ

یہ طریقہ عام طور پر پہلے کے طریقوں کو استعمال نہ کر سکے گئے وقت کا طریقہ ہے۔ اس کا مقصد جعلی کانسٹرکٹر بنانا ہے، جو صرف دوسرے اوبجیکٹ کی نئی نمائندگی کو واپس دینا ہے۔

یہ کد کارخانہ فانکشن سے بہت مشابهت رکھتا ہے:

فانکشن کار() {
  وار اوٹمپکار = نیو اوبجیکٹ;
  اوٹمپکار.کلر = "بلو";
  اوٹمپکار.درز = 4;
  اوٹمپکار.ایم پی جی = 25;
  اوٹمپکار.شو کلر = فانکشن() {
    الرٹ(اینٹھی کلر);
  };
  ریٹرن اوٹمپکار;
}

تی آئی آئی

کلاسیک طریقے سے متفاوت، یہ طریقہ نیو آپریٹر کا استعمال کرتا ہے، جس سے یہ اس طرح دیکھائی دیتی ہے کہ یہ حقیقی کانسٹرکٹر ہے:

وار کار = نیو کار();

کیر کانسٹرکٹر میں نیو آپریٹر کا استعمال کیونکے ساتھ، دوسرے نیو آپریٹر کو (کانسٹرکٹر کے باہر) نظر انداز کردیا جائے گا، کانسٹرکٹر کے اندر بنائے گئے اکائی کو کیر متغیر کو پاس کیا جائے گا۔

یہ طریقہ کانسٹرکٹر کی داخلی کئکٹر کی بندوبست میں کلاسیک طریقوں کی طرح کی مسائل رکھتا ہے۔ بہت مشورہ دیا جاتا ہے: جس میں ممکن نہیں ہو، تو اس طریقے کو استعمال نہ کریں۔

کدام طریقہ اختیار کریں

جیسا کہ پہلے کہا گیا ہے، فی الحال سب سے زیادہ استعمال میں آنے والا مکمل کانسٹرکٹر/پروٹوٹائپ طریقہ ہے۔ علاوہ ازیں، دینامک اصل طریقوں بھی بہت مقبول ہیں، جو کانسٹرکٹر/پروٹوٹائپ طریقوں سے برابر کا کام کرتے ہیں۔ کسی بھی کونسٹرکٹر میں سے استعمال کرسکتے ہیں۔ لیکن کسی بھی کی طرح کانسٹرکٹر یا پروٹوٹائپ طریقوں کو علیحدہ ازحد استعمال نہ کریں، کیونکہ اس سے کد میں مسائل پیدا ہو سکتے ہیں۔

مثال

آبجکت کا ایک دلچسب حصہ وہ طریقہ ہے جس میں وہ مسائل کو حل کرتا ہے۔ ECMAScript میں سب سے زیادہ مشکل ایک ہے جو زبانیں کونکشن کی کارکردگی کی وجہ سے پیش آتی ہے۔ دیگر زبانوں کی طرح، ECMAScript کی زبانیں غیر متغیر ہیں، یعنی ان کا مالامال نہیں بدل سکتا۔ درست منظر نامزد کریں:

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

حقیقت میں، اس کوپ کے پیچھے کئے جانے والے اقدامات مندرجہ ذیل ہیں:

  1. "hello " کو ذخیرہ کرنے والی سٹرنگ کی تشکیل
  2. "world" کو ذخیرہ کرنے والی سٹرنگ کی تشکیل
  3. جوڑنے کی نتائج کو ذخیرہ کرنے والی سٹرنگ کی تشکیل
  4. str کی موجودہ کانٹینٹ کو نتائج میں کاپی کریں۔
  5. "world" کو نتائج میں کاپی کریں۔
  6. str کو اپدیت کریں تاکہ وہ نتائج کی سمت دیکھ سکے۔

جب تک کہ سٹرنگ کو جوڑنا کا عمل انجام دیا جاتا ہے تو کوئی قدم 2 سے 6 تک کا کارروائی کی جاتی ہے، جس کی وجہ سے یہ عمل بہت کھپت کار ہوتا ہے۔ اگر یہ عمل بار بار چار سو یا چار سو سے زیادہ بار انجام دیا جاتا ہے تو یہ کارکردگی کی مسئلے پیدا کر سکتا ہے۔ حل یہ ہے کہ سٹرنگ کو آرائی اوبجیکٹ میں ذخیرہ کیا جائے اور اس کا join() طو رپرز (پارامتر خالی سٹرنگ) استعمال کیا جائے تاکہ آخری سٹرنگ کی تشکیل کی جائے۔ تصور کریں کہ نیچے کا کوڈ جگہ کی جائے:

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

یہ طرح، جب تک آرائی میں کتنا بھی سٹرنگ لا آئیں، کوئی مسئلہ نہیں ہوگا، کیونکہ جوڑنا صرف 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();

تی آئی آئی

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()) + " میلسیکن");
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("<br />Concatenation with StringBuffer: ")
 + (d2.getTime() - d1.getTime()) + " میلسیکن");

تی آئی آئی

یہ کوڈ ناگل بندی کو دو ٹیسٹ کرتا ہے، پہلا ایک جو پلس استعمال کرتا ہے، دوسرا ایک جو StringBuffer کلاس استعمال کرتا ہے۔ ہر عمل میں 10000 ناگل بندیوں کو جوڑا جاتا ہے۔ تاریخ کی اقدار d1 اور d2 استعمال کی جاتی ہیں تاکہ پورا عمل کی مدت کو جانا جائے۔ لطفاً یاد رکھیں کہ جب کوئی تاریخ شیئر کو بجائی دینے کیلئے کوئی پارامتر نہیں دیا جاتا تو شیئر کو موجودہ تاریخ اور وقت دیا جاتا ہے۔ جوڑنے کی مدت کو جانا جائے تو تاریخ کی میلسیکن نمائش کو (getTime() کی واپسی کی وجہ سے) کی وجہ سے فرق کریں، یہ جاوااسکریپٹ کی کارکردگی کا ایک مشہور طریقہ ہے۔ اس ٹیسٹ کا نتیجہ آپ کو StringBuffer کلاس اور پلس استعمال کی کارکردگی کی فرق کو مقایسہ کرنے میں مدد کرتا ہے۔