These are chat archives for FreeCodeCamp/HelpJavaScript

1st
Feb 2018
aRtoo
@artoodeeto
Feb 01 2018 00:43
hey fam how can i stick the modal when i adjust the screen size? https://codepen.io/artoo/pen/eVNXZL?editors=0010
im using transform: translate fam
ESLMiguel
@ESLMiguel
Feb 01 2018 05:05

Question about this code:

var a = 0.1;
var b = 0.2;
var c = 10;
var d = ((a + b)*c===(a*c+b*c))? 1 : 0;
console.log(d);

Why is this evaluating as false? I am missing something really obvious I'm sure

Nataly C.
@cstpk
Feb 01 2018 05:13
@ESLMiguel false? it returns zero
Aditya
@ezioda004
Feb 01 2018 05:13
@ESLMiguel Try doing console.log(0.1 + 0.2); and you'll see why
ESLMiguel
@ESLMiguel
Feb 01 2018 05:15
@ezioda004 ive been doing C# and python the last couple months... I forgot about this fun feature of javascript
@ezioda004 thanks
CamperBot
@camperbot
Feb 01 2018 05:15
eslmiguel sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 424 | @ezioda004 |http://www.freecodecamp.org/ezioda004
Aditya
@ezioda004
Feb 01 2018 05:17
@ESLMiguel Yeah, quick fix would be to use toPrecision(1) or toFixed(1).
Jianyu Zhang
@Jatstar
Feb 01 2018 06:44
function rot13(str) { // LBH QVQ VG!
    // 请把你的代码写在这里
    var strArray = str.split("");
    var resultArray = [];
    var Reg = /^[A-Za-z]/;
    for (let i = 0; i < strArray.length; i++) {
        var char =  strArray[i];
        var code = char.charCodeAt(0);
        console.log(code);
        if (Reg.test(char)) {
            code = code - 13;
            if (code < "A".charCodeAt(0)) {
                code = code + 26;
            }
        }
        resultArray.push(code);
    }
    var resultCode = resultArray.join(',');
    return String.fromCharCode(resultCode);
}
``````
var result =  rot13("SERR PBQR PNZC");  // 你可以修改这一行来测试你的代码
console.log(result);
result is error
Blauelf
@Blauelf
Feb 01 2018 08:24

@Jatstar You cannot pass a string like String.fromCharCode("65,66,67"), it would have to be separate arguments like String.fromCharCode(65,66,67)

ES5 solution using Function.prototype.apply:

    return String.fromCharCode.apply(null, resultArray);

