modify insertBefore - javascript

Is there any way that I can replace the insertBefore and similar with my own functions. My aim is to implement an undo feature and if I'm able to implement it this way, I wont have to change each instance of insertBefore in my code with my function name and it would also make the further development easier.
I've found something similar here Disable a built-in function in javascript (alert) but am not able to figure out how to use it in my case because I dont know who is the parent of these functions (insertBefore,appendChild etc).
I just want to insert one line of my code and then call the native code.
Please advise
PS. I'm trying to implement an undo functionality and this library requires me to register an undo in that undo-function for allowing redo. So all I want to do is make that a single line of code is always executed before any insertBefore and similar functions.
I'm not talking about any libraries, but just the plain ECMAscript.

If you are talking about the insertBefore method of the Node interface, then whether you can or can't do is really moot. The important thing is that you shouldn't. It is a method of a host object and should be left alone.
Incidentally, the term built-in is normally used for the built-in objects and methods of ECMAScript. The window.alert method is more correctly described as a method of a host object and really shouldn't be tampered with either (although in general it can be).

Related

What is encapsulation in context of JavaScript?

What is encapsulation in context of JavaScript? I'm confused after reading this statement in mozilla web-site(link):
Encapsulation
In the previous example, Student does not need to know how the Person
class's walk() method is implemented, but still can use that method;
the Student class doesn't need to explicitly define that method unless
we want to change it. This is called encapsulation, by which every
class inherits the methods of its parent and only needs to define
things it wishes to change.
I've understood encapsulation as hiding class members, but in the example on the Mozilla site it seems to be simple inheritance.
It means that you don't have to be able to build the tools that you're using to use them.
It's makes programming a lot less stressful when you can abstract things like that away.
Have you ever used the alert() method in JavaScript?
I'm sure that you'd feel a bit overwhelmed if you had to care about how alert communicates with your browser, and how your browser communicates with your display and all the layers in-between.
You don't want to worry about the bezier curves used to render your fonts or how to implement the ok button, or all the other code that makes alert work. All you know is that you can write alert("txt") in JavaScript, and that a dialog box will appear.
walk is implemented in Person. Student isn't allowed to change how it's implemented, it can only override the function completely.
You could design a programming language that allows you to override parts of the parent function rather than the function as whole. This programming language has inheritance but not encapsulation.
Now of course if a child overrides part of a parent function, this means the child and parent implementations are coupled. This is generally considered bad practice. This is why most languages go so far as to enforce encapsulation, but it's not something you absolutely need.
Maybe a good analogy is a plugin mechanism. You can write plugins in different ways: use some event hooking or use clever inheritance but you can also do inline code replacement. Now before you think this is ridiculous, older versions of the popular forum software phpBB actually did this. You can imagine what happens if you install two plugins that might interfere, there's no telling what will happen!

lodash bind function using as jQuery eventHandler... is it possible?

I'm new to lo-dash, and wanted to know is it possible to use _.bind as $.bind and how can I accomplish this? I really want to get rid of jQuery and use something smaller...
What I need is to bind DOM events to functions
Those are two different mechanisms.
_.bind sets the this value of a function to the first parameter so that 'this' will always point to the same object in the function. I'd say it binds the scope of 'this' to the function, except that would be incorrect technically.
$.bind adds a jquery triggered event listener to a jquery wrapped element.
There are plenty of dom selection alternatives (such as zepto.js), but lodash/underscore libraries are really in addition to jquery, not in lieu of jquery.
That being said, this may not necessarily answer your question, except to say zeptoJs might be one such alternative. Again, Underscore/Lodash is not an alternative to but one or the other provides additional functionality (that in the long term will save file size.)
fwiw imho. 37k is not a valid arguments against jquery/lodash and other such tools. why?
1) If you serve your libraries from a cdn its not even a valid hit against the server.
2) These libraries help you write WAY SMALLER code.
In fact this claim sounds more like an excuse than a reason.
cheers.

Namespacing in jQuery?

