Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

伪数组、类数组 对象介绍以及区别 #20

Open
Kelichao opened this issue Nov 5, 2016 · 0 comments
Open

伪数组、类数组 对象介绍以及区别 #20

Kelichao opened this issue Nov 5, 2016 · 0 comments

Comments

@Kelichao
Copy link
Owner

Kelichao commented Nov 5, 2016

伪数组(伪数组在jQuery对象中用的非常多)

构造一个类数组必须有两个条件

  1. 第一个条件:你必须给对象定义个splice方法,只要他是一个function就可以
  2. 第二个条件:就是赋值一个length属性,或者增加push,unshift,shift,pop其中任何一个方法,并且调用了一次。

-----------------------------------------------------分割线-------------------------------------------------------

当这两个条件同时满足那么当前的对象在控制台输出后跟数组的格式一模一样。

var obj = {
    length: 0,
    splice: [].splice
 };

image

同样可以实现类数组的代码,除了splice,其他四个方法只要定义了其中的任何一个并且调用了。

var blankArray = [];
var obj = {
    splice: blankArray.splice,
    push: blankArray.push,
    unshift: blankArray.unshift,
    pop: blankArray.pop,
    shift: blankArray.shift
};
obj.push();
obj.unshift();
obj.pop();
obj.shift();

自己写的可以模仿类数组对象

对于jQuery中的节点数组,其实是通过数组构造的,然是其原型链继承了jQuery对象的方法,所以其不仅具有数组的特性,又具有对象的特性。

// 模仿jQuery的选择器对象拿到的对象写法,通过Object构造,但形式为数组
var a = Object.call(new Array());
a[1]=1;
a[0]=0;
a.length=3;
a.__proto__ = $.prototype;// 继承jQuery的原型链
console.log(a);
console.log(Object.prototype.toString.call(a));

image

jQuery中的写法

var arr =[];

var obj = {
	0:123,
	1:234,
	"af":"13",
    length: 0,
    push:[].push,
    splice: [].splice
 };

obj.push(567);
console.log(obj);// [567, 1: 234, af: "13"]
console.log([].slice.call(obj));// [567]

转自博客园

-----------------------------------------------------分割线-------------------------------------------------------

类数组

JavaScript中,数组是一个特殊的对象,其property名为正整数,且其length属性会随着数组成员的增减而发生变化,同时又从Array构造函数中继承了一些用于进行数组操作的方法。而对于一个普通的对象来说,如果它的所有property名均为正整数,同时也有相应的length属性,那么虽然该对象并不是由Array构造函数所创建的,它依然呈现出数组的行为,在这种情况下,这些对象被称为“类数组对象”。以下是一个简单的类数组对象:

var o = {0:42, 1:52, 2:63, length:3}
console.log(o);

与普通对象不同的是,类数组对象拥有一个特性:可以在类数组对象上应用数组的操作方法。比如,在ECMAScript 5标准中,可以用以下方法来将上面的对象o合并成字符串:

console.log(Array.prototype.join.call(o));//"42,52,63"

也可以在类数组对象上使用slice()方法获取子数组:

console.log(Array.prototype.slice.call(o, 1, 2));//[52]

在浏览器环境中,document.getElementsByTagName()语句返回的就是一个类数组对象。在function调用中,function代码内的arguments变量(保存传入的参数)也是一个类数组对象。
在ECMAScript 5标准中,字符串string就是一个只读的类数组对象:

var s = "History";
console.log(s[3]);//t
console.log(Array.prototype.join.call(s, " "));//H i s t o r y

部分内容转自脚本之家

@Kelichao Kelichao changed the title JavaScript中的类数组对象介绍 伪数组、类数组 对象介绍以及区别 Nov 8, 2016
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant