JS (13) 썸네일형 리스트형 [JS] 자바스크립트 메소드 체이닝 메소드 체이닝 (Method Chaining) split 메소드: 문자를 split에 적용되어 있는 인수 기준으로 배열로 쪼개서 데이터로 변환해서 반환. i.e. '문자'를 배열 데이터로 변환 reverse 메소드: 배열을 기본 순서가 아닌 반대의 순서로 뒤집어 주는 역할을 한다. join 메소드: 배열 데이터를 인수 기준으로 문자들을 하나씩 붙여서 병합해 변환한다. const a = 'Evelyn!'; const b = a.split('').reverse().join(''); // a 배열 뒤에 메소드+메소드+메소드... 이런 형식을 메소드 체이닝이라고 한다. console.log(a); // Evelyn! console.log(b); // !nylevE [JS] 자바스크립트 DOM API DOM API (Document Object Model, Application Programming Interface) (어플리케이션)웹사이트가 동작하도록 입력하는 프로그래밍 명령 i.e. 자바스크립트에서 (DOM)HTML을 제어하는 여러가지 명령들(API)이다. BOX! CSS 선택자(.box)를 통해 HTML부분에서 특정 요소를 찾아서 그것을 변수 boxEl에 할당한다. let boxEl = document.querySelector('.box'); console.log(boxEl); 하지만 브라우저가 위에서 아래로 HTML코드를 읽어 내려가는 특성으로 HTML DOM API 실행 과정 요소 1개만 검색,찾기를 통한 실행 과정 // HTML 요소(Element) 1개 검색/찾기 const boxEl =.. [JS] 자바스크립트 조건문 조건문 (if, else) 조건의 결과(truthy, falsy)에 따라 다른 코드를 실행하는 구문 bloolean 값으로 ture를 isShow 라는 변수 이름에 할당한다. let isShow = true; let checked = false; // if 조건 구문 if (isShow){ console.log('Show!!'); // Show! }; if (checked){ console.log('checked!'); }; else 조건을 추가하여 보자! isShow조건이 참인 경우, if (isShow)가 참이니 'Show!'를 출력하게 되고, 아니면(else) 'hide!'는 출력되지 않는다. let isShow = true;// 주목! if (isShow) { console.log('Show!').. [JS] 자바스크립트 변수, 예약어 변수 저장된 데이터를 참조(사용)하는 용도로 데이터의 이름을 짓는 변수 변수를 만들 수 있는 데이터 이름 (var, let, const) 특징 : - 저장된 변수는 재사용이 가능하다. - let키워드를 통해 변수a를 명시 후 데이터'2'를 집어넣는 행위를 변수 선언 이라고 한다. - 값(데이터) let으로 재할당 가능 (const 재할당 불가) **재할당 용으로 let을 쓰고, 이 외는 const를 사용한다. let a = 2; // let키워드를 통해 변수a를 명시 후 데이터'2'를 집어넣는다. let b = 5; console.log(a+b); // 7 console.log(a-b); // -3 console.log(a*b); // 10 console.log(a/b); // 0.4 a = 5; // .. [JS] 자바스크립트 데이터 종류(자료형) String (문자 데이터) 따옴표 사용 (쌍따옴표, 홑따옴표, 빽틱) let myName = "Evelyn"; // myName이라는 변수에 "Evelyn"이라는 문자 데이터를 할당 한다. let email = 'hj5678@gmail.com'; // 작은 따옴표로 표시된 문자 데이터도 동일하게 할당 한다. let hello = `Helllo ${myName}!!`; // 빽틱 기호로 myName라는 데이터를 보관하겠다는 의미이다. i.e. "Evelyn"이라는 문자가 ${myName}에 들어가는 개념이다. console.log(myName); // Evelyn console.log(email); // hj5678@gmail.com console.log(hello); // Hello Evelyn!! N.. [JS] 자바스크립트 표기법 dash-case(kebab-case) 단어와 단어 사이가 꼬챙이로 끼워져 있는거 같다고 하여 캐밥 케이스 라고도 한다. HTML, CSS (주로 사용) Today-is-Friday-September-14th dash기호로 컴퓨터는 하나의 단어로 인식하게 된고 사람은 띄어쓰기를 대신하는 것을 인지할 수 있다. snake_case 인식하는 단어들이 underbar라는 기호를 통해서 묶인 표기법. HTML, CSS (주로 사용) Today_is_Friday_September_14th camelCase 소문자를 첫 시작으로 단어마다 대문자로 구분하는 표기법. JS (주로 사용) todayIsFridaySeptember14th ParcelCase 대문자로 첫 시작을하여 camelCase와 동일하게 단어마다 대문.. [JS] javascript 자바스크립트 함수 함수(function) 자바스크립트로 만들 수 있는 여러가지 특정 동작/기능들을 실제로 실행할 수 있는 코드의 집합이다. i.e. 명령들을 감싸고 있는 집합을 뜻한다. 그리고 프로그래밍은 거의 함수로 이루어져 있다. function helloEve(){ // 함수 선언할 때는 function 키워드 명시. // 실행 코드 (코드 내용) 그리고 원하는 함수 이름'helloEve' 작성. //(소괄호 1set){중괄호 1set} 기호 사용. => 코드들의 집합 console.log(123); // {중괄호 1set} 사이에 명령 코드를 넣는다. };// i.e. 여기에서는 console창에 log를 남기고, // 그 데이터는 숫자 123 임을 명시하는 것이다. => 코드 내용 // 함수 호출해서 실행 hel.. [Javascript] for loop (for문) 1. for loop 형식 for(let i=0; i [Javascript] if 문 (feat. stitch문, 삼항연산식) 컴퓨터는 if문의 연속이라고 할 정도로 중요하다. 1. if문 형식 if(조건문){ 조건이 충족하면 할일들 } if(true){ console.log("조건은 참 입니다.") } if(false){ console.log("조건은 참 입니다.") }else { console.log("거짓 입니다.") } *여기서 if (false) {A} else {B} 는 "만약에 A가 거짓이라면, B로 프린트 해다오." 라는 뜻이 된다. 예제1) let age = 21 21살 학생이 있습니다. if (age >20){ console.log("운전이 가능합니다.") } else { console.log("운전이 불가능 합니다.") } ➞ Console창 "운전이 가능합니다." 프린트 만약에 나이가 20살이 넘으면 "운전.. [Javascript] 자료형_object 객체 데이터 자세히 보기 1. 객체의 생김새 let patient = { name : "Cathy", age : 17, disease : "cold" } 결과 프린트 console.log(patient) // { name : "Cathy", age : 17, disease : "cold" } console.log(patient.age) // 17 ⓐ 같은 결과 값 도출이나, programing할 때 해당 상황에 따라 필요한 코드로 선택하여 쓴다. console.log(patient["age"] // 17 ⓑ 어떤 값을 접근하는 문법이 두 가지 라고 보면 된다. ⓐⓑ 2. 객체의 특정 정보를 변경할 경우 patient.name = "Catherin" console.log(patient) // { name : "Catherin",.. 이전 1 2 다음