jQuery load() method parameters usage? - javascript

According to jQuery load() method api:
.load( url [, data] [, complete(responseText, textStatus, XMLHttpRequest)] )
1st parameter is url
2nd parameter is map or string that is sent to the server
3rd parameter is callback function.
With the working example below
$('#result').load('ajax/test.html', function() {
alert('Load was performed.');
});
it supplies arguments of 'url' and 'callback function', [data] argument is skipped.
Shouldn't the example code treat the callback function as [data] argument (2nd parameter) ? Because of the order that parameters defined in the API . By following the API, 1st is url, 2nd is data, 3rd is callback.
I don't get why the code would work. Very confused.

It is very clearly written in the jQuery source code.
https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js
Search for load: function( url, params, callback )
It checks for the params (second parameter) and if it exist, It will call the isFunction method which internally check the type of the argument and return true if it is a function. The rest you know....
This is how isFunction looks like

No, It inspects the datatype of the parameters. If it finds a function as the second parameter then it uses it as a callback.
The position and order of the parameters has been thought out with the typical use-cases in mind and in stead of having to give a null value to skip a parameter .load('url', null, null, function() {}); you just imagine that the parameters "shift" places when skipped.
This applies to a lot of functions not just .load.

The square brackets ([]) around a parameter in the documentation indicate that it is optional. So your example is perfectly valid according to said documentation.

Checkout jquery's source file ajax.js in Github: https://github.com/jquery/jquery/blob/master/src/ajax.js#L178
Here it checks whether second argument is function. If yes, it takes it as the callback and params as undefined.

The brackets in the specification means that the parameters are optional, so you can use any of these forms:
.load(url, data, complete)
.load(url, data)
.load(url, complete)
.load(url)
The method will figure out if the second parameter is a callback function or a data object/string depending on the data type.

Related

Could you tell me what is function(el)?

I have some code:
hideLoadMask : function(response,config){
//Once the response is processed for a particular request it will be removed from the processing array
this.loadMaskRequestQueue =
this.loadMaskRequestQueue.filter(function (el) {
return el.requestID !== response.requestID;
});
}
Here in el contains the data like:
loadingText: "Loading...Please wait."
requestID: 1
When I call hideLoadMask(), I pass response="Loading...Please wait."
Could you tell me what is function(el), how my response parameter's value became as a field to el, what is requestID.
Please clarify my doubts.
It's an inline anonymous function definition that serves as a callback to the .filter() method.
The .filter() method takes a callback that it calls to carry out it's operation. You can either define a named function elsewhere and then pass that function's name or you can define the callback function inline with this type of syntax.
The el in the function(el) signifies that the .filter() method will call the callback with at least argument (the array element currently being filtered) and this is the argument that the callback wishes to use. If you check the documentation for .filter() here, you will see that it actually passes three arguments to the callback, but this particular callback only cares to use the first argument so that's the only one it bothers to declare.

Calling a no param javascript function with a param

Does javascript not check function parameters when invoking.
This function "test" below fires even though it is being called with no parameter.
<input type="button" value="test" onclick="test()">
test = function(param){
alert("test");
}
fiddle :
http://jsfiddle.net/Yazpj/1912/
Should an error not being thrown or does the javascript engine/parser not even check function parameters when finding what to call. Does this have any implications for overriding functions ?
No, JavaScript does not check parameters.
Extra parameters will be ignored. Parameters declared but not passed will have a value of undefined. All passed parameters (declared or otherwise) will appear in the arguments pseudo-array.
There are no implications for overriding functions because JS does not support overriding functions.
Libraries such as jQuery that have methods with multiple signatures use a single function that figures out the type of the passed parameters and then performs the required action.
You have to check on your own:
var test = function (param) {
if (typeof param === 'undefined') {
// do something...
}
};
Javascript is a really flexible language and this is just one example of it. Unless you are not accessing the param it won t rise any error e.g. param.sender
As for your override question it is sort of true. Every Javascript function has a arguments variable which is the array of passed parameters. if you give name the parameter defining the function JS just give it to you according to order.
But overriding is another story the overriding is achieved by checking the arguments element sometimes just length of the array sometimes type of the individual item.
For example; when you call $("#name").val() as there is no item it just return the value if arguments has values this time jQuery user proper assignment e.g. element.value = arguments[0]

why are square brackets used in javascript function calls? jquery

From:
andrew whittakers example showing result numbers in a custom jquery autocomplete implementation
_response: function(contents){
$.ui.autocomplete.prototype._response.apply(this, arguments);
$(this.element).trigger("autocompletesearchcomplete", [contents]);
}
why [contents] and not contents ?
It's a requirement from jQuery's trigger function that the second parameter be an array (prior to 1.6.2), thus the wrapping to make it an array. From the trigger docs (emphasize by me):
$('#foo').bind('custom', function(event, param1, param2) {
alert(param1 + "\n" + param2);
});
$('#foo').trigger('custom', ['Custom', 'Event']);
The event object is always passed as the first parameter to an event
handler, but if additional parameters are specified during a
.trigger() call, these parameters will be passed along to the handler
as well. To pass more than one parameter, use an array as shown here.
As of jQuery 1.6.2, a single parameter can be passed without using an
array.
So as of 1.6.2, it's actually not necessary to wrap the single argument in an array.
If the function expects an array, then you put your one or more elements in square brackets. For example, trigger's function declaration is
.trigger( eventType [, extraParameters] )
Since you may want to give it more than one extra parameters, it accepts an array of them. If you have only one extra parameter to give, such as "contents" in your case, then you can put it into an array (or if you have just one parameter, you also can not put it into an array, as JQuery now accepts either way).
As Trinh pointed out its an array [content] with one element.
I dont know why but if you change it to content instead of [content] it will search for the query in the whole word.
If its [content] it will search only at the beginning.

Passing an array in a single argument using jQuery deffered.resolveWith()

I have a jQuery deferred, which I an resolving like so:
deferredAction.resolve(returnArray);
and this is calling a callback like:
function someCallback(myArray) {
...
}
This works fine, the callback function receives the array. However I need to set the context of the callback function, so I used deferred.resolveWith like so:
deferredAction.resolveWith(someContext, returnArray);
The context is now being set correctly. However, it now seems as if the returnArray is being split up. My callback only receives the first item of the array.
Why is this happening, and how can I work around it?
The documentation states that you should pass the arguments in a single array. In your case:
deferredAction.resolveWith(someContext, [returnArray]);
I fixed this by putting square brackets around the return parameter:
deferredAction.resolveWith(someContext, [returnArray]);

JavaScript: Sending comma separated string of parameters to a javascript function

I am having a function in javascript as
function add(v1,v2){
var add=v1+v2;
}
Now I am calling this function as below -
write.out(var param="1,2";);
write.out(window[add](param););
Using the above call, it's not working. What it does is it gives the complete string "1,2" as value to the first param(v1) of the function.
Its working if I call the function in following way -
write.out(var param1="1";);
write.out(var param2="2";);
write.out(window[add](param1,param2););
I want to achieve it using the first way where i can send the parameters as a comma separated string of parameters.
Can some one help me out how this can be done...
Thanks!!!
You can make usage of ECMAscripts .apply(), which calls a function and accepts an array of paramters.
window['add'].apply(null, param.split(','));
That way, we execute the add function, setting its context to null (you could also change that if you need) and pass in the two paramters. Since we need an Array, we call split() on the string before.
So basically, the above line is the same as
add(1,2);
Since you're haveing that function in the global context (window), we don't even need to write it that explicitly.
add.apply(null, param.split(','));
will just be fine.

Categories