Cloner un objet avec la fonction clone

Comment cloner un objet en javascript

clone javascript, javascript clone, vascript clone d objet, javascript d objet, js clone, clone js, copy object javascript, javascript copy object, fonction copier javascript, cloner un objet javascript, cloner objet js, javascript object copy, java clone

Date de publication : 2008-12-17

La fonction clone (plus bas dans l'article) permet de copier récursivement les propriétés d'un objet. En effet en javascript le comportement d'un = est de copier le pointeur de l'objet et c'est pour cela qu'il est parfois utile de cloner des objets.

Comportement par défaut de javascript :


var pomme = new Object();
pomme.name = 'pomme';

var banane = pomme;
banane.name = 'banane';

alert(pomme.name); //'banane'
alert(banane.name); //'banane'

Comportement avec le clonage d'objet :


var pomme = new Object();
pomme.name = 'pomme';

var banane = clone(pomme);
banane.name = 'banane';

alert(pomme.name); //'pomme'
alert(banane.name); //'banane'

La fonction de clonage :
Source de ce code


/*
 * Fonction de clonage
 * @author Keith Devens
 * @see http://keithdevens.com/weblog/archive/2007/Jun/07/javascript.clone
 */
function clone(srcInstance)
{
	/*Si l'instance source n'est pas un objet ou qu'elle ne vaut rien c'est une feuille donc on la retourne*/
	if(typeof(srcInstance) != 'object' || srcInstance == null)
	{
		return srcInstance;
	}
	/*On appel le constructeur de l'instance source pour crée une nouvelle instance de la même classe*/
	var newInstance = srcInstance.constructor();
	/*On parcourt les propriétés de l'objet et on les recopies dans la nouvelle instance*/
	for(var i in srcInstance)
	{
		newInstance[i] = clone(srcInstance[i]);
	}
	/*On retourne la nouvelle instance*/
	return newInstance;
}