a piece of my code
const channels = fauna.paginate(q.Match(q.Index("channels"), "true")) // Query FaunaDB database for channel list => create constant called users containing results
const channelList = channels.each(function (page) {
// Logs the page's contents,
// for example: [ Ref(Collection("test"), "1234"), ... ]
console.log(page);
});
works fine and behaves how it supposed to. however, when I try to call "channelList" from elsewhere in my code it returns {}
The console.log in the first piece of code returns what it is supposed to as well so I dont think there is anything wrong with the first chunk of code.
Here is a piece of code where I attempt to call this object
let options = {
options: {
debug: config.twitchConfig.options.debug
},
connection: {
reconnect: config.twitchConfig.options.reconnect,
secure: config.twitchConfig.options.secure
},
identity: {
username: config.twitchConfig.connection.username,
password: config.twitchConfig.connection.password
},
channels: [JSON.stringify(channelList)] // Attempt to call here, Returns {} (Empty object)
};
Is there something I'm missing? is this even possible in the first place? if its not possible whats another method i can use to achieve the same result?
Edit: From what I can gather, channelList is based off of the page response, and it seems like the page response is private to that function and cannot be referenced outside of the function. what can I do to either make it referencable outside of the function or create a constant/variable that can be accessed outside of the function containing the same information
channelList is not a function, more like it is the result of a function that prints the channels.. so after printing what is assigned to it is the result..
Try assuming it as a function and then invoking it:
const channelList = ()=>{
channels.each(function (page) {
// Logs the page's contents,
// for example: [ Ref(Collection("test"), "1234"), ... ]
console.log(page);
});
};
channelList();
Assuming the code itself does what you want it to, this should do the job
After much trial and error my answer was way simpler than me or anyone else I have spoken to thought.
Here's a step by step guide on how to fix the problem yourself if you're experiencing the same issue as I was.
Use a variable instead of a constant
declare your variable before setting it by placing var channelList; somewhere above your code that sets it
set the previously declared variable with a simple channelList = page
console.log(channelList); just to make sure its all working
Finally, call the variable where you want it, and voila! you have your variable properly called and it doesn't return {} or Undefined or [Object Object]
Related
I'm curious if I'm missing something here -- When I call a method that should get something from the collection because I have proof it exists, it doesn't get it still
My Object of Collections
export const databaseCache = {
/* Other collections ommitted */
roles: new Collection<string, Role>(),
};
My method
export function getRoleByName(name: string) {
return databaseCache.roles.get(name);
}
and my call
const feedbackMod = getRoleByName("pack feedback helper");
feedbackMod is undefined even though I have proof it exists because I logged the collection, (collection is considered a Map object as Collection is a class that extends Map)
https://imgur.com/hD2RP2S image of proof of collection item existing
Reproduceable Code:
interface Role {
name: string;
roleId: number;
}
const myCollections = {
roles: new Map<string, Role>()
};
myCollections.roles.set("pack feedback helper", { name: "pack feedback helper", roleId: 543576460363956244 });
const item = myCollections.roles.get("pack feedback helper");
console.log(item);
Although when tested online, this works, locally it does not for me.
Almost certainly there is something more going on that your example shows. The likely problem is that you have a String vs. a string kicking around on one side or the other (e. g. an objectified string vs. a primitive string):
let key = "pack feedback helper";
let memo = new Map();
memo.set(key, "some value here");
memo.get(key); // Works
memo.get("pack feedback helper"); // Works
let objectifiedKey = new String(key);
memo.get(objectifiedKey); // DOES NOT WORK
The simplest test to validate that this is the case is to wrap both the set and the get calls' key argument in String to de-objectify the key:
// Continuing from the example above
let deObjectifiedKey = String(objectifiedKey); // Note the lack of `new` here
memo.get(deObjectifiedKey); // WORKS AGAIN!
If it is the case that de-objectifying works, then you can trace which side is causing the problem by checking typeof key. It will be object for "objectified" values and string for primitive ones.
Alternatively, test in another browser. If it works in one and not another, then you may have a browser bug.
I found my answer; it is too much code to paste but in short and simple terms it was because some of my methods were lexically scoped, thus being read by the compiler first, where the collection still had no items in it. When I converted the lexical scoped methods to block (es6 arrow functions), everything was able to load in correctly and be used accordingly.
I'm just missing something (which is terrible considering the kind of thing I'm missing) about "this". I have a class for log formatting. In only one method, which is intended only for debugging/testing, "this" turns out to be undefined. I removed almost everything for demonstration purposes only. The code goes as following:
class LogFormatter {
constructor(source) {
// nothing relevant.
}
formatted() {
return 'returns a formatted string whatever';
}
clog(message, sub) {
console.log(this.formatted());
}
// made only for testing
showThis() {
console.log(this);
}
}
And it is used like this:
const
LogFormatter = require('log-formatter'),
lgf = new LogFormatter('asd');
lgf.clog('whatever');
If I access this from formatted method, or even by calling showThis, it works just fine. So it does not seems to be something related to console.log.
When I call clog method, the next error is thrown:
console.log(this.formatted());
^
TypeError: Cannot read property 'formatted' of undefined
So, only in clog method, "this" is undefined. So what's the elephant in front of my that I'm not seeing? :)
EDIT: Note that if I add a console.log(this) inside the formatted method, works fine too.
Also, I've noticed that if I -try to- create a new object from LogFormatter this way:
const
LogFormatter = new require('log-formatter')('whatever')
Throws an exception, saying that I cant execute LogFormatter without new keyword, which AFAIK, should work, given the fact that the class is the only thing being exported via module.exports = LogFormatter. Also, I did not have this problem using good old constructor functions syntax.
Thanks in advance :)
I'm sending a GET request with jQuery
$.get("/index.html", /*Adding '?update' to the request*/ "update",
function (data) {/* Enter code here */}, "html");
where data is my server's response. I'm sending back a simple script like alert() so the 'data' variable equals <script> alert("Hello world!") </script>.
I need a way to automatically execute the script. I could just .append(data) to an element but I'm having multiple appends so that isn't really practical.
What is the easiest and the most practical way of executing the script?
Either .append it, like you said, or use eval(data), but then you'd have to get rid of the <script></script>. You can supply eval() a piece of Javascript code and it will execute that.
Please be aware that using eval should be avoided at all costs.
I did some crazy stuff in a case like this but you may think it is extreme. In my case I had to store some functions in localStorage and execute them by history state ( when user goes back/forth ). I have created a json object similar to
{obj:'myObject', fn: 'myfn', args: myArgs}
then stored this data base64 encoded. then when I need it back, I simply decoded content and
window.[data.fn].[data.obj].apply(null,data.args)`
did the trick without exposing too much data and not using eval. Eval comes from Evil so I would stay away. =)
UPDATE
So in my case all main core functions are json objects at window namespace similar to ( not actual content but an sample)
Member = {
initialize: function (){
//some process
},
render:function(memberId, selector){
//Some process
},
//...etc }
So when I store each item it, I used something similar to
var data = {obj: 'Member', fn: 'render', args: [1,'#member-block']}
then encoded version will be
localStorage.setItem('data', btoa(JSON.stringify(data)));
dmFyIGRhdGEgPSB7b2JqOiAnTWVtYmVyJywgZm46ICdyZW5kZXInLCBhcmdzOiB7bWVtYmVySWQ6MSwgc2VsZWN0b3I6ICcjbWVtYmVyLWJsb2NrJ319
Then when I need to call back
var data = JSON.parse(atob(localStorage.getItem('data'));
would return my original data object. Since the main functions in my case are in window namespace.
if (typeof window[data.obj]!=='undefined') { // same as window.Member
if (typeof window[data.obj][data.fn]!=='undefined' && typeof window[data.obj][data.fn]!=='function' ) { // make sure fn is defined and is a function
window[data.obj][data.fn].apply(null, data.args);
// we pass same arguments to function call with apply.
// `apply` will give us option to add arguments dynamically without knowing its size.
// it can be null any number of arguments that needed for that function.
}
}
Sorry I couldn't be anymore specific with the title.
I'm building a web-site (personal), which displays different content to the user depending on the query string that is used in the url.
e.g. page=home.html would display home.html
The websites Javascript is wrapped inside an object, with each value containing different data, some pseudo code:
(function(){
var wrapper = {
init: function(){
//Runs on document ready
this.foo();
this.nav.render();
},
foo: function(){
//Some functionality goes here for the website, e.g. Display something from an API
},
nav: {
//Functionality to handle the navigation, has different properties
config: {
//Contains the config for nav, e.g. page names + locations
dir: '/directory/to/content/',
pages: {
page_name: wrapper.nav.config.dir + 'page_value'
}
},
render: function(){
//some code
},
routes: function(){
//some code}
}
}
};
$(function(){
wrapper.init();
});
})();
My problem is that I'm trying to prepend the dir value to each of the page values (inside the object where the pages are defined), expecting to get the output of (in this pseudo code case) of directory/to/content/page_value, but instead dir is undefined when I'm trying to access it, I've tried the following to achieve what I want:
wrapper.nav.config.dir + 'page_value'
I've been playing around with the last 30 minutes trying to find out what I'm doing wrong, and even thought about hard-coding the URL in for each page.
The reasoning for wanting to do this is that my local development server and web host have different directory structures, so I don't want to re-write the URL's each time I want to develop + publish. As for why everything is wrapped inside an object, I thought it would be easier to maintain this way.
Hopefully the answer is simple and it's just an amateur mistake / lack of understanding.
The issue is that you can't refer to a variable that is being defined in that very definition.
So, inside the definition of wrapper, you can't refer to wrapper. And, inside the definition of config, you can't refer to config either and so on.
The usual design pattern for solving this is to initialize as much as you can in the declaration of your data structure and then do the rest in .init() when you can freely access all of it.
Change the first two lines to:
var wrapper = null;
(function(){
wrapper = {
Otherwise, the wrapper is a local variable to your anonymous function.
The problem is that you're still busy defining the wrapper when you ask for its value, which is why it's still undefined.
The code below fails too:
var x = {
y:"1",
z:x.y
}
Why not:
//...
init: function(){
//Runs on document ready
this.foo();
var config = this.nav.config;
for (var page in config.pages) {
config.pages[page] = config.dir + config.pages[page];
}
},
//...
if (!window['console']) {
window.console = {
log: function(msg) {}
}
}
$(window).ready(function() {
Site.onReady();
});
var Site = {
host: null,
path: null,
etc..
And there have var Helpers, var Site, looks pretty good, but can't understand the purpose? Anyone who knows that?
if (!window['console']) {
window.console = {
log: function(msg) {}
}
}
This checks to see if there's anything currently assigned to window.console already and if there's not, it assigns a custom object that has a 'log' function. This makes window.console.log usable no matter what, and if there's already a native (or earlier defined) version of the function, it will be used.
$(window).ready(function() {
Site.onReady();
});
var Site = {
host: null,
path: null,
etc..
I have no idea what this is for, but Site is undefined at the time it is placed into the anonymous callback for $(window).ready(), which is something that should be avoided (just place the $(window).ready() below where site is defined)
As for this specific snippet:
$(window).ready(function() {
Site.onReady();
});
this passes an anonymous function to the $(window).ready() function, which will call it when the DOM is ready. Using an anonymous function directly avoids the need to name a function and then pass it in later.
function myFunc() { //we can use myFunc anywhere now, which may be unwanted
Site.onReady();
}
$(window).ready(myFunc);
Lastly:
var Site = {
host: null,
path: null,
etc..
The var myVar = {key1:"value", key2:"other_value"}; syntax creates a new object with keys and values that can be used like this: myVar.key1 = "newValue!"
Looks like it initializes several global objects that are expected on the page. For example console, which is available in Firefox/Firebug for logging, but not other browsers. So by checking for existence of window['console'] and adding it when necessary, you can trust in the JavaScript code you can call console.log() without causing an error.
I assume Site, Helpers, etc all do something similar.
its defining a 'console' object literal on the window object, if it is not already there, which has a function log. This means in your code you can write
console.log('something')
even if the browser doesn't support it.