목록개발 Web (242)
음악, 삶, 개발
JS 에서 string 을 사용할때, 내용물이 같으면 두 변수는 동일하다. const id_1 = 'id' const id_2 = 'id' console.log(id_1 === id_2) // true 이를 원치않는 경우 Symbol 을 사용하면 서로 다른 instance 로 구분하게된다. const sym_1 = Symbol('id') const sym_2 = Symbol('id') console.log(sym_1 === sym_2) // false
undefined 는 아무것도 할당되어있지않은 변수를 의미한다. let a; console.log(a) // undefined
false 가 될수있는것들 이외에는 모두다 true 가 될수있다. 아래의 것들을 외우자. const a = 0 // false const b = null // false const c = undefined // false const d = NaN // false const e = '' // false
JS 에서 이것저것 계산을 하다보면 나누기를 당연히 자주 하게되는데, 이때 0 으로 나눌 경우 Infinity , -Infinity, NaN 등이 출력된다. 따라서 내가 나눌려는 녀석이 0 인지 아닌지를 확인하는게 중요하다. const a = 1 / 0 const b = -1 / 0 const c = 'not a number' / 2 console.log(a) // Infinity console.log(b) // -Infinity console.log(c) // NaN
re-rendering 을 원한다면 함수를 써도 되지만, static 한 style 일 경우 return 값으로 넘겨야한다. 위 경우 해당 컴포넌트에 무슨일이 일어날때마다, v-text 가 변한다. 이것을 방지하려면, 위와 같이 생성후 return 해주어야한다. 이는 v-text 뿐아니라 :style 에도 적용된다. 의도적으로 무슨일이 생길때마다 랜더링을 원하다면 함수를 바로 사용하는것이고, 아닐 경우 return 한다.
const f = { a : () => 'hello', b : () => 'world', c : () => f.a() + ' ' + f.b(), } const greeting = f.c() console.log(greeting) // hello world
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/onZB2/btqTLxwVETN/2vPDOdYkUBGjs2FHyUQGI0/img.gif)
먼저 이걸 기억하자. v-for 를 사용하는 요소는 독립된 컴포넌트, 즉 .vue 파일이어야한다. Vue 를 사용하면 Virtual DOM 을 사용하므로, 업데이트된 요소만 다시 랜더링된다고 배우지만, div나 기본 tag를 v-for 하게되면 전체가 랜더링되게 된다. add {{e}} 보이는것처럼, 요소를 추가하는데 모든 요소가 다시 랜더링되고있다. 따라서 v-for 를 할 요소는, 반드시 독립된 vue 파일로 만들어 분리해야한다.
v3.vuejs.org/guide/class-and-style.html#object-syntax-2 style 속성에 array 를 넣으므로써, class 를 흉내낼수있다. ES6 를 활용하면 아래와 같이 객체로도 가능하다.
poiemaweb.com/typescript-interface /* js */ const man = { name : 'lee' } const woman = { name : 'jeong' } 위의 코드가 JS 의 약점을 보여준다. 이 둘은 똑같이 Object 타입이다. 이 둘을 코드상에서 구분하는 방법은 아마도 변수명 + 코멘트일것이다. TS 에서는 Object 를 더 세부 타입으로 분류하게 해준다. 이때 사용하는 키워드가 interface 이다. /* ts */ interface Man { name : string } interface Woman { name : string } const man: Man = { name : 'lee'} const woman: Woman = { name :..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/3FnT2/btqSmBggqlj/Az1Ii0WxtrRGwOiC60LMXk/img.png)
youtu.be/VJ8rvsw2j5w 나는 작년에 C++ 를 4개월간 공부했었다. C++ 는 극도로 type 에 예민한 언어인 반면, JS 는 type 을 완전히 무시할수있는 언어이다. 따라서 C++ 에서는 상상도 못할 아래와 같은 미친 대입이 가능하다. /* test.js */ let a a = 1 // a is now number a = 'one' // a is now string a = true // a is now boolean a = [] // a is now array a = {} // a is now object 따라서 JS 로 코딩할때는, "이 변수에 number 대신 array 를 대입할 일은 없을거야..." 라는 심약한 생각으로 코..