(I chose to use null as the argument isn't used)

ES6 solution using spread operator ...:

    return String.fromCharCode(...resultArray);
@Jatstar Additionally, there's FreeCodeCamp/chinese
Jianyu Zhang
@Jatstar
Feb 01 2018 08:33
Thank you very much @Blauelf .
CamperBot
@camperbot
Feb 01 2018 08:33
jatstar sends brownie points to @blauelf :sparkles: :thumbsup: :sparkles:
:star2: 4683 | @blauelf |http://www.freecodecamp.org/blauelf
Marianissimus
@Marianissimus
Feb 01 2018 09:28
hey. does anybody here use Emmet LiveStyle for Sublime 2?
Razvan Jackson
@RazvanJackson
Feb 01 2018 10:53
Hey
What's the purpose of { } here?
const { title } = this.props
it's the same as
const title = tihs.props.title?
es6 thing?
Markus Kiili
@Masd925
Feb 01 2018 10:58
@RazvanJackson Yes. Destructuring assignment.
Razvan Jackson
@RazvanJackson
Feb 01 2018 10:58
@Masd925 Thanks
CamperBot
@camperbot
Feb 01 2018 10:58
razvanjackson sends brownie points to @masd925 :sparkles: :thumbsup: :sparkles:
:star2: 4682 | @masd925 |http://www.freecodecamp.org/masd925
Markus Kiili
@Masd925
Feb 01 2018 10:59
@RazvanJackson http://es6-features.org/
16sheep
@16sheep
Feb 01 2018 11:45

Hi is there a way in JS to console.log() objects identity or address.. I am reading this article about mutation and am a bit stuck.

At the beginning of the article there is an example where they create an object and then create a new variable name and assign the first object to it, then they change a property value of the new object and show that property value of the first object also changed or mutated and If I understand correctly the first object and second object just have two different variable names but they actually point to the same object
Here is the code for that

const egg = { name: "Humpty Dumpty" };

const newEgg = egg;
newEgg.name = "Errr ... Not Humpty Dumpty";

console.log(egg);
// {
//   name: "Errr ... Not Humpty Dumpty"
// }

console.log({} === {}); //false
console.log(egg === newEgg); // true

Later in the article they are explaining how Object.assign is a shallow merge and so, if there are objects within objects that are being merged which have the same name then the new object created will use the one which was later in the arguments list.
Here is their example code

const defaultSettings = {
  power: true,
  soundSettings: {
    volume: 50,
    bass: 20,
    // other options
  }
};

const loudPreset = {
  soundSettings: {
    volume: 100
  }
};

const partyPreset = Object.assign({}, defaultSettings, loudPreset);

//But partyPreset sounds weird. The volume is loud enough, but the bass is non-existent. 
//When you inspect partyPreset, you’re surprised to find that there’s no bass in it!

console.log(partyPreset);
// {
//   power: true,
//   soundSettings: {
//     volume: 100
//   }
// }

The confusing part
They say "This happens because JavaScript copies over the reference to the soundSettings object. Since both defaultSettings and loudPreset have a soundSettings object, the one that comes later gets copied into the new object."

If console.log({} === {}); //false
Then how the soundSettings objects can be acknowledged as === I guess it is because of the same property name but can someone please explain a bit.

Markus Kiili
@Masd925
Feb 01 2018 11:54
@16sheep In JS variables and property values hold either primitive values or references to objects (~memory locations). Object.assign copies enumerable own properties from source objects to target object. For example, the defaultSettings has property keys power and soundSettings and the corresponding values are Boolean true and a reference to that object. So partyPreset soundSettings property will point to the same object because the property value is copied when you use Object.assign.
Qasim Qlf
@qasimqlf
Feb 01 2018 12:22
Hi,
16sheep
@16sheep
Feb 01 2018 12:25
Thanks @Masd925 , I think I got it, but will look it over in a couple of hours again with fresh mindset.
Hello @qasimqlf
CamperBot
@camperbot
Feb 01 2018 12:25
16sheep sends brownie points to @masd925 and @qasimqlf :sparkles: :thumbsup: :sparkles:
:cookie: 258 | @qasimqlf |http://www.freecodecamp.org/qasimqlf
:star2: 4683 | @masd925 |http://www.freecodecamp.org/masd925
Tiago Correia
@tiagocorreiaalmeida
Feb 01 2018 13:42
hello everyone
FlashHero
@FlashHero
Feb 01 2018 14:25
Sup
Is there a way to pass data to parent component from child component without using setState in reactjs or Is that pattern against reactjs
Kelechi Chinaka
@ke1echi
Feb 01 2018 14:39
 Testing for    
Log

0
0
0
0
It should work for random inputs too - Expected: '', instead got: undefined
little error on this test @Chrono79
function high(x){
  console.log(x);
  let dict = {
    a:1,b:2,c:3,d:4,e:5,f:6,g:7,h:8,i:9,j:10,k:11,l:12,m:13,n:14,
    o:15,p:16,q:17,r:18,s:19,t:20,u:21,v:22,w:23,x:24,y:25,z:26
  }, score = 0,n=0,arr=[];
  x = x.split(" ");
  for (let i = 0; i < x.length; i++) {
    for (let j = 0; j < x[i].length; j++) {
      score+=dict[x[i][j]];
    }
    if (score > n) {
      arr.push(x[i]);
      n = score;
      score = 0;
    } else {
      score = 0;
    }

  }
  return arr[arr.length-1];
}
the failed test was not on the description
Diego Mayer
@Chrono79
Feb 01 2018 14:44
@kelechy while not specified, you're not returning a string
Kelechi Chinaka
@ke1echi
Feb 01 2018 14:45
i am..check my return
Diego Mayer
@Chrono79
Feb 01 2018 14:48
Not my kata, but I would return empty string in that case. arr is an empty array, so you're accessing its -1 index
return arr[arr.length-1]; there
That's undefined
Sweet Coding :)
@SweetCodingInc
Feb 01 2018 14:59
function high(x) {
  var z = x.split(' ');
  var index = z.map(w => w.toUpperCase().split(''))
    .map(a => a.reduce((s, c) => s + (c.charCodeAt(0) - 65), 0))
    .reduce((f, c, i) => {
      f = c > f ? i : c;
      return f;
    }, 0);

  return z[index];
}
Stephen James
@sjames1958gm
Feb 01 2018 15:09
@FlashHero You pass data to a child component through props
Diego Mayer
@Chrono79
Feb 01 2018 15:17
@SweetCodingInc you could have worked with lowercase directly ;)
Kelechi Chinaka
@ke1echi
Feb 01 2018 15:20
pls i dont understand @Chrono79
Diego Mayer
@Chrono79
Feb 01 2018 15:33
@kelechy what is it what you don't understand? If your code works for all tests except empty string (not the best thing to do, but...) you could catch that special case with a simple if
x.length is 0, so your loops never run, so arr is an empty array and trying to access arr[-1]gives you the undefined value that the error message reports
Tiago Correia
@tiagocorreiaalmeida
Feb 01 2018 15:37
image.png
im trying to use a package called js-cookie to acess my cookies after trying with vanillajs
but at both ways I get an empty object back or null
no idea why
Kelechi Chinaka
@ke1echi
Feb 01 2018 15:39
function high(x){
  console.log(x);
  if (x.length===0) {
    return "";
  }
  let dict = {
    a:1,b:2,c:3,d:4,e:5,f:6,g:7,h:8,i:9,j:10,k:11,l:12,m:13,n:14,
    o:15,p:16,q:17,r:18,s:19,t:20,u:21,v:22,w:23,x:24,y:25,z:26
  }, score = 0,n=0,arr=[];
  x = x.split(" ");
  for (let i = 0; i < x.length; i++) {
    for (let j = 0; j < x[i].length; j++) {
      score+=dict[x[i][j]];
    }
    if (score > n) {
      arr.push(x[i]);
      n = score;
      score = 0;
    } else {
      score = 0;
    }

  }
  return arr[arr.length-1];
}
Diego Mayer
@Chrono79
Feb 01 2018 15:43
@kelechy why are you using an array? You could use 2 simple vars currentMaxWordand currentMaxScore for instance
Kelechi Chinaka
@ke1echi
Feb 01 2018 15:45
ok..noted..but i still need to account for an empty arr @Chrono79
Diego Mayer
@Chrono79
Feb 01 2018 15:45
No, because you can initialize currentMaxWord as empty string before the loop
and return it after the loop
Kelechi Chinaka
@ke1echi
Feb 01 2018 15:49
true
i need to re-write the logic then
Jason Luboff
@JLuboff
Feb 01 2018 16:08
@tiagocorreiaalmeida Trying to access the cookie from the front end?
Tiago Correia
@tiagocorreiaalmeida
Feb 01 2018 16:08
@alpox pointed me allready that we can'0t access cookies on localhost
always learning :D
Jason Luboff
@JLuboff
Feb 01 2018 16:10
:+1:
Jason Luboff
@JLuboff
Feb 01 2018 16:33
Man...I sure hate going through old code and trying to figure out what I was thinking :joy:
Stephen James
@sjames1958gm
Feb 01 2018 16:45
@JLuboff Yeah, was doing that yesterday and this morning.
Jason Luboff
@JLuboff
Feb 01 2018 16:46
@sjames1958gm And did you successfully dicipher?
Stephen James
@sjames1958gm
Feb 01 2018 16:47
@JLuboff Finally this morning - some backend code that is a gateway from google home to our server cluster.
Jason Luboff
@JLuboff
Feb 01 2018 16:49
@sjames1958gm Sounds...fun?
dinesh
@1532j0004kg
Feb 01 2018 16:50
guys, can anybody please tell , how to store the particular users data under his username ,if the particular user is logged in her/his dashboard data only must viewable for him/her ! . for like every users . If tutorial is knew for u for this particular question (may be login system ) please share , thanks
Stephen James
@sjames1958gm
Feb 01 2018 16:50
@JLuboff We have apps that are controlled by google home and amazon alexa, so the backend translates those interfaces to a common interface.
It is node/express code
dinesh
@1532j0004kg
Feb 01 2018 16:54
@sjames1958gm :wave:
@JLuboff :wave:
Stephen James
@sjames1958gm
Feb 01 2018 16:54
@1532j0004kg Hey
dinesh
@1532j0004kg
Feb 01 2018 16:54
how r u guys ?
:smile:
Stephen James
@sjames1958gm
Feb 01 2018 16:55
Good - working
dinesh
@1532j0004kg
Feb 01 2018 16:57
happie , can u please help me to learn that ? :sparkles:
Stephen James
@sjames1958gm
Feb 01 2018 16:58
@1532j0004kg I have not done enough with this subject to advise.
dinesh
@1532j0004kg
Feb 01 2018 16:58
and also please tell what are all things need to learn for authentication .
ohh ok no problem !!! :+1:
Jason Luboff
@JLuboff
Feb 01 2018 17:05
@sjames1958gm Oh that actually does sound like fun haha
Stephen James
@sjames1958gm
Feb 01 2018 17:06
@JLuboff :)
Jason Luboff
@JLuboff
Feb 01 2018 17:06
@1532j0004kg Hi. If this is a nodejs app, I would advise looking into using PassportJS for authentication and then using templates. With templates you can use middleware from passport to first check if a user is logged in, then as long as they are, you can send the user info directly to the template
Brian
@BrianCodes33
Feb 01 2018 18:38
function whoIsPaying(name){
  if (name <= 2) {
    return [name];
  }
  return [name,name.substr(name,2)]
}
Expected: '[\'Me\']', instead got: '[\'Me\', \'Me\’]'
Expected: '[\'I\']', instead got: '[\'I\', \'I\’]'
any ideas?
Jason Luboff
@JLuboff
Feb 01 2018 18:38
@BrianCodes33 Is name a number? If not...your if statement wouldn't work
Brian
@BrianCodes33
Feb 01 2018 18:41
forgot .length
thanks
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 19:30
how do I do a bitwise comparison without manually comparing each character using a for loop? at the very end of my JS code here: https://codepen.io/NEETWizardJanus/pen/JpYywN
I'm trying to display the dots when there's one of many potential lines touching it. but everything I do just puts all of them always on or always off. it's that last section that says "//test version"
alpox
@alpox
Feb 01 2018 20:09
@NEETWizardJanus dotcharset[i] & segcharset[number] you are doing a bitwise operation on strings which will not help you.
What you probably wanted was: (parseInt(dotcharset[i], 2) & parseInt(segcharset[number], 2)).toString(2).padStart(14, "0") == dotcharset[i]
This is because bitwise operations only work on numbers
Else i cannot tell much because i don't exactly know what you want to achieve with it
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:14
oh, I didn't think anyone would reply.
alpox
@alpox
Feb 01 2018 20:14
Never say never :D
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:15
hmm... I wonder if I want the original variable as an actual base2, or a string.
alpox
@alpox
Feb 01 2018 20:16
Better than the above would be:
const dotchar = parseInt(dotcharset[i], 2);
const segchar = parseInt(segcharset[number], 2);
if( (dotchar & segchar) === segchar)
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:16
does it need to be a string for me to be able to compare individual digits by variablename[i]?
alpox
@alpox
Feb 01 2018 20:17
There is no base2 in javascript. There is just a number type. I mean in any computer, the numbers are in the end always represented in binary anyway
Hmm you can also use binary operations for if you only want to compare them
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:18
I mean I realize it's all ugly messy junk code, but do I want to be converting it from string to int every time, or do I want to change my code so it's int from the start?
alpox
@alpox
Feb 01 2018 20:18
So i would keep it all as numbers instead of string
Yea int from the start would be way better
If you really need it as string in some case - of which i don't think ther will be much of a need - you could still shortly convert it with xyz.toString(2) to a string
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:19
but can I do dotcharset[i][j] if dotcharset = [ 001110010, 000110101, 001111100]?
alpox
@alpox
Feb 01 2018 20:19
Well what would you do with that digit
?
I mean what would be the purpose of accessing dotcharset[i][j]
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:20
so instead would I be doing like dotcharset[i] == 0000010000 to ... oh right, a for loop.
alpox
@alpox
Feb 01 2018 20:20
for loop?
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:21
well because i need to check individual segments of the graphical character to turn them on or off over time. because it's a clock.
alpox
@alpox
Feb 01 2018 20:21
dotcharset[i] & 16
If you want to check if the 5. digit on the right is a 1
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:22
no. not just the digit. each segment of each digit.
alpox
@alpox
Feb 01 2018 20:22
What do you mean with segment?
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:23
you know what a multi-LED is? a multi-LED clock? 7-segment LED?
each digit is made out of 7 different LED bars.
alpox
@alpox
Feb 01 2018 20:23
yea
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:23
{I mean mine's not 7 segments. it's 14}
so every time a digit changes, I have to change all 14 segments of it.
alpox
@alpox
Feb 01 2018 20:24
So you gotta find out which ones are activated and which are not i guess
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:24
and it's much easier to do that in a loop than manually write 14 nearly identical lines of code.
so if I can't do a for loop to access individual digits in an int variable the way I can with a string, that would be messy.
I wonder if I should just have a binary version and a string version to avoid converting all the time. I suppose that depends if it turns out I need both.
alpox
@alpox
Feb 01 2018 20:26
Hmm i guess i'd do something like:
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:27
hahahahaha! "don't use extra leading zeros".
god, javascript is such a stupid mess.
alpox
@alpox
Feb 01 2018 20:27
function base2ToBooleanArray(num) {
  return new Array(num).fill(false).map(i => !!((1 << i) & num));
}
That would turn the number into an array of booleans
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:28
apparently var segcharset = [ 0001000 ]; is not valid because it has leading zeros.
alpox
@alpox
Feb 01 2018 20:28
Well you cannot write binary numbers like this
As it would interpret it in base10 anyway
This would be just [ 8 ]
:-)
Or [ Math.pow(2, 3) ]
Or [ 1 << 3 ]
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:30
I'm so lost. I don't know what I'm doing.
alpox
@alpox
Feb 01 2018 20:30
These 3 would be all the same :D
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:30
can I not type these in binary?
alpox
@alpox
Feb 01 2018 20:30
You just have to rethink - you can write numbers only in base10. So you do it. It will be represented in base2 internally
Well if you want it in binary it would look like: parseInt("0001000", 2)
As you can only directly write binary in a string - then convert it to a number
And telling the conversion that it should interpret the string as a base2 string
Markus Kiili
@Masd925
Feb 01 2018 20:36
@NEETWizardJanus ES6 JS has hexadecimal, binary and octal literals.
alpox
@alpox
Feb 01 2018 20:37
@Masd925 It does have binary now? If it does i start cheering :D
I thought only octal and hexa
Markus Kiili
@Masd925
Feb 01 2018 20:37
0b1111; // 15
alpox
@alpox
Feb 01 2018 20:37
o.O oh niice
"wheeeeeeeee" :D
@NEETWizardJanus We got a winner right there -> @Masd925
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:40
Do I need to find this ES6 or do I already have that?
alpox
@alpox
Feb 01 2018 20:40
Works already in all major browsers
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:41
oh ok. whew. lemme try that.
hmmmm... made a copy of the variable in boolean. but it outputted it as decimal when I did: console.log("bsegcharset[0]:"+bsegcharset[0]);
alpox
@alpox
Feb 01 2018 20:44
A copy of the variable in boolean?
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:45
rather than editing the old variable I made a 2nd one that was boolean.
var bsegcharset = [ 0b11111110010000 , 0b00101000000011 ]
alpox
@alpox
Feb 01 2018 20:46
These are numbers, not boolean
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:48
I need to read individual boolean digits with a for loop, as well as make binary bitwise operators to match multiple digits.
alpox
@alpox
Feb 01 2018 20:48
You can use binary bitwise operators on these numbers.
You can get individual digits with as example !!(bsegcharset[0] & 0b00100000000000) if you only want to use it as a condition (truthy/falsy) bsegcharset[0] & 0b00100000000000 is enough
The first one with !! just makes a boolean out of it
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:52
ok.... let me try mucking about some more. I'm getting a bit burnt out and I'm kinda retarded and uneducated.
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:58
alpox
@alpox
Feb 01 2018 20:59
Hmm what should it be doing?
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 20:59
but I can't tell where, because it's displaying the results in decimal.
well it's supposed to find if two adjacent bars are on, and only then will it display the corner piece. {... that's actually not how it should be, but I can change it once I get the logic working}
dotcharset is supposed to be used to find bitwise and matches.
alpox
@alpox
Feb 01 2018 21:01
And segcharset is?
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 21:02
if the two 1's from dotcharset are both on the segcharset it compares it to, I want a true, otherwise a false. it's scanning through all 6 combinations and ... oh wait.... oh.... 0 has all the outside bars on, so all the corners are true, and the "1" has no two adjacent bars on so it's always false.
my mistsake.
what's the acronym for that? error between keyboard and chair?
alpox
@alpox
Feb 01 2018 21:04
Huh :D
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 21:04
{maybe my variable names are too non-descript}
alpox
@alpox
Feb 01 2018 21:04
(dotcharset[i] & segcharset[num]) == dotcharset[i]
Should do the trick
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 21:05
it does what I told it to do. I need to either compare more numbers or ideally, change it to the behavior it's supposed to have.
alpox
@alpox
Feb 01 2018 21:07
Hmm I don't quite get where you are standing now
This comparison should already be having the effect you wanted (As a comparison to show the corner)
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 21:08
it shows more varied results now that I compared a "2", but I need to change what decides what displays the corner pieces, because I did that wrong.
man, I wish I had a head for programming. I've been doing it since I was a kid, but I feel like it always takes me 10x or more longer to do anything.
alpox
@alpox
Feb 01 2018 21:09
Ah yes as you said. Well i guess you will figure out :-)
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 21:09
Thanks for the help.
alpox
@alpox
Feb 01 2018 21:09
What languages did you use?
No problem :-)
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 21:10
not sure... right now I'm just tinkering with isolated JS code in repl.it
it's taken from my larger codepen.io project.
alpox
@alpox
Feb 01 2018 21:10
Yea
NEETWizardJanus
@NEETWizardJanus
Feb 01 2018 21:23
niiiice. I got it working with the 1st 6 out of 14 connector dots. .... mostly. just gotta work on the issue of overlapping corners from neighboring digits.