论坛首页 Web前端技术论坛

js中创建Object对象的性能分析

浏览 3088 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2008-05-06  
在javascript中创建一个对象有以下几种方式,如下:
1、
var obj = new Object();
obj.id=1;
obj.name="test";
obj.callFunc=function(){
	alert("callFunc");
}

2、
var obj = {};
obj.id=1;
obj.name="test";
obj.callFunc=function(){
	alert("callFunc");
}

3、
var obj = {
	id:1,
	name:"test",
	callFunc:function(){
			alert("callFunc");
		}
	};

那这3种方式各自的性能怎样呢,下面通过一段代码进行分析:
  <script>
  var start = new Date();
  for (var i=0;i<100000 ;i++ )
  {
	var obj = new Object();
	obj.id=i;
	obj.name="test";
	obj.callFunc=function(){
		alert("callFunc");
	}
  }
  
  document.write(""+(new Date() - start)+"ms");
  document.write("<br/>");
  
  start = new Date();

  for (var i=0;i<100000 ;i++ )
  {
	var obj = {};
	obj.id=i;
	obj.name="test";
	obj.callFunc=function(){
		alert("callFunc");
	}
  }
  document.write(""+(new Date() - start)+"ms");
  document.write("<br/>");
  

	start = new Date();
  for (var i=0;i<100000 ;i++ )
  {
	var obj = {
	id:i,
	name:"test",
	callFunc:function(){
			alert("callFunc");
		}
	};
  }
  document.write(""+(new Date() - start)+"ms");
  
  </script>

当然这里每次执行的结果有一定的差别,但差别不会很大,我这里某一次运行的结果如下:
1078ms
938ms
812ms
这里可以说,第一种方法创建对象是效率最低的,第二种方式居中,第三种方式最快,但这种效率只有在对象的属性特别多,或者创建的对象特别多的时候才可以看出来。

这个执行效率和对象的多少以及对象属性的多少有关系,代码如下:
   <script>
  var start = new Date();

  for (var i=0;i<5000 ;i++ )
  {
	var obj = {
	id:i,
	name:"test",
	callFunc:function(){
			alert("callFunc");
		}
	,
	callFunc2:function(){
			alert("callFunc2");
		}
	,
	callFunc3:function(){
			alert("callFunc3");
		}
	,
	callFunc4:function(){
			alert("callFunc4");
		}
	}
  }
  document.write(""+(new Date() - start)+"ms");
  document.write("<br/>");
  

	start = new Date();
  for (var i=0;i<10000 ;i++ )
  {
	var obj = {
	id:i,
	name:"test",
	callFunc:function(){
			alert("callFunc");
		}
	};
  }
  document.write(""+(new Date() - start)+"ms");
  
  </script>

140ms
63ms
上面这段代码同样可以看出,虽然都是采用相同的第三种办法来创建对象,但由于第一段代码中的属性有6个(function也算属性的一种),执行5000次,而第二段代码属性为3个,执行10000次,显然第一段代码的效率明显要慢。

在我们自己写js代码的时候,尽量使用var obj = {};这种方式去创建代码,既可以节省空间,也有利于提高性能。还有就是定义尽可能少的属性。
   发表时间:2008-05-06  
这个性能差异基本可忽略不计。
0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics