함수 fuction

- 코드의 재사용, 유지 보수가 용이 function 함수명( [인자...[,인자]] ){ 코드 내용 return 반환값 } //함수실행 함수명(); 1. 함수의 출력 - return : 함수 종료 / 옆의 값을 출력값으로 반환 function get_member(){ return 'bread'; return 'cheese'; return 'milk'; } alert(get_member()); //bread 출력 (그 다음 단어는 출력되지 않음 - 함수 종료되었으므로) 2. 함수의 입력 - 함수의 ()안에 매개변수(parameter) 입력 ex) arg - 매개변수로 전달된 값은 인자(argument) ex) 1, 2 function sayHello (nameOfPerson){ console.log("H..

반복문 for

- loop, iterate : 반복하다 - 조건을 종료시켜주는 것이 중요 (무한 루프를 시키면 웹사이트가 작동하지 않음) 1. while - i 변수 초기화, 반복 조건, i 변수 증가 var i = 0; while(i < 10){ // 종료조건으로 i의 값이 10보다 작다면 true, 같거나 크다면 false document.write('coding everybody '); // 반복이 실행될 때마다 출력 i++; // i의 값이 1씩 증가 } 2. for - while문의 3가지 조건들을 하나의 문법으로 선언 for(var i = 0; i < 10; i++){ document.write('coding everybody'+i+' '); } *i++; 와 ++i;는 다름 - i++; i값 대입 후 증가..

조건문 if

- Conditional Statement, 주어진 조건에 따라 다르게 동작 - if 문으로 시작, 조건이 false면 실행되지 않음 - 조건은 항상 true or false로 나뉘어야 함 if(true){ //실행 alert('result : true'); } if(false){ //실행되지 않음 alert('result : true'); } - else : if가 false일 때 실행 - else if : 여러 조건 연결 가능 if(false){ alert(1); } else if(true){ //if가 실행되지 않을 때, 그리고 어떠한 조건일 때 실행 alert(2); } else if(true){ // 건너뜀 (2번째에서 실행) alert(3); } else { //건너뜀 (2번째에서 실행) al..

비교 연산자 ==, ===

1. 대입연산자 a = 1; 2. 비교연산자 - 좌항과 우항의 값이 같은지, 큰지, 크거나 같은지 판별 - true, false 두 가지 값을 가짐 (boolean형) 2-1 .동등연산자 == (equal operator) - 이퀄을 2개 써줘야 함 (하나쓰면 대입연산자) alert(1==2) //false alert(1==1) //true alert("one"=="two") //false alert("one"=="one") //true 2-1 .일치연산자 === ( strict equal operator) - 좌항과 우항의 값과 데이터 형식 모두 일치 alert(1=='1'); //true alert(1==='1'); //false 숫자와 문자이기 때문 **왜 ===를 써야하는가? alert(null ..

변수와 데이터 타입

1. 변수 let a = 1; a = 3; // 다른 값 담기, 앞에 변수 선언을 또 할 필요는 없음 alert(a) = 3; let a = 1, b = 2, c = 3; // 한 줄로 선언도 가능 const a = 1; a = 3; // 불가능!! 절대값이므로 바뀔 수 없음 - let은 최초 선언시에만 사용 - const 는 변하지 않는 값 (새로운 값 담기 불가능) - 옛날에는 var를 썼으나, 변하는 값과 변하지 않는 값을 구분하기 위해 let, const 가 만들어짐 --> const를 기본적으로 쓰고 변해야 하는 값은 let, var는 이제 쓰지 않는 것을 추천! - 코드의 재활용성을 높여줌 //변수 사용 전 alert(100+10); alert((100+10)/10); alert(((100+1..

숫자와 문자 - 문자의 연산

- 문자열은 항상 "", '' 안에 console.log("Hello World"); - 1은 숫자 , "1" 은 문자열 console.log(typeof(1)); //number console.log(typeof("1")); //string - 안에 '나 ""를 그 안에 중복해서 쓰고 싶다면, 역슬래쉬(back slash) 사용 (escape) console.log("Hello\" World"); //역슬래쉬 뒤의 문자 한 개는 문자의 시작 - 끝을 알리는 기호로 인식하지 않음 - 여러 줄을 쓰고 싶다면, 역슬래쉬 + n 사용 console.log("Hello\nWorld"); - 문자와 문자를 결합하고 싶다면, "" + "" (더하기로 연결) console.log("Hello" + "World"); ..

숫자와 문자 - 수의 연산

console.log(1); //정수 console.log(1.1); //실수(소수점) 1. 사칙연산 + : 더하기 - : 빼기 * : 곱셈 / : 나눗셈 2. 수의 연산 : Math Math.pow(3,2); // 9, 3의 2승 (Math.power) Math.round(10.6); // 11, 10.6을 반올림 Math.ceil(10.2); // 11, 10.2를 올림 Math.floor(10.6); // 10, 10.6을 내림 Math.sqrt(9); // 3, 3의 제곱근 Math.random(); // 0부터 1.0 사이의 랜덤한 숫자, 난수 100 * Math.random(); // 100보다 작은 난수(임의의 숫자) //난수는 1보다 작은 값이 호출되므로 몇을 곱하든 그 숫자보다 작은 수가..

Orientation

/*생활코딩 javascript 정리본*/ - 컴퓨터 언어이자 프로그래밍 언어 ex) html 은 그냥 컴퓨터 언어 - 웹브라우저를 동작시키도록 만들어짐 - 요즘 경향 : 탈웹브라우저 + 탈웹 - 웹브라우저를 떠나 웹서버를 제어하기 위한 도구로 사용 (서버사이드 스크립트) ex) Node.js - Google Apps Script (스트레드 시트 - 도구 - script 편집기) 자바스크립트가 웹브라우저 뿐만 아니라 다향한 분야에서 쓰이기 시작 - 환경과 언어를 분리해서 습득하는 것이 효율적 *환경이란? - 언어를 사용하는 대상 - 문법은 언어적 특성, 명령어는 환경에 따라 달라짐

vue 소개

- 프론트엔드 자바스크립트 프레임워크 - Angular, Backbone, React 에 비하여 매우 작고 가벼우며, 복잡도도 낮음 - CDN 으로 불러와서 사용하기도 매우 간편, 원한다면 webpack 으로도 구성 가능 - 매뉴얼이 타 프레임워크 / 라이브러리에 비해서 한글화가 엄청 잘 되어있음 - 다른 프레임워크와의 비교 1. vue의 구조 - 코어 라이브러리는 화면단 데이터 표현에 관한 기능들을 중점적으로 지원하지만 프레임워크의 기능인 라우터, 상태관리, 테스팅 등을 쉽게 결합할 수 있는 형태로도 제공 . 즉, 단순 라이브러리의 기능 외에 프레임워크 역할도 수행 2-1. vue의 특징 - MVVC 패턴 - UI 화면 개발 방법 중 하나인 MVVM 패턴의 뷰 모델에 해당하는 화면단 라이브러리 - MV..