These are chat archives for FreeCodeCamp/HelpJavaScript

30th
Apr 2018
JJ Megma
@megma_jj_twitter
Apr 30 2018 00:53
@kellic89 how many times items are in it? would that be dbArray[i] being an item?
@kellic89 What is the input and what is an example output of what you are trying to accomplish?
jusgoose
@gusd773
Apr 30 2018 01:44
@padunk omg thank you! I am so salty that's what it was
abraham anak agung
@padunk
Apr 30 2018 01:45
@gusd773 :+1:
Ankur sharma
@ankur1163
Apr 30 2018 08:02
hello
Dhaval Vira
@dhavalveera
Apr 30 2018 08:03
hello
ijhar
@ijhar8
Apr 30 2018 08:03
what sould i do for that part ..?
@ankur1163 is it problem of scope
Daniel Simeonov
@dbsimeonov
Apr 30 2018 13:22
Guys can I call a function which is nested in another function and I want to call it to the global scope with setInterval ?
Aditya
@ezioda004
Apr 30 2018 13:44
@dbsimeonov Outer functions are in scope of inner functions, not the other way around
Blauelf
@Blauelf
Apr 30 2018 14:54
@dbsimeonov I don't understand, could you maybe give an example of what you mean? Code in an outer scope cannot access variables of an inner scope, but you can access variables of outer scopes (unless shadowed), but I'm not sure what you actually want.
Rajat
@rajataudichya
Apr 30 2018 16:45
@DerrickHsiao shift(0)
I wish I could make you understand like @Blauelf or Markus_killi
pal-crystal
@pal-crystal
Apr 30 2018 16:49
yolooo
Rajat
@rajataudichya
Apr 30 2018 17:11
@DerrickHsiao you dont need to specify the index when using shift it automatically removes the 0 index of an array and you need to return that number which has been shifted and not the item
jusgoose
@gusd773
Apr 30 2018 17:21
nvm figured it out!
Brad
@bradtaniguchi
Apr 30 2018 17:30
hello world
Daniel Simeonov
@dbsimeonov
Apr 30 2018 17:48
:wave:
Christopher McCormack
@cmccormack
Apr 30 2018 17:56
heya
Brad
@bradtaniguchi
Apr 30 2018 17:58
Ah issues with this fantastic way to start the day :D
Christopher McCormack
@cmccormack
Apr 30 2018 17:58
ES6 arrow functions? @bradtaniguchi :)
Brad
@bradtaniguchi
Apr 30 2018 18:00
I think its because Im doing this:
class SomeThing {
  private doSomething() {/*stuff*/}

  private mapStuff() {
    arr.map(this.doSomething); //when passing like this, I think this gets messed up
  }
}
Changed it to this:
class SomeThing {
  private doSomething(obj) {/*stuff*/}

