whatisthis?

- 특정 조건 아래서만 코드가 실행되도록 하는 구문. - if, switch가 대표적 📌 if문 if (조건) { 내용 } - 조건이 true면 내용이 실행된다. const a = 30; if(a > 10) { alert('10보다 큼'); } 위에서처럼 a>10인 조건에 true이기 때문에, 즉 조건을 만족하므로 alert문이 실행된다. 추가로, if 뿐만 아니라 else나 else if로 조건을 구체화할 수 있다. if(a > 10) { alert('10보다 큼'); } else if (a > 5) { alert('5보다 큼'); } else { alert('5보다 작거나 같음'); } - else는 if의 조건이 false일 때 실행된다. - else if는 조건을..

1. 연산자 - 프로그래밍에서 쓰이는 기호들. 📌 산술 연산자 사칙연산. (=arithmetic operation) + , - , * , / 그리고 나머지연산자(%) Addition / Subtraction / Multiplication / Division / Mod(Moudlus) ❗ /는 그냥 나누기 (몫 아님). 즉, 5 / 2 = 2.5 ❗ +를 제외한 나머지(-와 *와 /)는 "3" 과 "2"처럼 문자열로 표현된 숫자의 계산도 해줌. >> + 연산자는 "2"+"3" = '23' 이 됨. 📌 문자열 연산자 + 연산자. 숫자 뿐만 아니라 문자열과 다른 데이터를 연결해줌. >> 문자열이 아닌 데이터(예- 숫자)는 문자열로 바꾸어 연결. ❗ 왼쪽부터 계산되고, 문자열이 있을 경우 문자열이 우선이다. c..

1. 함수(Function) 📌 함수의 생성 방법 1 / 함수 선언 (Declaration) function addOne(x) { var y = x + 1; return y; } 방법 2 / 함수 표현식 (Expression) let addOne = function(x){ // 변수 선언 후 함수 대입 var y = x + 1; return y; }; 여기서 addOne은 함수의 이름(=변수의 이름)이고, x는 사용자가 넣고싶은 값을 넣는 곳이다. 따라서, x를 매개변수(parameter)라고 한다. return은 해당 값을 함수 바깥으로 내보내고, 함수를 종료하라는 의미이다. (= 반환) ❗❗ 주의 - return의 위치 위 두 방식의 차이 중 하나는 호이스팅(hoisting)이라는 현상인데, 해당 내..

1. 객체 (Object) - 현실의 사물을 프로그래밍에 반영한 것. 예> 현실에 존재하는 유저를 객체를 통해 프로그래밍에 반영할 수 있다. let user = { Name: 'yjin', Age: 23, Tel: '010-0000-0000', Gender: 'Female' }; 위와 같이 user라는 변수에 { } 로 감싼 덩어리를 대입한 것을 알수 있다. { }로 감싼 덩어리가 바로 객체(object)에 해당한다. 객체의 부분별 이름을 살펴보자. 📌 속성 (Property) Name: 'yjin' , Age: 23 과 같이 콤마(,)로 구분되는 것을 객체의 속성(Property)이라고 한다. - 위 예시에는 총 4개의 속성이 존재하는 것. 속성끼리는 쉼표로 구분해준다. 꼭 줄바꿈을 해야하는 것은 아니..

💡 자바스크립트 - 창시자 : 브렌던 아이크 - 절차형, 객체지향형, 함수형 언어를 모두 아우를 수 있다. - 인터넷 브라우저만을 통해 구현 가능. (F12 개발자도구 - console) 1. 변수 (variable) const dateChecker = function() { // 변수1. 함수(함수 선언/코드 저장) let date = new Date(); // 변수2. value(날짜값 저장) alert(date); } dateChecker(); 이전에는 var으로 변수를 선언하는 방법밖에 없었지만, ECMAscript 6(이하 ES2015) 이후로 const와 let이 등장하면서 이제는 var을 거의 사용하지 않게 되었다. 📌 변수(variable)란? 변수란, '변하는 수' 를 의미한다. = 데이..

객체를 생성하기 위한 Template. class도 함수와 마찬가지로 Class표현식과 Class선언 두가지 방법이 존재. - 함수표현식 vs 함수선언 비교 javaScript. 함수선언식 vs. 함수표현식 함수 선언 방식 = 함수가 독립된 구문 형태로 존재. 함수 표현식 방식 = 함수가 표현식의 일부로 존재. 함수선언식 (function Declaration) - 지정된 매개변수(parameter)를 갖는 함수를 정의 SYNTAX fun mywebproject.tistory.com 1 / 클래스 선언 class Rectangle { constructor(height, width) { this.height = height; this.width = width; } } - class 키워드 + 클래스명 (R..

- ES2015 이후 추가된 기능으로, 쉽게 말해서 백틱(`) 기능이라고 생각하면 된다. __ 📙 템플릿(Template) 이란? - 서식 or 견본. - 미리 준비되어 있는 틀. __ - 복잡한 문자열(String)을 만들 때 띄어쓰기나 따옴표 등의 오타가 자주 발생함. - 따라서, 백틱(`) 기호를 사용하여 +와 따옴표를 쓰지 않도록 함. const name = 'yjin'; const obj1 = { age: 23 }; const string = `I am ${name}, ${obj1.age} years old.`; - 따옴표 대신 백틱 사용 - 변수들은 ${ } 로 감싸줌 >> 틀을 만들어놓고, 데이터가 들어갈 공간 ${ } 를 줌. - 데이터가 알아서 그 틀에 맞게 들어가 문자열이 완성됨. - ..

ES6(2015) - 함수(Function) - 화살표 함수(Arrow Function) 추가됨. - 기존 ES5 코드 var object = { name: 'Zero', friends: ['One', 'Two', 'Three'], alertFriends: function() { var self = this; // 객체의 this를 변수로 저장해둠. 왜? 🔻 this.friends.forEach(function(friend) { // forEach 안에선 this가 바뀌므로. alert(self.name + ' and ' + friend); }); } }; object.alertFriends(); // 세 번 알림 - this.friends는 해당 객체 내의 friends 변수(=배열)이다. - 즉, A..

객체의 Method를 콜백(Callback 함수)으로 전달할 때 ’this 정보가 사라지는’ 문제가 발생한다. 이 문제는 어떻게 해결해야 할까? let Obj = { class = 3; names = ['lee', 'kim', 'park', 'choi'], this.names.forEach( function(name) { alert('class' + this.class + name); // this 정보가 사라짐 }; 📌 this가 사라지는 경우 - 객체 메서드가 객체 내부가 아닌 다른곳에 전달되어 호출될 때 - 객체의 Method를 콜백(Callback 함수)으로 전달할 때 - 그 외 ) setTimeout(function, 1000) 등의 경우 - this에 window를 할당함. 📌📌 bind() ..

const sayYeah = () => { alert('Yeah'); }; // 바뀌기 전 코드 var sayYeah = function() { alert('Yeah'); }; 1. var -> const, let 2. Arrow Function 💡 위 방식은 함수표현식 이므로 블록 끝에 ;(세미콜론)을 붙인다. javaScript. 함수선언식 vs. 함수표현식 함수 선언 방식 = 함수가 독립된 구문 형태로 존재. 함수 표현식 방식 = 함수가 표현식의 일부로 존재. 함수선언식 (function Declaration) - 지정된 매개변수(parameter)를 갖는 함수를 정의 SYNTAX fun mywebproject.tistory.com ___ 객체에 해당하는 내용을 살펴보자. var sayYeah = ..