I am currently working on a library plugin for jQuery that might eventually be released as an open source project.
I have written a number of custom element functions and would like to store everything related to my library in a namespace.
So for example, assume that I have a function called toggle(). Ordinarily, this would be called using $(selector).toggle(). However, I would like to call it, and other functions using something like $(selector).mylib.toggle() so as not to interfere with other libraries or plugins.
I have developed jQuery plugins in the past, but never needed to protect methods in this way. Can anyone point me in the direction of how I might author the functions to achieve this?
I'm not exactly sure, why you would want to do this and not use an "ordinary" namespace object which holds your methods. However, you might want to have a look at
jQuery.sub()
Description: Creates a new copy of jQuery whose properties and methods
can be modified without affecting the original jQuery object.
By "sub"(classing) the jQuery object, you don't have to care about conflicting with other plugins anymore. So if that is the only concern, go for it.
Ref.: .sub()

Theory for attaching javascript eventlistener to variables?

I was wondering wether there is a way to attach eventlisteners to variables. The idea is to do something like this:
someVar.addEventListener('change', someTodo, false);
So once someVar is changed by i.e. someVar=1, someTodo would be executed.
I think to understand that - in theory - eventlisteners can be added to everything in the DOM, the problem beeing that variables do not trigger those events, while HTML objects DO trigger them.
If that is indeed correct, the extended question would be: How to train DOM objects to trigger events? I have read something about prototyping, is that the trick here?
Please note: I like to understand and write all of my code myself. So I'd rather be interested in the theory then using some existing thing like jQuery, where all sorts of miracles are baked right in.
Marco
The safe and time tested approach is to use getters and setters on your objects (ie, you only allow access to the variable through object methods like getX()/setX()). You could then have overload setX() to trigger callbacks. There are some languages like Lua and Python where access to an object's members can be caught with meta functions but I do not believe Javascript supports this in any way.

Why build Javascript functions as jQuery plugins?

I've seen alot of jQuery implementations of existent JavaScript functions that merely wrap the JavaScript code in a jQuery wrapper and don't actually rely on any of jQuery's base for their operation.
What are the benefits of using Javascript as a jQuery plugin?
If there are none is there a speed loss to use a jQuery plugin that could have easily been implemented outside the wrapper just as well?
Many thanks in advance (just trying to learn something here).
Updated with example:
http://plugins.jquery.com/project/base64
was originally
http://www.webtoolkit.info/javascript-base64.html
Much of jQuery is just a clever wrapper around existing JavaScript functions. $('#some-element') is perhaps a little easier to type than document.getElementById('some-element') but is otherwise not much different.
(I exaggerate, but only slightly.)
The main utility of jQuery is being able to combine together its various components. If I can select elements with a jQuery selector and then perform some action on those elements directly through a jQuery function, that's preferable to having to extract the underlying DOM elements and manipulate them manually, for example.
So it really depends on what functions you're seeing get wrapped. Some of them might very well add no value, and the authors are simply accustomed to everything being in jQuery. (We definitely see that phenomenon on StackOverflow — people who can't find a standard JavaScript function simply because it's not in the jQuery documentation). In other cases, there might be some hidden benefit even if the wrapper does little if anything to modify the underlying function's behavior.
There's also a lot of momentum around jQuery, and general trust. Including arbitrary javascript in your code base may not be as 'acceptable' to higher-up-types as including a new jQuery plugin.
So it may be a mistaken perception, but by being a jQuery plugin, a library benefits by being associated with high quality code.
IMHO the only reason to create a plugin is to execute some functionality against a selector ie a set of selected elements eg
$('.myelements').someFunction();
If your plugin ends up looking like this (case in point the newly released Microsoft Globalisation plugin)
$.doSomeStuff();
then there isnt much benefit that couldn't be gained from using a closure. However a lot of developers dont understand closures and namespaces in javascript, and by following a plugin development templatethey can get the benefit without fully understanding the pattern.

Categories

Resources