오쌤의 니가스터디 (38) 썸네일형 리스트형 [JS강좌] 9강 자바스크립트 객체와 생성자함수 - 오쌤의 니가스터디 ** 동영상으로 공부하고 싶은 분은 아래 주소를 클릭해 주세요. https://www.youtube.com/watch?v=k0HterZEszY 1. 객체의 종류 - 객체는 자바스크립트가 명령가능한 모든 대상을 의미합니다. 1) 객체의 큰 부분 종류 설명 기본내장객체 기본적인 객체들로 보통 컴퓨터 언어들은 갖고 있는 객체 BOM(Browser Object Model) 브라우저오브젝트 모델, 브라우저 관련 객체 DOM(Document Object Model) 문서객체모델, 태그나 컨텐츠 등을 의미하는 객체 사용자정의객체 개발자가 직접적으로 생성하는 새로운 객체 2) 기본내장객체 종류 설명 String 문자열 객체 Number 숫자 객체 Math 수학 객체 Array 배열 객체 Date 날짜시간객체 - 기본내.. [JS강좌] 8강 자바스크립트 내장함수 - 오쌤의 니가스터디 ** 영상으로 보고 싶은 분은 아래 주소를 클릭하세요! https://www.youtube.com/watch?v=gfFCPE0E9qM 1. 기본내장함수 - 내장함수라는 것은 자바스크립트가 함수선언을 미리 해놔서 호출만해서 사용하는 함수를 말합니다. - 다른 차원에서는 window의 메서드로 보기도 하는데 메서드란 객체와 함께 사용되므로 저는 아래에서 배울 것들은 내장함수라고 보도록 하겠습니다. 1) alert() ## 문법 alert(값); - 매개변수로 지정된 값을 경고창에 띄워주는 함수입니다. - 확인 버튼을 누르면 창을 닫힙니다. ## 예시코드 ## 코드 결과 2) confirm() ## 문법 confirm(값); - confirm함수는 매개변수에 작성된 값을 창에 띄워줍니다. - 확인버튼을 누르면.. [JS강좌] 7강 자바스크립트 함수 - 오쌤의 니가스터디 ** 영상으로 보고 싶은 분은 아래 주소를 클릭하세요! https://www.youtube.com/watch?v=gfFCPE0E9qM 1. 함수 - 함수는 코드의 집합입니다. 특정 작업을 수행하도록 설계된 코드블록{ }입니다. f(x); - 수학적 함수 기호입니다. x값이 변함에 따라 결과값이 바뀌는 것을 함수라고 한다고 수학시간에 배웠습니다. - 기능은 f인 해당 함수가 하고 x인 매개변수의 값에 따라 결과값이 바뀌는 것, 그것을 함수라고 합니다. 1) 선언적 함수 문법 - 선언적 함수라는 것은 함수를 선언하는 부분과 호출하는 부분을 나눠서 작업하는 것을 의미합니다. ## 함수의 선언 문법1 - 함수타입 function 함수명(매개변수1, ...){ //코드의 집합 } ## 함수의 선언 문법1 - 변수.. [JS강좌] 6강 자바스크립트 반복문 - 배열과 for in문 - 오쌤의 니가스터디 ** 영상으로 보고 싶은 분은 아래 주소를 클릭하세요! https://www.youtube.com/watch?v=hWQSIXNVfKY 1. 배열 - 배열이란 여러 값을 나열해서 단일변수에 담아주는 것입니다. 1) 배열의 선언 var 배열명 = [값1, 값2, 값3, ...]; - 위에서는 배열명이라고 적었지만 결국 변수입니다. - 값을 여러 개를 담을 수 있는 특수 변수라고 생각하면 될것 같습니다. var 배열명 = [ 값1, 값2, 값3 ]; - 값이 길게 표현되는 경우에는 두번째처럼 작성하면 좋습니다. - 보통 배열값에 배열이나 객체를 또 적는 경우가 그렇습니다. var 배열명 = new Array(값1, 값2, 값3, ...); - 위와 같이 new키워드를 사용해서 객체를 새로 선언할 수도 있습니다.. [JS강좌] 5강 자바스크립트 반복문 - 오쌤의 니가스터디 ** 영상으로 보고 싶은 분은 아래 주소를 클릭하세요! https://www.youtube.com/watch?v=Aeor0HbprPU 1. while문과 do while문 1) 반복문이란? - 조건식이 맞으면 코드블록{ } 내부의 코드를 계속 실행하는 구문을 의미합니다. - 컴퓨터가 제일 잘하는 것이 반복인데, 반복적인 것을 코드를 잔뜩 써서 처리하면 비효율적이겠죠? 그래서 반복문을 사용합니다. ## 코드 alert('반복1'); alert('반복2'); alert('반복3'); alert('반복4'); alert('반복5'); alert('반복6'); alert('반복7'); alert('반복8'); alert('반복9'); alert('반복10'); - 위와 같은 코드를 계속 반복한다는 것은 매우 비.. [JS강좌] 4강 자바스크립트 조건문 switch, 삼항연산자, 짧은 조건문 - 오쌤의 니가스터디 ** 영상으로 보고 싶다면 아래 주소를 클릭하세요. https://www.youtube.com/watch?v=hPqQ9LHhAaE 1. switch문 - 조건 경우에 따라 명령을 각각 지정하는 구문입니다. ## 문법 switch(표현식){ case x: //x인 경우 실행할 코드 break; case y: //y인 경우 실행할 코드 break; default: //x도 y도 아닌 기본적으로 실행할 코드 break; } - case는 경우들을 구분하는 키워드입니다. - break는 현재 경우를 벗어나라는 키워드입니다. - default는 기본 경우값이라는 키워드입니다. ## 문제 문제) getDay()라는 메서드를 사용하면 요일을 0~6사이의 숫자로 반환합니다. 오늘의 요일을 경고창에 영문으로 반환해주세요.. [CSS3강좌] 30강 select태그 아이콘 변경 - 오쌤의 니가스터디 1. select 태그란? -여러 옵션 중 한 개의 값을 선택하는 상자 ## 코드 옵션1 옵션2 옵션3 ## 결과 - 옵션1 옆에 아이콘(아래 방향)이 존재합니다. ## 익스플로러/엣지(edge) 2. select CSS초기화 - 브라우저 별로 다르기도 하고 기본적으로 예쁘지 않기 때문에 없애는 경우가 많이 있습니다. ## 문법 select{ appearance: none; -webkit-appearance: none; /* 사파리, 크롬 하위버전용 */ -moz-appearance: none; /* 사파리, 크롬 하위버전용 */ } select::-ms-expand{ display: none; } /* 익스플로러용 */ - 익스플로러는 위와 같이 따로 작성해줘야 가능합니다. ## 코드 옵션1 옵션2 옵.. [CSS3강좌] 29강 이미지를 위한 object-fit속성 - 오쌤의 니가스터디 ** 동영상으로 보고 싶은 분은 아래 주소를 클릭해주세요. https://www.youtube.com/watch?v=8hsCUwZJjw4 1. object-fit속성이란? - 요소의 크기에 맞게 태그와 태그의 크기를 조정하는 방법으로 사용되는 속성입니다. 1) object-fit속성값 속성값 설명 fill 기본값, 요소에 크기에 맞게 꽉채워 보여줌, 필요한 경우 오브젝트가 늘어나거나 찌그러집니다. contain 요소의 가로나 세로크기에 가능한 딱 맞춰져 크기가 조정되고, 비율은 고정된 상태입니다. 딱 맞추기 때문에 남는 공간이 발생할 수 있습니다. cover 요소의 가로나 세로크기에 가능한 맞춰져 크기가 조정되고, 비율은 고정된 상태입니다. 개체 크기에 맞게 잘립니다. 가득 채울때까지 확대됩니다. non.. 이전 1 2 3 4 5 다음