  private mapStuff() {
    arr.map((obj) => this.doSomething(obj)); 
  }
}
Christopher McCormack
@cmccormack
Apr 30 2018 18:03
did that fix it?
Rajat
@rajataudichya
Apr 30 2018 18:04
=> works in php @Blauelf
Christopher McCormack
@cmccormack
Apr 30 2018 18:04
was it a problem in doSomething?
Brad
@bradtaniguchi
Apr 30 2018 18:04
Yea I think so, I think babel got tripped up somehow when being passed to the inner function
Rajat
@rajataudichya
Apr 30 2018 18:04
@bradtaniguchi
or am I wrong?
Brad
@bradtaniguchi
Apr 30 2018 18:06
It works, but since all this is transpiled down to es5 (no arrows there) it isn't directly fixable by me
ontop of all this, I used the arr.map function in the example, but its actually an rxjs function called map that does more or less the same thing. Maybe the transpiler applies rules differently(?)
Moisés Man
@moigithub
Apr 30 2018 18:11
need to be a class?.. else u could use simple functions ..... i think
Brad
@bradtaniguchi
Apr 30 2018 18:15
In this case yes its needs to be in a class, theres a lot of reasons but throwing out the class structure isn't an option haha
Christopher McCormack
@cmccormack
Apr 30 2018 18:17
@bradtaniguchi I'm wondering if it's because this isn't bound - try passing arr.map(this.doSomething.bind(this)); maybe?
or arr.map(::this.doSomething); if babel supports it and I didn't screw up the syntax :D
Brad
@bradtaniguchi
Apr 30 2018 18:18
That MIGHT work, I can try after I fix the main issues, idk what arr.map(::this.doSomething) does tho, not used to that syntax
Christopher McCormack
@cmccormack
Apr 30 2018 18:19
Brad
@bradtaniguchi
Apr 30 2018 18:23
Interesting, I don't run into these issues often (thank god, I hate dealing with this) Let me try it out now that I ironed out the main issues
So the ::wasn accepted by my linter, formatter, or build I guess? the bind(this) worked as expected tho :D
@cmccormack thanks :D, Im going to look at the transpiled code to see how it came out
Christopher McCormack
@cmccormack
Apr 30 2018 18:29
great! that's how you have to do it with REact when passing a method down to a child so figured it would work
Brad
@bradtaniguchi
Apr 30 2018 18:33
I gotta learn me some React, gotta be one of those cool kids :P
Christopher McCormack
@cmccormack
Apr 30 2018 18:36
Do it! lots of good knowledge share here if you do
Brad
@bradtaniguchi
Apr 30 2018 18:37
Its React+Redux, or learning NgRx at this point, not sure what I want todo haha
Christopher McCormack
@cmccormack
Apr 30 2018 18:39
You don't have to learn Redux at the same time if you don't want to
I still don't use it
Brad
@bradtaniguchi
Apr 30 2018 18:43
Redux is the main thing I want to get from React, the view part is kinda meh to me. I already use components and want to see what Redux offers that interacting between components doesn't
Christopher McCormack
@cmccormack
Apr 30 2018 18:43
gotcha
Brad
@bradtaniguchi
Apr 30 2018 18:47
Everyone in the Angular community says "Oh yea NgRx is great!" but it seems like A LOT of "boilerplate" just for state-management, and since it seems like its basically Redux, but for Angular, maybe jumping past some of the boilerplate into Redux will enlighten me to what benifits it provides.
Christopher McCormack
@cmccormack
Apr 30 2018 18:49
I only know state management from a theoretical standpoint but I never much liked the look of using hoc's and my apps have been shallow enough that passing down a couple layers doesn't really bother me
But I know in my enterprise they are using Redux
Brad
@bradtaniguchi
Apr 30 2018 18:53
Yea, our app is pretty big right now and could of probably used ngRx but its too late to start shifting into it. In React (without anything else) is the only way to get information from 1 layer to another is by passing it through each one inbetween right?
Christopher McCormack
@cmccormack
Apr 30 2018 18:54
@bradtaniguchi by default? it's not the only way, the React Context API is available as well
Brad
@bradtaniguchi
Apr 30 2018 18:54
So how does that work? Or what is that haha
Christopher McCormack
@cmccormack
Apr 30 2018 18:56
internally I'm not so sure, but using it is like using a Component with a function as a child - https://codepen.io/cmccormack/pen/mxLEzY
I believe that method may also be called a render prop
Christopher McCormack
@cmccormack
Apr 30 2018 19:03
@bradtaniguchi I might actually update my current app to use the new Context API just to play around with it, I'll let you know how it goes :)
Brad
@bradtaniguchi
Apr 30 2018 19:06
Hmm I'm not too sure what I'm looking at haha
So in this example, the AppStyled is from the context API I assume?
or something like that
Christopher McCormack
@cmccormack
Apr 30 2018 19:09
that's styled components, sorry , I shouldn't ahve included that
it includes action handlers as well
Brad
@bradtaniguchi
Apr 30 2018 19:20
Hmm, looks interesting, kinda reminds me of $statefrom angularjs, but not exactly
Brad
@bradtaniguchi
Apr 30 2018 19:35
Hmm another issue with this, some funky stuff is going on >.>
Oh never mind, hehe
Christopher McCormack
@cmccormack
Apr 30 2018 19:38
PEBCAK I bet
Brad
@bradtaniguchi
Apr 30 2018 19:40
Oh man howd ya know :P
Blauelf
@Blauelf
Apr 30 2018 20:00
@rajataudichya Missing the context, did you mean me?
jusgoose
@gusd773
Apr 30 2018 21:16
the padding won't work for my ".head" div inside the ".widget-box-intro" div
<style>
#content-area{
    background: #fafafa;
    overflow: auto;
    padding: 50px 0;
}
#content-area .side-column{
    float: left;
    width: 35%;
    margin: 0 2.5%;
}
#content-area .widget-box{
    background: #fff;
    border-radius: 3px;
    -webkit-box-shadow: 0px 2px 7px 1px rgba(87,87,87,1);
    -moz-box-shadow: 0px 2px 7px 1px rgba(87,87,87,1);
    box-shadow: 0px 2px 7px 1px rgba(87,87,87,1);
    margin: 0 0 15px 0;

}

#conent-area .side-column .widget-box.intro .head .widget-image{
    background: #bfbfbf;
    height: 40px;
    width: 40px;
    border-radius: 50%;
    color: yellow;

}

#conent-area .side-column .widget-box.intro .head{
    padding:5px;
}

#content-area .main-area{
    float: left;
    width: 55%;
    margin: 0 2.5%;
    background: blue;
</style>
html:
blob
blob
also the backgrounds to my ".widget-image" div won't work to style my globe icon with a circular grey backround
Moisés Man
@moigithub
Apr 30 2018 21:24
use ur browser devtools... inspect element and check the box model
if ur rules doesnt show.. check if it have something predefined already with higher specificity
jusgoose
@gusd773
Apr 30 2018 21:25
@moigithub gotcha