Develop Reference

Can we override the inbuilt functions in Javascript?

I have plenty of pages on my website with javascript embeded in them.
alert() which is a javascript function has been used in all my scripts atleast once. I want to use custom alert box which will render same in all the browser.
I can define my own function like
function customAlert()
{
// Code goes here.
}
But have to replace alert() withcustomAlert() in all my web pages which is a time consuming process.
Instead can't we just modify native alert function accordingly and it reflects the same as in all browsers.
I think we can't use this
function alert()
{
// Code goes here.
}
because alert is a reserved javascript word for function name.
If there is a better way for implementing the same with different technique, then feel free to answer.
I hate to use jquery or any other frameworks library so please answer regarding pure javascript.

The alert is a property of the global window object, thus you can override it in the following way:
window.alert = function (message){
//do your code
};
and then use it the way you used it before:
alert('hi');

Anonymous JavaScript function not executing

I could really use a second pair of eyes on this. I get the following error:
"Uncaught TypeError: undefined is not a function"
Can anyone see what is wrong with this function because I can't seem to debug
$(function(){
$('#div-id').insertBefore('#sumbit-button');
})();

jQuery already executes the function you pass to it, it does not return a function so you can't call it.
$(function(){
$('#UGInterestedIn').insertBefore('#sumbit-button');
});

There's 2 different things you can mean with this code. Either you're trying to make a function run on DOM ready, which would use the jQuery code:
$(function(){
$('#UGInterestedIn').insertBefore('#sumbit-button');
});
Which is also what aduch said, but you can also be referring to a self-executing anonymous function, which would be this vanilla JS code:
(function(){
$('#UGInterestedIn').insertBefore('#sumbit-button');
})();
The difference is that the first code requires jQuery to be included on the page, and loads the code when the DOM is ready. The second code runs the code immediately, but uses the anonymous function to change the scope of the variables. You're probably trying to do the first thing, but I thought I'd let you know about the second one too.

Why can't I access objects through the window object when using jQuery?

I'm trying to access a function through the window object. In my code, my function gets referred to by a string so I have to use the window object (or eval) to grab it. I tested out my code in pure JavaScript and it works perfectly. But when using jQuery it fails. Here is my test code:
function speak(words, callback){
for(var i=0;i<10000;i++){
console.log(words);
}
if(callback)
callback.call();
}
console.log(window['speak']);​
Here is a link to the pure JavaScript version which works.
Here is a link to the jQuery version which doesn't work.
What do I need to do to make this work in jQuery?

You didn't declare speak as a member of window, and JSFiddle actually wraps it in a document.ready callback. You'll need to explicitly set window.speak = speak as part of your code if you want it available on the window object.
Alternatively, you need to configure your fiddle to execute without a wrapper rather than onDomReady

Self invoking functions javascript

I wrote a self invoking function in both firefox and chrome it it wouldn't invoke.
I wrote something to the effect of
(function () { alert("THE"); })();
do self invoking functions not work in current browsers?
I did include all essential tags and all other code works on the page

"Self-invoking functions" are not really a part of javascript, it's just a term that people are calling a specific pattern of code (like AJAX, etc.); these patterns should work anywhere that javascript works.
What you're calling a "self-invoking function" is just creating an anonymous function and immediately calling it (as opposed to say storing it in a var, as an object value, as a function param, etc.).
That is, the following are basically the same:
var f = function(){...}; f()
and
( function(){...} )()
So because your 'self-invoking function' is a basic part of javascript, there is no possible way it's not working unless the insides aren't working or your environment is messed up. You could copy-paste your code onto a new blank page, and it would work fine. Something else must be going wrong:
Check your errors in your dev console. Specifically, check to make sure you don't have a syntax error or that there isn't some weird thing going on with the webpage you're testing it on (e.g. if you somehow redefine alert...).

I had this issue with a self invoking function which produced this error...
Uncaught TypeError: object is not a function
The problem was caused by not having a semi colon ending the line before the opening bracket

That function works. Javascript supports functional programming, so for a browser not to run that code, even for a very old browser that would be absurd. Are you sure that statement is being reached? Try debugging javascript that occurs before that statement.

<script type="text/javascript">
(function() {
alert('Hello World!');
})();
</script>
Works in every browser I have installed on this machine.

This function definitely works. I would check your browser's console for any js errors in your page. Perhaps you could try to put a simple console.log function at the beginning of your script to see if any JavaScript is being called in the first place.

This self invoking function with return value will work in all current browsers(Safari, Chrome and Firefox) without issue. This function executes immediately, automatically and anonymously.
<script type="text/javascript">
alert((function(){
return("Hello World");
})());
</script>

I had a similar problem. I'm mentioning it below.
I couldn't run this self-invoking function on any browser
(function myfunc() {
var x = 34;
console.log(x);
})();
but whenever I added window.onload like below, it worked fine:
window.onload = (function myfunc() {
var x = 34;
console.log(x);
})();

How can I add JS code that dynamically wrap any function invocation?

I had like to wrap any JavaScript invocation at runtime,
e.g. I had like to write to a log that an invocation of Func has been occurred.
This wrapping must work for any function even those function that has been added using eval or prototyping.

What your looking for is node-proxy
You can't do this using native JS. This will only work for node.js. It can probably be adjusted to work for any js running on V8.

If you were to call your functions with the call method, you could do something like this:
oldCall = Function.prototype.call;
Function.prototype.call = function(){
// do some logging here
oldCall.apply(this, arguments);
}