测试一个jQuery的功能

大家好我是新来的jQuery和javascript.I已经写了一个代码，并想测试它。但我坚持在某一点，需要专家的帮助。测试一个jQuery的功能

这里是我的jQuery类myfile.js

$.fn.MyClass = function(arg1 ,arg2, arg3) { 

    function MyFirstFunc (arg1, arg3) { 
    //Do some thing 
    return arg1 + arg3; 

    }; 

    function MySecFunc (arg2, arg3) { 
    //Do some thing 

    }; 
MyFirstFunc(arf1 ,arg2); 
}

而且在我的index.html文件中定义我要叫DOM对象jQuery的我的班这样

$("#div1").MyClass(agr1_val, arg2_val, arg3_val);

现在我想对这些函数进行单元测试，并将测试用例保存在单独的文件中。我选择了Qunit。我已经写了下面的测试

test('MyFirstFunction function test', function() { 
    equal(MyFirstFunc (4, 5),"9" ,"function working correctly"); 
});

也是我index_test.html文件我已经给myfile.js的路径，但仍然Qunit是给我的错误

在文件死于测试＃1：/ //var/www/test.js:2:1：MyFirstFunc没有定义

任何一个可以指导恳请我在哪里做错了，以及如何通过保持测试用例在一个单独的文件来测试功能或者任何其他更好的方式来做到这一点。

谢谢

来源

2012-07-13 A_user

首先你在你的jquery对象中声明坏方法。

相反的：

function MyFirstFunc (arg1, arg3) {

你应该使用：this.MyFirstFunc = function(arg1, arg3) {

你也应该调用一个jQuery对象的方法，如本例：

equal($("#div1").MyClass(1, 2, 3).MyFirstFunc(4, 5),"9" ,"function working correctly");

下面是一个例子正在进行的Qunit测试：

$.fn.MyClass = function(arg1 ,arg2, arg3) { 

    this.MyFirstFunc = function(arg1, arg3) { 
     //Do some thing 
     return arg1 + arg3; 

    }; 

    this.MySecFunc = function(arg2, arg3) { 
     //Do some thing 
    }; 

    return this.MyFirstFunc(arg1, arg3); 
}; 

$(function() { 
    $("#div1").MyClass(1, 2, 3); 
}); 

test('MyClass function test', function() { 
    equal($("#div1").MyClass (1,2,3),"4" ,"function working correctly"); 
});

来源

2012-07-13 05:39:17

非常感谢您的回复，但我想自动调用一个init函数在我的文件中定义，请参阅编辑 – 2012-07-13 05:48:04

然后你使用jquery对象？ – 2012-07-13 05:53:10

其实我在我的DIV对象上调用这个类，并在该div上绘制了一个图表。真正的代码很长，所以我给出了一个简化的例子 – 2012-07-13 05:59:11

未定义MyFirstFunc方法。为了公开使用这些函数，必须在返回数组中定义MyFirstFunc和MySecFunc。您可以定义它像这样

$.fn.MyClass = function (arg1, arg2, arg3) { 

    function MyFirstFunc(arg1, arg3) { 
     //Do some thing 
     return arg1 + arg3; 

    }; 

    function MySecFunc(arg2, arg3) { 
     //Do some thing 

    }; 

    return { 
     MyFirstFunc: function (arg1, arg3) { 
      return MyFirstFunc(arg1, arg3); 
     }, 
     MySecFunc: function (arg2, arg3) { 
      return MySecFunc(arg2, arg3); 
     } 
    } 
}

而且随着

test('MyFirstFunction function test', function() { 
    equal($().MyClass().MyFirstFunc(4, 5),"9" ,"function working correctly"); 
});

来源

2012-07-13 05:40:57 Bobby

非常感谢您的回应但我不知道为什么我仍然得到相同的错误：/ – 2012-07-13 05:59:52

我现在有下面的错误对象[对象对象]没有方法'MyClass' – 2012-07-13 06:01:31

的问题不在于你的测试用例进行测试，它与你的函数定义。你不能简单地在另一个函数中声明一个函数，并期望在全局名字空间中访问它。 JavaScript中函数定义的一个基本属性是它们是唯一提供范围的东西，所以当你使用函数作为对象时，对象的“实例变量”（在函数中声明）只能在该对象内部访问。

如果您尝试使用方法创建对象，则需要将这些函数分配给对象的实例变量。 JavaScript中对象的实例变量是通过在构造函数（用于定义对象的函数）中分配this.<variable>来定义的。这样一来就给MyClass两种方法，你应该做这样的事情：

MyClass = function(arg1, arg2, arg3) { 

    this.myFirstFunc = function(arg1, arg2) { 
     //Do something 
    }; 

    this.mySecFunc = function(arg1, arg2) { 
     //Do something 
    }; 
}; 

var myInstance = new MyClass(x,y,z); 
myInstance.myFirstFunc(a,b);

注意，只是给你的函数参数相同的名称作为构造函数的参数不从构造函数的方法传递参数。定义一个函数不会传递具体参数，所以MyFirstFunc arg1和arg2被解释为您可能传递给MyFirstFunc的参数的名称，而不是将外部函数的参数传递给MyFirstFunc的指令。

最后，$.fn属性是一个别名jquery.prototype，所以你正在使用$.fn.MyClass = function...做的是分配一个新的属性给jQuery对象，基本上是打补丁用自己的附加库。这可能不是你想要定义函数的一般方式，但我不知道你的用例。

来源

2012-07-13 05:41:28 Edward

Thanks @ Edward实际上在我的情况下，我想使用它像这样$（“＃div1”）。MyClass（agr1_val，arg2_val，arg3_val）; 所以我发现没有办法，只能写它像$ .fn因为我对这一切都很新，所以没有知道最好的方法 – 2012-07-13 05:51:50

测试一个jQuery的功能

回答

相关问题