본문 바로가기
728x90
반응형

비개발자, CPO가 되기까지26

19.12.17 개발기록 -[Javascript] 개발 중 비동기로 인한 이슈 사항 자 오늘 포스팅할 내용은 무엇이냐~ Javascript의 가장 큰 특징 중 하나인 비동기로 인해 일어나는 이슈 중 한가지 ! 우선 비동기가 무엇이냐? 특정코드의 연산이 끝나기 전에 코드의 실행을 끝내지 않고, 그 다음 코드를 먼저 실행하는 자바스크립트의 특성이다. 그러니까 내가 적어놓은 코드를 위에서부터 아래로 내려가기는 하지만, 특정코드를 불러놓고 그것이 실행될 때까지 정지하고 기다리는 것이 아니라, 불러놓고 오든지 말든지 그냥 그다음 코드를 실행하면서 쭉쭉 내려간다는 것이다. 나는 Javascript로 개발에 입문을 해서, 이게 특이한 건지, 뭔지 몰랐지만 요거 때문에 Javascript 개발자들이 디-게 힘들어하는 것 같았다. 특히나 내가 아래 구현해놓은 코드에서 ajax를 이용할 때 이 특성이 크.. 2019. 12. 18.
19.12.16 개발기록 -[Javascript] switch 조건문을 이용하던 중 오늘 내가 한 실수 기록. 자 오늘 포스팅할 내용은 무엇이냐~ 오늘 switch 조건문을 이용하던 중 내가 했던 굉장히 어이없고 쪽팔리는 실수를 기록해두려고 한다. 다시는 그러지말자 루크야..허허 우선 내가 구현하려고 했던 것을 보여주자면, 요로코롬 각 버튼을 눌렀을 때 안에 있는 class들의 색깔을 바꾸는 것 + 안에 input (이미지 상 1 적혀 있는 곳이 input 태그로, 숫자를 입력할 수 있는 곳이다) 태그의 onkeyup 이벤트로 숫자를 입력할 때에도 자신의 색깔을 유지하며, 내용이 바뀌는 것이다. 위 사진 처럼 switch 문을 사용할 때 실수를 하여 색깔이 맞지 않게 표현되었다. 내가 한 실수를 캡쳐해서 보여주자면, 여기서 i 는 각 보기를 불러오는 index가 되겠다. 아주 멋지게 switch 문을 이용하였고,.. 2019. 12. 17.
19.12.13 개발기록 -[Javascript] 반복문을 이용하여 버튼 3개에 각각의 id 부여, onclick 이벤트 발생 시 어떤 버튼을 클릭했는 지 구분 가능하게 하기. 오늘은 반복문을 이용하여 버튼 3개를 만들고, 각 버튼에 id를 부여하여 3개중 어느 하나를 클릭 했을 때 자신에게 맞는 이벤트가 발생하게 하는 프로그래밍을 해보자. 말로 설명하기 디게 어려우니, 사진으로 하나씩 차근차근 설명해보자. 위 사진에서, 아래의 사진과 같이 구현하고 싶다는 뜻이다. 1. 첫 번째 버튼을 클릭했을 때, 2. 두 번째 버튼 클릭 시, 3. 세 번째 버튼 클릭 시, 요렇게 말이다. 우선 첫 번째로 할 일은, 각 버튼을 for 반목문을 이용하여 만들면서, 각각에 id를 줄 수 있어야 한다. 나 같은 경우는, for 문을 돌면서 버튼을 생성하면서, 'btn' + i 라는 id를 부여했다. 1 2 3 4 5 6 7 8 9 for (var i in prediction) { var predi.. 2019. 12. 14.
19.12.12 개발기록 -[Javascript] 게시물 상황에 맞는 class 부여하기. 게시물이나 다른 업로드 된 컨텐츠 등이 D-Day가 정해져 있다던지, 내가 이미 확인한 게시물이라던지, 어떤 상황에 따라 색상을 바꾸어 주는 등의 변화를 줘야할 때가 있다. 그럴 때, 함수로 각 상황에 맞는 status를 지정하여 반환하여 주고, 게시물을 그려낼 때 switch 조건문을 이용하여 각 class를 부여하면 된다. 우선, 나 같은 경우 var status = active 로 기본 status를 선언해주고, 아래 사진과 같이 각 상황에 따라 status의 값을 변경해주었다. 그리고, return 값으로 status 값을 내보내주어, switch 문을 이용하여 각 status에 따라 class를 다르게 맥였다 !! 이렇게 코드를 구현하니 되게 코드가 깔끔하고 이쁘고, 사랑스럽고 막 그렇게 구현할.. 2019. 12. 13.
19.12.11 개발기록 -[Javascript] 화면 전환 버튼 구현하기 오늘은 저번에 포스팅했던 화면전환에서, 버튼을 클릭하면 다음페이지 및 이전 페이지로 넘어가도록 구현해보도록 하겠다. 전체 화면을 보면 디-게 간지지만, 혹여나 문제가 될까 버튼부분만 캡쳐하여 올리도록 한다. 위 사진 오른쪽 하단의 왼쪽, 오른쪽 버튼을 누르면 해당 페이지로 넘어가도록 구현해본다. 이렇게 말이다. 위와 같이 구현하기 위해서는 아주아주 간단한 알고리즘을 생각해내면 된다. 1. 각 페이지 마다 index를 부여한다. -> 첫 번째 페이지의 index = 0, 두 번째 페이지 index = 1, 세 번째 페이지는 index = 2, 이런식으로 말이다. 1 2 3 4 03/ 03 2. 그리고 우선 html 파일에 있는 각 오른쪽 왼쪽의 버튼 이미지에 onclick 이벤트를 부여한다. 저기 보이는 .. 2019. 12. 11.
728x90
반응형

티스토리툴바