목록개발 Web/JS (37)
음악, 삶, 개발
developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Classes/static youtu.be/_DLhUBWsRtw?t=901 static 은 C++ 에서도 많이 보았던 키워드이다. static 이 앞에 붙은 멤버나 함수는 해당 클래스의 인스턴스가 호출할수없으며, 클래스명 자체에 dot 을 붙여 호출한다. class Person { static lifeTime = 100 static cry() { console.log('ung! ung!')} } console.log(Person.lifeTime) // 100 Person.cry() // ung! ung! const p = new Person p.cry() // Error : p.cry is ..
JS 에서는 함수의 인자로 다른 함수를 전달할수있다. 이것이 가능한 이유는 함수 또한 객체이기때문이다. const a = () => {} // 나도 함수지만 변수에 저장함! 내가 직접 호출하는것이 아닌 다른 함수가 특정 조건이 되었을때 뒤늦게 대신 호출해주는 함수를 콜백함수라고한다. 따라서, 함수를 다른 함수의 객체로 넘기고, 다른 함수에 의해 호출되도록 할수있다. const a = () => { console.log('a is called!')} const callBack = (fuc) => { fuc() } a() // 'a is called!'
JS 에서 함수를 작성하는 방식은 2가지가 있다. const f1 = () => { console.log('expression!')} function f2() { console.log('declaration!')} f1() f2() 이 둘의 중요한 차이점은, function delcaration 은 호이스팅 (뒤에 선언한 함수를 끌어올려 호출) 이 되지만, function expression 은 호이스팅이 되지않는다. const f1 = () => { console.log('f1!')} f2() const f2 = () => { console.log('f2')} // Error : Cannot access 'f2' before initializa..
엘리님의 강좌를 보다가, 너무 중요한 원칙을 배웠다. 함수를 작성할때는 최대한 빨리 return 하거나 함수를 빠져나오는쪽으로 작성하라는것이다. function bad(age) { if (age > 30) { // do something } } 위와 같이 작성하기보다는.. function good(age) { if (age
JS 에서는 함수안에 함수를 정의할수있고, 자식 함수는 부모 함수가 가진 변수를 끌어다 쓸수있다. 하지만 부모 함수가 자식 함수의 변수는 local scope 이기때문에 사용할수없다. function a() { const n1 = 1 function b() { const n2 = 2 function c() { console.log(n1 + n2) } c() } b() } a() // 3 출력 사실 그다지 좋은 모양새의 코드는 아니다. 절대 사용하지않을거같다. 하지만 누군가가 이렇게 작성하는 코드를 볼수도 있기에, 그냥 정리해보았다.
pass-by-value pass-by-reference C++ 에서 지겹게 들었던 말이다. C++ 처럼 함수 인자에 &가 붙거나 *가 붙거나 그렇지는 않고, 비교적 단순하다. primitive type 은 pass-by-value 로, object type 은 pass-by-reference 로 무조건 전달된다. 아래의 코드를 보자. const n = 1 function changeNum(n) { n = n + 1 } changeNum(n) console.log(n) // 여전히 1 primitive type 이기때문에 value 로 넘겨져서, 함수 내부에서 바꾸려해도 바뀌지않는다. 이때는 return 하는 함수로 만들어, 다시 원래..
Switch 문 사용시, 매 case 마다 다른 일을 하는것이 아니라, 몇몇 case 는 동일한 함수를 실행할것이라면, 빈 칸을 두고 다음 case 를 작성하면 된다. 그러면 묶어서 하나의 case 로 인식되어, 결과를 호출하게된다. const str = 'park' switch (str) { case 'lee' : console.log('cool'); break case 'kim' : case 'park' : case 'choi' : console.log('bad!'); break default : console.log('def') }
JS 의 object 를 저장할 변수는 C++ 의 reference 나 포인터를 떠올리는게 좋다. 객체 그 자체가 아니라, 객체를 가리키는 주소값을 저장하기때문이다. 따라서 두 객체가 가진 내용물이 동일하다 하더라도, 서로 다른 메모리에 저장되어있는 객체이므로 동일하지않다. 하지만 주소값을 복사한경우는 동일하다. 따라서 객체간에 === 를 해볼시에는 주소값을 비교하는것이다. const a = { name : 'lee' } const b = { name : 'lee' } const c = b // a 의 주소값을 복사 console.log(a === b) // false 객체의 주소값이 다름 console.log(a === c) // t..
or 연산자 (||) 는 초기에 true 를 발견하면 뒤에 조건들이 true 인지 false 인지 확인하지않고, 바로 다음 코드로 넘어간다. 때에 따라 true 나 false 를 확인하는 함수를 이 위치에 호출하는 경우가 생기는데, 이때는 가장 뒤에 두는것이 best practice 이다. 어짜피 앞전에서 true 가 확인되면 or 이기때문에 뒤에 조건들을 굳이 확인할 필요가없는데, 앞에서 무거운 연산이 들어가버리면, 안해도 되는 연산을 하게되는것일수있기때문이다. 이 논리는 당연히 && (and) 를 확인할때도 마찬가지로 적용된다. heavy 한 operation 일수록 뒤로 보내는것이 좋다. && 역시 초기 조건이 false 이면 뒤..