본문 바로가기

공부/JavaScript

(10)
[코딩앙마] 자바스크립트 기초 강좌 (객체, 메소드, 배열) * 접근, 추가, 삭제 * 단축 프로퍼티 보다 간단하게 객체 작성할 수 O name : name = name age : age = age * 프로퍼티 존재 여부 확인 어떤 값이 나올지 확신할 수 없을 때 사용 * for ... in 반복문 객체를 순회하며 값을 얻을 수 있다 예제1. Jane에게 'age'가 없음에도 true로 출력되는 현상 발생 false로 올바르게 출력 예제2. for...in 'key'는 다른 값들이 와도 상관없음. ex) x x는 Mike에 속한 프로퍼티. -> 단축해서 작성 가능 * 객체와 메소드의 관계, this ${user.name} => ${this.name} this는 실행하는 시점, 즉 런타임에 결정된다. sayHello의 this는 각각 boy, girl 객체이다. b..
[코딩앙마] 자바스크립트 기초 강좌 (함수,함수 선언문 vs 함수 표현식,화살표 함수) ex. *매개변수가 있는 함수 msg = `Hello, ${name}` → msg += ', ' + name; ( = msg += `, ${name}`; ) // 결과 같음 * 전역 변수와 지역 변수 함수 내부에서 선언한 변수는 함수 밖에서는 사용할 수 없음. 함수 내에서만 사용. (지역 변수) 함수 내부에서 전역변수와 동일한 이름으로 선언 가능. 서로 간섭받지 않는다. 매개변수로 받은 값은 복사된 후, 함수의 지역변수가 된다. 전체 서비스에서 공통으로 봐야하는 변수를 제외하고는, 지역변수를 쓰는 습관을 들이는 것이 좋다. 전역변수가 많아지면 관리가 힘들어지기 때문. *OR 활용 * 매개변수 기본값 설정 default 값은 name이 없을 때만 할당된다. * return return문이 있으면, 그 즉시..
[코딩앙마] 자바스크립트 기초 강좌 (반복문,switch문) 반복문 loop : 동일한 작업을 여러번 반복 * for * while * do.. while 적어도 한번은 실행한다는 것이 while과의 큰 차이점. * break, continue -> 반복문 빠져나오는 개념 break : 즉시 코드 실행을 멈추고 해당 반복문을 빠져나옴 continue : 코드 실행을 멈추고 다음 명령문을 실행 '확인'을 누르면 계속 반복해서 실행되고, 취소를 반복문에서 빠져나온다. -> 무한 반복문은, 특정 조건이 되었을 때 break해주는 것이 매우 중요하다. if else문과 동일. 하지만 케이스가 다양할 경우, 보다 간결하게 쓸 수 있다는 장점 때문에 사용. ex. 해당되지 않는 과일을 입력했을 경우, 안내창 뜨게 하기 -> default 사용하면 됨. (if문의 경우 els..
[코딩앙마] 자바스크립트 기초 강좌 (형반환,기본 연산자, 비교 연산자,논리 연산자) prompt 로 입력 받은 값 -> 문자형이기 때문에 이런 결과가 도출. 따라서 형변환이 필요하다. *Number() Number("문자") // NaN *불린형으로 변환 시, false인 경우 숫자 0 빈 문자열 "" null undefined NaN (Not a Number) *주의사항 Number(null) // 0 Number(undefined) // NaN Number(0) // false Number('0') // true Number('') // false Number (' ') // true + - * / % * 나머지(%)는 어디에 쓸까? 홀수: X % 2 = 1 짝수: Y % 2 = 0 어떤 값이 들어와도 5를 넘기지 않는 수 -> X % 5 = 0 ~ 4 사이의 값만 변환 거듭제곱 c..
[코딩앙마] JS 기초강좌 자료형 *변수 let const: 절대로 바뀌지 않는 상수 (수정X) / 대문자로 선언하는 것이 좋음 자바스크립트에서 변수를 선언할 때는, 변하지 않는 값은 const, 변할 수 있는 값은 let으로 선언. 변수 규칙 * null과 undefined let age; console.log(age) 변수를 선언하고 아무것도 할당하지 않으면 undefined let user = null; 유저는 존재하지 않는다 참고) null은 객체가 아님. *alert(알려줌) / prompt(입력 받음) / confirm(확인 받음) const name = prompt("이름을 입력하세요."); alert("환영합니다, " + name + "님"); *prompt *confrim const isAdult = confirm("당신..
[생활코딩] JavaScript 29-33 (객체, 객체와 반복문,객체 프로퍼티와 메소드) *객체(Object) 함수의 기반 위에서 객체가 존재. 함수, 함수와 연관되어있는 변수가 많아졌을 때, 그룹핑해서 정리정돈하기 위한 도구. document.querySelector('body').style.color = color; -> document 가 객체 / querySelector은 document 객체에 속한 함수 / 객체에 속한 함수 => 메소드(method)라 부른다 *객체 쓰기와 읽기 -배열은 정보를 담는 그릇, 정보가 순서대로 저장됨. -> 순서 없이 정보를 저장할 수 있는 것: 객체 (=이름이 있는 정리정돈 상자) -객체를 만들 때 쓰는 기호 : {} (배열은 []) ex. var coworkers = { "programmer":"해린", "designer":"혜인" }; -> cow..
[생활코딩] JavaScript 24-28 (함수,매개변수와 인자,리턴) *함수(Function) -> 코드를 잘 정리정돈 하기 위한 도구 중 하나. 메소드(method)라고 부르는 경우도 있다. nightDayHandler 라는 함수 만들기 -> function 키워드 붙여줌 로직 실행 시키기 nightDayHandler(this); -> nightDayHandler라는 함수를 실행시켜라 함수를 이용함으로써, 이름을 통해 코드의 정체를 이해할 수 있게 되고 코드가 복잡해지는 과정에서 이득을 얻을 수 있다! *함수의 기본 문법 **코드가 연속적이지 않게 반복되면, 반복문 사용이 어려움. 이 때 함수를 사용해서 해결. document.write('1'); document.write('2-1'); document.write('2-2'); document.write('3'); do..
[생활코딩] JavaScript 19-23 (배열, 반복문, 배열과 반복문 활용) *배열(array) 데이터가 많아짐에 따라, 소프트웨어가 복잡해진다. -> 즉, 배열: 이를 해결하기 위해 데이터 중에 연관된 데이터를 잘 정리정돈해서 담아 두는 일종의 '수납상자' 순서대로 연관된 데이터를 잘 정리정돈 하는 것. 배열에서 각각의 항목들을 '원소(element)' 라고 한다. 배열의 문법 배열은 대괄호로 시작해서 대괄호로 끝난다. -배열 만들기. var coworkers = ["민지","해린"]; -> coworkers 라는 변수에 '배열'이라는 새로운 데이터 타입이 담긴 것 -가져오기. document.write(coworkers[0]); -> 첫번째 자리에 있는 값은 0번째 . 즉 index 0번은 '민지' index 1번은 해린 -들어있는 값이 몇 개 인가 체크. 검색어 추천: ja..