본문 바로가기
300x250

개발 공부143

자바스크립트_생성자 함수 개념정리 이번 포스팅은 생성장 함수에 대해 알아보겠습니다. 굉장히 간단하게 여러 변수를 만들어낼 수 있습니다. 천천히 한번 읽어보세요. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 생성자 함수 function User(name, age) { this.name = name; this.age = age; }; let user1 = new User('mike', 30); let user2 = new User('jane', 20); let user3 = new User('jun', 27); // 1) 함수 이름의 첫 글자를 대문자로 바꿔준다. // 2) new 연산자를 사용하여 호출한 형태다. // 3) .. 2021. 5. 10.
자바스크립트 식별자 API 개념정리(1)_getElementById, className, classList 사용법 식별자 api 엘리먼트를 제어하기 위해서는 그 엘리먼트를 조회하기 위한 식별자가 필요하다. 이번 포스팅은 식별자 api에 대해서 알아보겠습니다. HTML에서 엘리먼트의 이름과 id 그리고 class는 식별자로 사용됩니다.. 식별자 API는 이 식별자를 가져오고 변경하는 역할을 합니다. 1 2 3 4 5 html cdd javascript Colored by Color Scripter cs 태그네임을 찾는 방법 Element.id 문서에서 id는 단 하나만 등장할 수 있는 식별자다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 document.getElementById('active').tagname //=> "LI" document.getElementById('active').tagname.. 2021. 5. 10.
Dom 기본개념 정리(2)_알아두면 좋은 이벤트와 이벤트의 기본 문법, value와 textContent의 차이 이번 글에서는 Dom에서 event의 기본문접과 알아두면 좋은 event와 'value와 textContent의 차이 3가지에 대해 이야기해보겠습니다. 첫번째 value와 textContent의 차이는 html 태그를 생각해보시면 됩니다. 우리가 알고 있는 input, textarea 등과 같이 사용자가 직접 작성해야 하는 칸이 있을겁니다. 그 칸에 들어가는 사용자가 입력한 값이 value가 됩니다. textContent는 div, a, h1 등의 태그는 안에 저희가 설정한 값이 들어가게됩니다. 개발공부 화이팅 이라는 태그가 있다면 dom에서는 1 2 3 let h1Element = document.querySelecteot('h1') h1Element.textContent = "개발공부 화이팅" cs .. 2021. 5. 10.
react 리액트 반복문 만들기 map 이번 포스팅은 리액트에서 반복문을 만드는 방법에 대해 알아보겠습니다. 먼저 App.js에 만든 movies라는 변수의 형태입니다. 총 4개의 객체가 있는 배열입니다. 두번째는 renderMovies라는 변수를 선언하는데 movies라는 배열을 반복문을 돌려 같은 함수를 적용시킵니다. 밑에 보시면 movie라는 변수(24번 줄)를 선언하였는데 여기서 movie는 배열을 순서대로 도는 변수라고 생각하시면 될거같습니다. 인덱스로 나타내면 -> movies[0], movies[1], movies[2], movies[3] 이런 식으로 반복이 될겁니다. 여기서 movie는 movies[0], movies[1], movies[2], movies[3] 이거라고 보시면 됩니다. 배열안의 객체를 돌며 title과 id, .. 2021. 5. 10.
알고리즘_배열안의 배열 객체 만들기, 객체 오름차순 비교 개인 정보를 담은 배열을 입력받습니다. 조건에 맞게 각 개인의 전체 이름을 요소로 갖는 배열을 리턴해야 합니다. 조건1) firstName 과 lastName 이 모두 있으면 나타내고 하나만 있을때는 하나만 나타내줍니다. 조건2)사람들의 나이는 모두 다르고, 오름차순으로 정렬해야합니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 let peoplelist = [ [ ['firstName', 'goo'], ['age', 42], ['gender', 'male'], ], [ ['firstName', 'kim'], ['lastName', 'gangjun'], ['age', 30], ['gender', 'female'], ], [ ['lastName', 'lee'], ['a.. 2021. 5. 9.
알고리즘_아이소그램 문제풀이 문자열을 입력받아 아이소그램인지 여부를 리턴해야 한다. 아이소그램은 각 알파벳을 한 번씩만 이용해서 만든 단어나 문구를 말한다. isogram 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 function isIsogram(str) { let newStr = str.toLowerCase(); let result = true; if(str.length === 0){ return result; } for(let i = 0; i 2021. 5. 9.
문자열을 정수로 바꾸는 함수 parseInt() 와 parseFloat() 정리/Java script 문자열을 정수로 바꿔주는 함수 2가지 1. parseInt(string [. n]) 문자열을 정수로 바꾸는 함수이다. 특징 1)[.n]은 옵션이다 들어갈 수 있는 숫자는 2,4,8,10,16,36 - n진법일때의값으로 바꾼다. (하지만 아직 나에겐 쓸일이 없다.) - 안쓰면 그냥 10진법 2)소수부분이 있으면 버린다. 3)띄어 쓰기로 여러개의 수가 있으면 첫번째 수만 바꿔준다. 4)공백으로 시작하면 공백 무시 5)수가 아닌 문자면 NaN을 반환 예시) parseInt('25.34') ===> 25 parseInt('200', 10 ) ===> 200 parseInt('100', 2) ===> 4 parseInt('0x100') ===> 256 2. parseFloat(string) 문자열을 실수로 바꿔주.. 2021. 5. 9.
CLI 필수 command line CLI (command-line Interface) 명령어를 입력해 컴퓨터를조작하는 방법 (1) input source =입력소스 (2) output source=출력소스 (1),(2) 함께 '아이오' 라고 부른다. 우리가 찾아서 클릭하는 것을 GUI라고 한다. GUI가 할 수 있는 모든 작업은 CLI로 할 수 있다. 다만 사람이 키보드로 입력하면, 모니터에 글자로 출력하기 때문에 GUI에 익숙해진 현대인에게 낯설게 느껴질 뿐이다. CLI의 필수 필수 키워드 대기모드 = prompt 필수 커맨드 라인 1)ls : 해당 위치에 있는 파일 보기 2)ls -al : 해당 위치에 있는 파일들의 상세 정보 보기 3)cd : 입력하는 디렉토리로 이동 (cd + 디렉토리명) 4)cd ~ : 홈 디렉토리로 이동 5)c.. 2021. 5. 9.
유효성 검사 하기_code states 과제 4주차에 진행했던 유효성 검사 과제이다. 아이디가 4글자이상이면 사용할 수 있는 아이디라고 뜨고, 비빌번호는 비밀번호 확인이랑 같아야 한다. dom으로 진행하였다. 모바일 폼과 브라우저 크기에 맞쳐서 css 스타일을 변화하게 만들어봤다. 겉표지만 만든거고 아직 부족하지만 재밌는 과제였다. 코드는 밑에 에서 확인하실수있습니다. github.com/dydwns2441/validation-check dydwns2441/validation-check Contribute to dydwns2441/validation-check development by creating an account on GitHub. github.com 2021. 5. 8.
반응형

티스토리툴바