This code gives me an error:
$(function(){
var instance = new object();
literal.call();
});
var literal ={
call : function(){
instance.foo();
}
}
function object(){
this.selector = $('div');
this.foo = function(){ this.selector.remove(); }
}
I want to make it run and I want to let the literal object out from $(function(){}). I don't want to change the selector at a later time.
So I discarded this solution
$(function(){
instance.selector = $('div');
literal.call();
});
var instance = new object();
var literal ={
call : function(){
instance.foo();
}
}
function object(){
this.selector = $('div');
this.foo = function(){ this.selector.remove(); }
}
And I discarded this also
$(function(){
var instance = new object();
var literal ={
call : function(){
instance.foo();
}
}
literal.call();
});
function object(){
this.selector = $('div');
this.foo = function(){ this.selector.remove(); }
}
what is the best practice to do this?
Your problem is that the istance variable was local to the ready handler. As you don't want to move your code in there (for whatever reasons), you will need to make the variable global:
var istance;
$(function(){
istance = new object();
literal.call();
});
var literal = {
call: function() {
istance.foo();
}
}
function object(){
this.selector = $('div');
this.foo = function(){ this.selector.remove(); }
}
Related
I have several business objects (with different types) that implement functions for a common object, which is assigned to a property of each business object.
It is possible to call the functions declared on business objects from the common object?
Hereafter some similar code:
var Percent= function(){
this.input= null;
...
this.getValuesRange= function(){
return [min,max];
}
...
}
var Speed= function(){
this.input= null;
...
this.getValuesRange= function(){
return [min,max];
}
...
}
var Input= function(){
this.inputRange= function(){
//here I need to call owner's getValuesRange function
}
}
var input= new Input();
var mySpeed= new Speed();
var rocketSpeed= new Speed();
...
mySpeed.input= input;
rocketSpeed.input= input;
...
facade.enter(mySpeed);
facade.enter(rocketSpeed);
...
For inputRange on Input to access getValuesRange, it has to have access to an instance of Speed. Your code has to provide it that instance, there's no built-in "what object references this object via a property" operation in JavaScript. (If there were, it would have to allow for the fact multiple objects can reference the same object, as in your example — both Speed instances reference the same Input instance.)
This is possible with some workarounds. Here an example:
var c = 0;
var Speed= function(){
var mc = c++;
var _input = null;
var _inputRange = null;
this.getInput= function() {
var self = this;
_input.inputRange = function() {
_inputRange.call(self);
}
return _input;
}
this.setInput= function(input) {
_input = input;
_inputRange = input.inputRange;
}
this.getValuesRange= function(){
console.log("Speed", mc);
}
}
var Input= function(){
this.inputRange= function(){
this.getValuesRange()
}
}
var input= new Input();
var mySpeed= new Speed();
var rocketSpeed= new Speed();
mySpeed.setInput(input);
rocketSpeed.setInput(input);
mySpeed.getInput().inputRange(); // Speed 0
rocketSpeed.getInput().inputRange(); // Speed 1
There are many possible pitfalls with this solution. It's here only tho give an idea.
I want to reference a property in Constructor1 (property1) from Constructor2
and I thought, it was ok by doing this... or should I nest the constructor2 inside the constructor1?
var Constructor2 = function() {
this.method2 = function() {
// how to reference Constructor1.property ???
};
};
var Constructor1 = function() {
this.property1 = true;
this.property2 = false;
this.method1 = new Constructor2();
};
var inst = new Constructor1();
inst.method1.method2();
This seems an example of the delegation pattern.
Your "class" Constructor1 is delegating part of its logic to the "class" Constructor2.
Constructor2 needs to access the properties of the delegator and this can be done passing an instance of the delegator to the delegate:
var Constructor2 = function(delegator) {
this.delegator = delegator;
this.method2 = function() {
console.log(delegator.property1);
};
};
var Constructor1 = function() {
this.property1 = true;
this.property2 = false;
this.method1 = new Constructor2(this);
};
var inst = new Constructor1();
inst.method1.method2();
I think that it would be better to consider Constructor1 and Constructor2 not as constructors but as classes. I understand that they are functions and that they are used to create objects, but usually they get the name of the class they will instantiate.
I have an javascript object named concept:
function concept() {
this.ConceptId = 0;
this.Name = "";
}
I am trying to initiate it in jQuery document.ready:
$(document).ready(function() {
var concept = new concept;
});
It returns an error:
Uncaught TypeError: concept is not a constructor
If I move the object inside the document.ready, it is working.
$(document).ready(function() {
function concept() {
this.ConceptId = 0;
this.Name = "";
}
var concept = new concept;
});
I am still new on javascript, as far as I understood document.ready is run when DOM is completed. I don't understand why it cannot access the object which is defined out of the document.ready scope.
Here it is the fiddle: https://jsfiddle.net/49rkcaud/1/
The issue is because you're redefining concept. You just need to change the name of the variable:
$(document).ready(function() {
var foo = new concept; // change the variable name here
alert(foo.ConceptId); // = 0
});
function concept() {
this.ConceptId = 0;
this.Name = "";
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Try this:
Jsfiddle: https://jsfiddle.net/3w284mcs/
$(document).ready(function() {
var concept = function() {
this.ConceptId = 0;
this.Name = "";
}
var concept_obj = new concept();
alert(concept_obj.ConceptId);
});
You just need to change variable name where call this function.
Answer
$(document).ready(function() {
/*function concept() {
this.ConceptId = 0;
this.Name = "";
}*/
var concept1 = new concept;
alert(concept1.ConceptId);
});
function concept() {
this.ConceptId = 5;
this.Name = "";
}
Better Approach
You should create object of function using ()
var objConcetp = new concept();
Also use constructor rather than directly assigning values. Your function look like:
$(document).ready(function(){
var oConcept = new concept(1, "YourName");
});
function concept(conceptId, name){
this.ConceptId = conceptId;
this.Name = name;
}
var Todo = function(x){
this.data = x;
this.view = function(){
alert("hi")
check()
}
check = function(){
alert("checking")
alert(this.data)
}
}
Todo.prototype.add = function(item){
this.data.push(item)
}
var todo = new Todo([1,2,3])
alert(todo.data)
todo.add(5)
alert(todo.data)
todo.view()
In above code why I am not able to get the value of data in check method. I am little confused.
this in the check function refers to the global object window.
Fix it with:
var Todo = function(x){
this.data = x;
this.view = function(){
alert("hi");
this.check();
};
this.check = function(){
alert("checking");
alert(this.data);
};
};
And if you don't want to expose check method public, then you could do like below.
var Todo = function(x){
this.data = x;
this.view = function(){
alert("hi")
check.apply(this); //here, by using apply method
}
var check = function(){
alert("checking")
alert(this.data)
}
}
you have declared check as a global variable:
var a = 5; local variable
a = 5; global variable (attached to window)
therefore, the function context(this) is bound to Window when calling check(), which does not contain data property.
so you have to attach check function to Todo "class":
this.check = function() {};
a side note, you could get the desired functionality by setting manually the function context to todo when invoking the function:
check.apply(todo);
Is it possible to combine this whole definition into one declaration instead of breaking it apart?
First Part
var Pan = function(){};
Second Part
Pan.prototype = {
//private variables
Id: null,
//public methods
GetId: function(){
alert(Id);
}
}
You can always do:
var Pan = function () {
var Id = null;
this.GetId = function(){
alert(Id);
}
};