this is my class
function User(){
this.nickname='nickname';
}
User.prototype.save=function(){
dosomething();
};
User.prototype.add=function(){
dosometing();
call save();
};
i want to call the save() function in the add() function,but i don't know how to do.I tried
User.prototype.add=function(){
save();
};
and
User.prototype.add=function(){
User.prototype.save();
};
but both are wrong,and what should i do?
function User() {
this.nickname = 'nickname';
}
// ...
User.prototype.add = function() {
this.save();
};
You were not defining your User constructor properly.
Also, instances of User (created like var myUser = new User(); ) can access their prototype's methods via this.methodNameHere();
Ok.There are a few mistakes in your code.
Here we are using the classical model of inheritance.
Step 1.Create a constructor function. eg. function user(){...}
Step 2.Extend your prototype by adding methods.eg add,save etc
step 3.Create an instance to call methods.eg.MyInstance
function User(){
this.nickname='nickname';
}
User.prototype.dosomething=function(){
//some code
};
User.prototype.save=function(){
this.dosomething();
};
User.prototype.add=function(){
this.dosometing();
this.save();
};
Now lets say I want to call a method add.This is how its done.
var MyInstance = new User();//create an instance.
MyInstance.add();//call the function.
Outside the scope of your question : The same thing could be done by Prototypal Inheritance as well.
var UserPrototype={
save:function(){..},
add:function(){
this.save();
}
}
var MyInstance = Object.Create(UserPrototype);
MyInstance.add();
Related
I have a prototype:
var myClass = function() {};
I have a method on that class:
myClass.prototype.method1() = function() {
return x;
}
I then have a second method which I declare in the same way, but I want to access the result of method1() in it. But this doesn't work, and I'm not sure why...
myClass.prototype.method2() = function() {
return myClass.method1();
}
I get TypeError: myClass.method1 is not a function
Can anyone point out what's syntactically/conceptually wrong with this? And suggest any improvements?
Also I'm not 100% I'm using the terms 'class' and 'prototype' correctly in this instance. If anyone can correct the terminology, or point out any other terminology associated with this kind of process I'd appreciate it!
Thanks in advance.
var myClass = function() {};
This is a constructor and not a prototype. Here's a quick read explaining the difference.
You can call it using this. Here's the best place for a brush up.
const MyClass = function() {};
MyClass.prototype.method1 = function() {
return x;
}
MyClass.prototype.method2 = function() {
return this.method1();
}
Also, no need for brackets in function definitions of method1 and method2
That's because (using rough OO terminology), method1() is an instance method, and you're trying to call it as a static method.
const MyClass = function() {}; // MyClass is a constructor
MyClass.prototype.method1() = function() {
return x;
}
MyClass.prototype.method2() = function() {
return this.method1(); // Call it as an instance
}
or, alternatively:
const MyClass = function() {};
MyClass.method1() = function() { // "static" method
return x;
}
MyClass.prototype.method2() = function() {
return MyClass.method1(); // Call it as a "static"
}
Worth noting that this terminology is misleading, there are no static or instance methods (in fact, there are no methods in JavaScript, only functions, and properties that hold references to functions).
The JS oop has some difference between public and privileged methods.
myClass.method1(); is A static method calling. it's just like a normal function and has no relation with any myClass object instance.
So you need to call it using the Full namespace:
MyClass.method1()
I am attempting to change the behavior of a jquery plugin without actually changing the source. For the purposes of this question, I constructed a simple example that illustrates my problem. If a have script file that attaches a class instance generator to a global variable like this:
(function(){
window.newMyClass = function(){
return new myclass();
}
function myclass(){
var privateMethod = function(){
return "private";
}
this.publicMethod = function(){
return privateMethod();
}
}
})()
If I then get new instance of myclass with var instance = window.newMyClass(), is there any way to override the behavior of privateMethod on instance, such that instance.publicMethod() would call my overridden function? I was thinking I could subclass myclass, but since the myclass constructor is scoped to the immediately invoked function expression, I don't know how to do that.
Is it better just to change the plugin source? The problem with that is I'd have to host it myself instead of using a CDN, as well as re-implement the change every time an update is released.
I don't know if I understood well this. Probably not, because there is no mistery with that:
(function(){
window.newMyClass = function(){
return new myclass()
}
function myclass(){
var privateMethod = function(){
return "private";
}
this.publicMethod = function(){
return privateMethod();
}
}
})();
var instance = window.newMyClass();
instance.publicMethod = function(){
return "new method";
}
console.log(instance.publicMethod());
FIDDLE: http://jsfiddle.net/r9evbzd2/1/
I have a function defined in javascript that acts as a class. Within it, I have several public methods defined, but there is one private method, and I need to access one of the public methods within it.
function myClass(){
this.myPublicMethod = function(a,b){
var i = a*b;
return i;
}
function myPrivateMethod(){
var n = this.myPublicMethod(2,3);
}
}
This doesn't work. Is there a way to access myPublicMethod within myPrivateMethod?
You simply have to specify the value of this when calling your private method using Function.prototype.call.
myPrivateMethod.call(this);
E.g.
function myClass(){
this.myPublicMethod = function(a,b){
var i = a*b;
return i;
}
function myPrivateMethod(){
var n = this.myPublicMethod(2,3);
}
//calling private method in the *scope* of *this*.
myPrivateMethod.call(this);
}
Please note that having true private members (that aren't functions) comes at the cost of not taking advantages of prototypes. For that reason, I prefer to rely on naming conventions or documentation to identify private members rather than enforcing true privacy. That holds only for non-singleton objects.
The following example demonstrates what is being said above.
//Constructors starts by an upper-case letter by convention
var MyClass = (function () {
function MyClass(x) {
this._x = x; //private by convention
}
/*We can enforce true privacy for methods since they can be shared
among all instances. However note that you could also use the same _convention
and put it on the prototype. Remember that private members can only be
tested through a public method and that it cannot be overriden.*/
function myPrivateMethod() {
this.myPublicMethod1();
}
MyClass.prototype = {
constructor: MyClass,
myPublicMethod1: function () {
//do something with this._x
},
myPublicMethod2: function () {
/*Call the private method by specifying the *this* value.
If we do not, *this* will be the *global object* when it will execute.*/
myPrivateMethod.call(this);
}
};
return MyClass;
})();
You can try this to defeat the local scoping:
function myClass(){
this.myPublicMethod = function(a,b){
var i = a*b;
return i;
}
// Capture the original context of `this` myClass
var self = this;
function myPrivateMethod(){
var n = self.myPublicMethod(2,3);
}
}
We use self to maintain a reference to the original this even as the context is changing (since we want to call the public method int the private method).
One way to do this is defining every method as private first, and making the ones you want public in the end (myPrivateMethod will reference the original myPublicMethod even if myClass.myPublicMethod is overridden):
function myClass(){
var myPublicMethod = function(a,b){
var i = a*b;
return i;
}
var myPrivateMethod = function (){
var n = myPublicMethod(2,3);
}
this.myPublicMethod = myPublicMethod;
}
You could write
var myPublicMethod = this.myPublicMethod = function()...
So there was a private and a public instance created.
Just seems cleaner to me.
You could potentially pass the public function to the private function as a parameter and then call it.
this.myPublicMethod = function(a,b){
alert(a * b);
}
function myPrivateMethod(publicMethod){
var n = publicMethod(2,3);
}
myPrivateMethod(this.myPublicMethod);
Here is a working fiddle.. http://jsfiddle.net/rxtB2/3/
An alternative to invoking call could be to attach the method directly to the myClass Function object.
function myClass(){
myClass.myPublicMethod = function(a,b){
var i = a*b;
return i;
}
this.myPublicMethod = myClass.myPublicMethod;
function myPrivateMethod(){
var n = myClass.myPublicMethod(2,3);
return n;
}
console.log("Calling myPrivateMethod()");
console.log(myPrivateMethod());
}
If you only want "private" methods then your pattern for defining it is wrong. I think methods that can access "private" methods are called privileged methods but can be wrong.
The pattern for creating them is the following (added instance variables and inheritance in the example):
// added to show inheritance
var Parent = function(){
//instance members
this.parentInstanceVar=["parent"];
};
var Class = function() {
//1st step to "inherrit" from Parent
// take ownership of Parent instance members
Parent.call(this);
//to pass all arguments to Parent constructor:
//Parent.apply(this,arguments);
//to pass specific agruemtns to Parent
//Parent.call(this,arg1,arg5);
this.someIntanceVar=["Class instance"];
};
Class.prototype=(function(parent){
var ret=(parent&&parent.prototype)?
Object.create(parent.prototype):
Object.create({});
//repair the constructor
ret.constructor=Class;
var myPrivateMethod = function() {
return this.someIntanceVar;
};
//privileged method calling "private method"
ret.myPriviligedMethod=function(){
return myPrivateMethod.call(this);
};
return ret;
}(Parent));//2nd step to "inherit" from Parent
//non privileged method
Class.prototype.nonPrivileged=function(){
//can't accesss myPrivateMethod here
};
//some tests creating 2 instances
var c1=new Class();
var c2=new Class();
c1.parentInstanceVar.push("added in c1");
c1.someIntanceVar.push("added in c1");
console.log(c2.parentInstanceVar);//=["parent"]
console.log(c2.someIntanceVar);//=["class instance"]
console.log(c1.myPriviligedMethod());//=["Class instance", "added in c1"]
console.log(c2.myPriviligedMethod());//=["Class instance"]
//reason why we repaired the constructor:
console.log((new c1.constructor()) instanceof Class);//=true
This pattern only handles instance shared private members. If you need instance specific private members you can't use prototype for any privileged methods (methods that need access to "private" instance specific members). You can use use a function that returns an object containing closures but I would really not use this pattern as it ignores prototype and the benefits that come with it, makes testing harder and is a huge pain to clone.
var createClass=function(privateInstanceVal){
var privateMethod=function(val){
privateInstanceVal.push(val);
return privateInstanceVal;
};
return{
publicInstanceVar:[],
publicMethod:function(val){return privateMethod(val);}
}
};
c1=createClass([]);
var b = c1.publicMethod(33);
console.log("b is:",b);
b.push("because I returned the private I made it public");
console.log(c1.publicMethod(0));//=[33, "because ... public", 0]
The sample shows a mistake sometimes made by returning "private" you made it public. Instead you can return a copy: return privateInstanceVal.concat([]);
What is the meaning and usage of the init() function in JavaScript?
JavaScript doesn't have a built-in init() function, that is, it's not a part of the language. But it's not uncommon (in a lot of languages) for individual programmers to create their own init() function for initialisation stuff.
A particular init() function may be used to initialise the whole webpage, in which case it would probably be called from document.ready or onload processing, or it may be to initialise a particular type of object, or...well, you name it.
What any given init() does specifically is really up to whatever the person who wrote it needed it to do. Some types of code don't need any initialisation.
function init() {
// initialisation stuff here
}
// elsewhere in code
init();
In JavaScript when you create any object through a constructor call like below
step 1 : create a function say Person..
function Person(name){
this.name=name;
}
person.prototype.print=function(){
console.log(this.name);
}
step 2 : create an instance for this function..
var obj=new Person('venkat')
//above line will instantiate this function(Person) and return a brand new object called Person {name:'venkat'}
if you don't want to instantiate this function and call at same time.we can also do like below..
var Person = {
init: function(name){
this.name=name;
},
print: function(){
console.log(this.name);
}
};
var obj=Object.create(Person);
obj.init('venkat');
obj.print();
in the above method init will help in instantiating the object properties. basically init is like a constructor call on your class.
NB. Constructor function names should start with a capital letter to distinguish them from ordinary functions, e.g. MyClass instead of myClass.
Either you can call init from your constructor function:
var myObj = new MyClass(2, true);
function MyClass(v1, v2)
{
// ...
// pub methods
this.init = function() {
// do some stuff
};
// ...
this.init(); // <------------ added this
}
Or more simply you could just copy the body of the init function to the end of the constructor function. No need to actually have an init function at all if it's only called once.
This is more like unreachable code
eg. if variable x or function x() is declared below the line where its
called this error generates:
setPlayerOne();
let imageGenerator = (value) =>{
allImages = {
1: 'images/dice1.png',
2: 'images/dice2.png',
3: 'images/dice3.png',
4: 'images/dice4.png',
5: 'images/dice5.png',
6: 'images/dice6.png',
}
return allImages[Number(value)];
}
findRandom = () =>{
let randomNumber = Math.floor(Math.random() * 6) +1
return randomNumber;
}
let setPlayerOne = () =>{
let img1 = document.querySelector('.img1').attributes.src;
img1.value = imageGenerator(findRandom())
}
let setPlayerTwo = () =>{
let img2 = document.querySelector('.img2').attributes.src;
img2.value = imageGenerator(findRandom())
}
setPlayerTwo();
setPlayerOne() method will generate this but setPlayerTwo() will not generate;
this because setPlayerOne() was called before initialized by JS.
Basically I looking for the ability to attach methods to an executable function while using the javascript prototype method. The code below demonstrates want I'm talking about and the functionality I'm looking for, but it is really a hack. Notice I have a valid this object to attach variables along with a main and init function.
function create(){
var $this = {},
main = function(){
prototype.main.apply($this,arguments);
};
prototype.init.apply($this,arguments);
//Add additional prototype methods by brute force, ugly
for(i in prototype)-function(i){
main[i]=function(){
prototype[i].apply($this,arguments);
}
}(i);
return main;
};
var prototype = {
//called when you create the object
init:function(text){
console.log('init');
this.text = text;
},
//called when you call the object
main:function(){
console.log('main');
console.log(this);
},
method:function(){
console.log(this.text);
}
};
//create returns a function that also has methods
//the below line will call the init method
var fun = create('some variables');
//call main function
fun();
//call methods
fun.method();
I'm afraid I might be missing something obvious.
Here is the same functionality as above, but instead extends the global function prototype.
Extending the global properties is bad practice, so I am looking for a alternative solution.
Function.prototype = {
//called when you create the object
init:function(text){
console.log('init');
this.text = text;
},
//called when you call the object
main:function(){
console.log('main');
console.log(this);
},
method:function(){
console.log(this.text);
}
};
function create(){
var ret = function(){
ret.main.call(main);
};
ret.init.apply(main,arguments);
return ret;
};
//create returns a function that also has methods
//the below line will call the init method
var fun = create('some variables');
//call main function
//fun();
//call methods
fun.method();
Just as an obvious point, it doesn't appear you can use the typical new object approach because if you call new you can't return a separate value.
Any explanation or considerations would be great!
You can put your the prototype functions into the "constructor" body. This technically is what you are currently doing, but defining them explicitly rather than using a helper method is much cleaner. Then, you can further simplify your code using the following pattern for public and private variables and methods:
function Fun(text) {
// This is the main function
var fn = function () {
return 'main';
};
// Attach public variables and methods
fn.publicVariable = 'public';
fn.publicMethod = function () {
return text; // text is a "private variable"
};
// Do whatever initialization
console.log('init');
// Return the main function
return fn;
}
var fun = Fun('this is some text'); // "init"
fun() // "main"
fun.publicMethod() // "this is some text"
console.log(fun.publicVariable); // "public"
console.log(fun.text); // undefined
By "the JavaScript prototype method", do you mean using the Function.prototype property to implement inheritance? Or are you just trying to create functions that have an initializer and attached methods?
Your example does the latter, so I'll assume that's what you you're looking for. Does this do what you're looking for?
function create(text)
{
var main = function()
{
console.log('main');
console.log(this);
}
var init = function()
{
console.log('init');
main.text = text;
}
main.method = function()
{
console.log(main.text);
}
init();
return main;
}
//the following line will call init
var fun = create('some variables');
//call main
fun();
//call methods
fun.method();