I am trying to call the function scroll_page inside a function call_scroll_page that is called by setTimeout. And I get error file.js:5 Uncaught TypeError: scroll_page is not a function.
function scroll_page() {
return false;
}
function call_scroll_page() {
var scroll_page = scroll_page();
if(!scroll_page) {
$test = true;
}
}
setTimeout(call_scroll_page, 1000);
var scroll_page
You defined a new variable called scroll_page inside the call_scroll_page function which has masked the global one.
Rename that variable.
It is because you are declaring a var with same name as your function. So inside your function call_scroll_page() scroll_page refers to the local variable. Change your variable name and it will work as intended.
function scroll_page() {
return false;
}
function call_scroll_page() {
var scroll_page_var = scroll_page();
if(!scroll_page_var) {
$test = true;
}
}
setTimeout(call_scroll_page, 1000);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
This line is causing the error: var scroll_page = scroll_page();
Do not redeclare something with name of the scroll_page function.
It removes the link to the function, replaced by a variable, calling a function that is no longer "callable by its name".
Try:
function scroll_page() {
return false;
}
function call_scroll_page() {
var fn = scroll_page();
if(!fn) {
$test = true;
}
}
setTimeout(call_scroll_page, 1000);
Related
In My app i am calling function like below but toJSDate function not invoked. What is the problem can anyone tell why.
In console i get only getIssueProgress Called.
Below i am sharing code.
function toJSDate(){
Ti.API.info('getIssueProgress Called');
}
function getIssueProgress() {
Ti.API.info('getIssueProgress Called');
var check_Date = toJSDate('anil');
}
your toJSDate() doesn't expect a parameters but your calling it with a parameter var check_Date = toJSDate('anil');. Remove 'anil':
function toJSDate(){
console.log('toJSDate');
//Ti.API.info('getIssueProgress Called');
}
function getIssueProgress() {
console.log('getIssueProgress');
//Ti.API.info('getIssueProgress Called');
var check_Date = toJSDate();//not: toJSDate('anil');
}
getIssueProgress();
If you do want to pass that parameter you need to add it to the function declaration
//add parameter here
function toJSDate(param){
console.log('toJSDate');
console.log(param);
//Ti.API.info('getIssueProgress Called');
}
function getIssueProgress() {
console.log('getIssueProgress');
//Ti.API.info('getIssueProgress Called');
var check_Date = toJSDate('anil');
}
getIssueProgress();
As below code, I make an object named "test", and give it properties and method.
The property came from its argument.
And I try to call the method every 2 sec after onload, and the result shows undefined.
But if I only call the method not using setInterval(), like this
window.onload = function() {
giveword.showWord();
}
I'll be able to show the text "Hi".. Why is that?
var giveword = new test("Hi");
function test(word) {
this.word = word;
}
test.prototype.showWord = function() {
document.getElementById("msg_box").innerHTML = this.word;
}
window.onload = function() {
setInterval(giveword.showWord, 2000);
}
Thanks for help...
The reason is because in your test.prototype.showWord function your this object is referring to the context in which the function is called, which is the window object when called from setInterval.
I think what you want to do is use a closure to make the context of showWord() be the giveword instance like this:
var giveword = new test("Hi");
function test(word) {
this.word = word;
}
test.prototype.showWord = function() {
document.getElementById("msg_box").innerHTML = this.word;
}
window.onload = function(){
setInterval(function(){giveword.showWord();}, 2000); // <<-- here's the closure
}
The difference is that with the closure you're telling the setInterval function to call a function within the context as it was when the setInterval was declared. When setInterval was declared there was a variable in scope called giveword that had a method showWord() that returns the value of your initial input. (Closures are hard to explain, and I'm afraid you'd be best served by someone else explaining them if you need more info.)
This solution this now so easy, use an arrow function in setInterval. Here is an example using setInterval inside of an object method.
const mobile = {
make: 'iPhone',
model: 'X',
battery: 10,
charging: false,
charge: function() {
if(this.battery < 100) {
this.charging = true;
console.info('Battery is charging...');
let interval = setInterval(() => {
this.battery = this.battery + 10;
console.info(mobile.battery);
if( this.battery === 100){
this.charging = false;
clearInterval(interval);
console.info('Battery has finished charging.');
}
}, 100);
}
else {
console.info('Battery does not need charging.');
}
}
}
How do I call the inner function from outside in the following code ?
(function (){
var funOne = {
funTwo : function (){
var funFour = function(){
console.log('inner function working');
}
},
funThree : function () {
console.log('working');
}
}
funOne.funTwo(); // works
funOne.funThree(); // works again
funOne.funTwo.funFour(); // throwing exception
})();
You have a scoping issue with funFour compounded by trying to define funTwo act as a function (funOne.funTwo()) and an object (funOne.funTwo.funFour()).
Here are 2 options to get access to funFour:
Let funTwo make funFour accessible at the more accessible level (for example, via funOne).
Have funTwo return funFour within an object. You still have to add the parenthesis to actually call funTwo() in your output.
How to change funTwo:
funTwo : function (){
var funFour = function(){
console.log('inner function working');
};
funOne.funFour = funFour; // Option 1
return { 'funFour': funFour }; // Option 2
},
How to call each option:
funOne.funFour(); // Option 1
funOne.funTwo().funFour(); // Option 2
There is no way to access Local variable (var funFour) of function funTwo from outside. If you want to use funFour at outside of function funTwo, you need to declare funFour as Global variable.
Edited code is here.
(function (){
var funFour;
var funOne = {
funTwo : function (){
funFour = function(){
console.log('inner function working');
}
},
funThree : function () {
console.log('working');
}
}
funOne.funTwo(); // works
funOne.funThree(); // works again
funFour(); // Call function funFour here
})();
I have made a simple function and it is supposed to run on window.onload. But instead, I get that it is undefined. Can anyone help me understand why I get this error?
The form id is kalkulator and the name of the inputs is liter and enheter
The function I have written is
window.onload = function () {
form.kalkulator.focus();
};
I have also written this
form.kalkulator = function () {
if (form.enheter.value == "") {
form.liter.value = "";
} else{
convertLiter();
};
}
function convertLiter() {
console.log(form.liter.value / person.volum() * person.sukker_g())
form.enheter.value = form.liter.value / person.volum();
}
function convertEnheter() {
console.log(form.enheter.value * person.sukker_g())
form.liter.value = form.enheter.value * person.volum();
}
This has nothing to do with window.onload.
You're invoking this...
form.kalkulator.focus();
but form.kalkulator is a function, it doesn't have a .focus() method. form.klalkulator.focus is undefined, and you're attempting to invoke it as a function, hence your error.
form.kalkulator doesn't have any return so you can't call
form.kalkulator.focus();
replace the function
form.kalkulator = function () {
if (form.enheter.value == "") {
form.liter.value = "";
} else{
convertLiter();
};
return form;
}
or split the instructions;
form.kalkulator();
form.focus();
I'm trying to set up function a nested function that I can call throughout my script, but I keep getting "error undefined is not a function". Perhaps someone can help me with how to do this correctly.
First I set global my variables:
var trigger = document.getElementById('trigger');
var subject = document.getElementById('subject');
Then I create a show/hide function:
var toggleVis = function() {
function showSomething() {
trigger.classList.add("active");
subject.classList.add("active");
}
function hideSomething() {
trigger.classList.remove("active");;
subject.classList.remove("active");
}
}
Then I set my event listener:
trigger.addEventListener('click', function() {
if ( subject.classList.contains("active") ) {
toggleVis.hideSomething();
}
else {
togglePicker.showPicker();
}
});
The reason I'm trying to do it this way is that there will be other triggers for subject on the page that will need access to the show/hide functions.
You can't access the functions inside the function, they are out of scope, you could attach them as properties to the wrapping function, but it looks like you just need an object
var toggleVis = {
showSomething: function() {
trigger.classList.add("active");
subject.classList.add("active");
},
hideSomething: function() {
trigger.classList.remove("active");;
subject.classList.remove("active");
}
}
Your togleVis variable is a function and not an object so you can't do toggleVis.hideSomething(). Try updating your code to :
var toggleVis = (function() {
return {
showSomething : function () {
trigger.classList.add("active");
subject.classList.add("active");
},
hideSomething : function () {
trigger.classList.remove("active");;
subject.classList.remove("active");
}
};
}());
With this toggleVis is now an object with two properties showSomething and hideSomething functions.