javascript模拟实现toAarray()方法代码实例

快乐打工仔发布于 2年前分类：实例代码

本章节介绍一下如何模拟实现toAarray()方法。

在jQuery中有此方法的声明，具体可以参阅jQuery toArray()一章节。

本章节就借鉴一下jQuery的实现方式，单独将此功能独立出来。

代码实例如下:

<!DOCTYPE html>
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="http://www.pipipi.net/" /> 
<title>前端教程网</title> 
<script>
function isArrayFn(value) {
  if (typeof Array.isArray === "function") {
    return Array.isArray(value);
  }
  else {
    return Object.prototype.toString.call(value) === "[object Array]";
  }
}
 
var core_slice = Array.prototype.slice;
function toArray(elements){
  return core_slice.call(elements);
}
 
window.onload = function () {
  var obox = document.getElementById("box");
  var odiv = document.getElementById("antzone");
  var lis = obox.getElementsByTagName("li");
  var arr = toArray(lis);
  odiv.innerHTML = isArrayFn(toArray(arr));
}
</script>
</head>  
<body>
<div id="antzone"></div>
<ul id="box">
  <li>前端教程网一</li>
  <li>前端教程网二</li>
  <li>前端教程网三</li>
  <li>前端教程网四</li>
  <li>前端教程网五</li>
</ul>
</body> 
</html>

上面的代码在div中输出结果为true，说明toArray()函数实现了将元素集合转换成数组的功能。

我们可以将toArray()方法再封装一下，代码如下:

function toArray(elements) {
  var core_slice = Array.prototype.slice;
  return core_slice.call(elements);
}