有人能解释为什么array.length会在这里返回两个不同的结果吗

Can anyone explain why array.length would return two different results here?

本文关键字:两个 结果 为什么 能解释 array length 返回 在这里      更新时间:2023-09-26

你能看看这个吗:

(function ($) { 
    $.fn.extend({
        grid: function (settings) {
            var defaults = {
                data: [
                    ['Code','Name','Email','Other'],
                    [1,'John','john@domain.com','Johny'],
                    [2,'Bob','bob@domain.com','Bobby'],
                    [3,'Jenny','jenny@domain.com','Jen'],
                    [4,'Mary','mary@domain.com','Maryann']
                ],
                test: this.data.length
            };
            var config = $.extend(defaults, settings);
            return this.each(function(){
                this.innerHTML = config.data.length;
                this.innerHTML += "<br />" + config.test;
            });
        }
    });
}(jQuery));
$('.content').grid();

http://jsfiddle.net/w8PG6/

解释为什么这两个结果不同

还有我如何实现期望的结果

问题是,当您调用this.data.length时,它实际上计算的是jQuery data函数的长度,而不是defaults的长度。此外,在分配defaults.data之后才能计算其长度。

看看这个工作示例:http://jsfiddle.net/w8PG6/1/

在执行this.data.length时,看看this.data是什么。它是根据grid匿名函数中this的值来评估的,即jQuery.fn。所以是jQuery.fn.data。Function.length是函数的arity(参数的数量(,为2(键、值(。

this不是指正在构建的对象,而是指当前上下文中的任何this。在您的案例中,this恰好有一个名为data的属性。比较:

var foo = {
    bar  : "bar",
    test : this.bar
}

这根本不起作用。除非在同一上下文中存在var bar,否则foo.test就是undefined。我认为不可能在同一条语句中同时分配这两个值,因为在赋值语句完成之前,数组不会被分配给任何可以访问的值。你能做的最好的事情是:

var defaults = { data : [ ... ] };
defaults.test = defaults.data.length;