코딩공부중인블로그

01. 1부터 50까지 출력하기 { for(let i=1; i

01. 다음의 출력값을 보고 빈칸을 채우시오! { var x = 100; var y = 200; var z = "javascript"; console.log(__); //출력 값 100이 나오려면 (x)를 넣어줘야합니다. console.log(__); //출력 값 200이 나오려면 (y)를 넣어줘야합니다. console.log(__); //출력 값 300이 나오려면 x와y를 더해줘야합니다.(x+y) //100 //200 //300 } 02. 다음의 출력값을 보고 빈칸을 채우시오! { let x = 100; let y = 200; let z = "javascript"; x = ___; //출력값이 300이 나오기 위해 x를 (300)으로 변경 시켜야 합니다. y = ___; //출력값이 400이 나오기 위..

font-familly 문자의 글꼴을 지정하는 속성입니다. 여러 단어이거나 한글 글꼴인 경우는 (' ')따옴표로 감싸고 여러 개의 글꼴을 (,)쉼표로 구분하여, 지정한 글꼴이 없을 경우 그 다음 글꼴로 지정할 수 있습니다. ex) font-family:'돋움', Dotum, Arial, Helvetica, sans-serif; font-size, 단위의 고찰 문자의 글자 크기를 지정하는 속성입니다. 글자 크기는 명시하지 않을 경우 16px이 기본값입니다. css에서 유용하게 사용하는 단위는 다음과 같은 것들이있습니다. px 해상도에 따라 상대적으로 달라지는 기본 단위입니다. ex) font-size: 12px; % 부모 요소의 글자 크기를 100% 기준으로 계산한 %단위입니다. ex) font-size:..

grid레이아웃 비교적 직관적이어서 다른 레이아웃보다 사전지식이 덜 필요합니다. 우선 만들어야 할 레이아웃을 먼저 스케치 해놓고 만드는것이 가장 편합니다. 일단 레이아웃 결과물을 먼저 가져와서 보여 주었습니다. 처음으로 해야할 것은 박스를 만들기 입니다. 저 그림에는 박스를 7개를 사용한것이 보입니다. 그러므로 "body" 부분에 ""의 부모박스 밑에 7개의 박스를 만들고 각각 id를 주었습니다. 두번째로 "head" 부분에 " 네번째로 부모박스인 "#wrap"에 "gird- template-areas"를 만들어 레이아웃을 테이블 형태로 만들어줘어야합니다. 그리고 가로(grid-template-columns),세로(grid-template-rows) 범위를 정해 주어야하는데 이것은 밑에 이미지와 css를..

flex 레이아웃 요소들이 포함된 부모 박스에 display: flex 를 선언하고, 안에 있는 요소들에게 유연하게 배치하는 속성들을 부여하여 레이아웃을 잡는 것입니다. 다음 display: flex가 들어간 코딩으로 간단한 레이아웃을 만들어 보았습니다. 속성 flex flex는 세개의 요소 가 섞여 있습니다. flex-grow 자식 요소가 적거나 그 크기가 작아 공간이 남을 때 항목의 크기를 늘려 채워 주는 방법을 정의 합니다. 0 (기본값) 1 항목들이 모두 1이면 같은 크기임 양수 값을 높게 줄수록 더 늘어남 공간이 부족할 때는 어떤 값도 무의미 flex-shrink 자식 요소가 많거나 그 크기가 커서 공간이 부족할때 항목의 크기를 줄여 채워주는 방법을 정의 합니다. 0 공간이 부족해도 항목의 크기..

※문제1 사용자가 프롬프트 창에 숫자를 입력했을 때 그 숫자를 함수로 넘겨주고, 함수에서 숫자가 양수인지, 음수인지, 도는 0인지 판단해서 알림 창에 보여주는 프로그램을 작성 하시오. 길라잡이 ·숫자를 받아서 양수, 음수 0을 판단 하고 알림 창에 표시하는 함수를 선언 합니다. ·parseInt( ) 함수를 사용해 프롬프트 창에 입력한 내용을숫자로 변환 합니다. ·(프롬프트 창에 입력한 내용이 숫자가 아니면 parseInt( ) 함수sms NaN을 반환합니다.) ·반환값이 숫자일 경우에만 함수를 실행합니다. function func (num){ //3. if(num>=1){ //4. document.write("양수입니다."); } else if(num num ? sum : num; //삼항연산자 표현 ..

제어문 제어문이란 프로그램에서 필요한 결과 값을 도출 하기 위해 실행문의 순서를 제어 하거나 반복 시키는 문장을 말합니다. 조건문 if,switch 반복문 while.do while, for 중지,건너뛰기 break, continue 조건문 1.if문 조건이 참(True)인 경우에만 실행 합니다. 만약 조건이 거짓(False)이라면 else가 실행됩니다. if(""){ document.write("실행 되었습니다.(true)") }else { document.write("실행되었습니다.(false)"); } // 조건식 flase: 0, null, undefined ,flase, ""(빈문자열) // 조건식 true: 1, 2, "0", "1", "ABC", [], {}, true, ... //결과 실행..

함수 함수는 프로그램에서 반복적으로 사용되는 기능을 만들어 내기 위한 코드들의 집합으로 이해하시면 됩니다. 분류 종류 설명 사용자 정의 함수 ·선언적 함수 ·익명 함수 프로그램에서 필요한 기능을 사용자가 직접 정의해서 사용하는 함수입니다. 내장 함수 ·인코딩,디코딩 함수 ·숫자 판별 함수 ·유·무한 값 판별 함수 ·숫자 변환 함수 ·문자 변환 함수 ·자바스크립트 코드 함수 프로그램 개발에서 자주 사용되는 기능들을 자바스크립트 내부적으로 제공해 주는 함수입니다. 선언적 함수 '선언적 함수'는 함수를 호출할 때 함수의 앞 또는 뒤에서 호출 가능합니다. function func(){ document.write("선언적 함수"); } func(); func(); function func(){ document.w..

데이터 저장과 표현 방법 데이터를 저장에는 변수,상수,배열,객체가 있고 여러 표현방법이 있습니다. 변수 데이터를 저장, 변경, 추가 가 가능합니다 ※데이터 저장 ※데이터 변경 let을 이용해서 데이터를 변경하여 저장할수 있습니다. ※데이터 추가 let을 이용해 데이터를 연산 하여 저장값을 변경이나 추가가 가능합니다. 상수 const(상수)는 데이터 저장은 가능하나 변경은 불가능 합니다. 변경을 할려하면 에러가 뜹니다. 배열 배열은 여러개의 데이터를 배열한 순서대로 저장할 수 있습니다. 표현방법은 4가지가 있습니다. 배열의 데이터를 불러올때는 [ ]안에 불러오고 싶은 데이터의 배열 순서를 넣어야 합니다. ※배열 표현방법(2) "arr[ ]"를 없애고 "( )" 안에 넣어서 간략하게 하였습니다. ※배열 표현..

선택자(selector) ·선택자란 CSS로 UI 의 어느 부분을 디자인할지, 즉 표현할 대상이 되는 부분을 말합니다. ·선택자의 종류는 type선택자, id선택자, class선택자, 전체선택자, 하위선택자, 자식선택자, 인접선택자, 형제선택자, 그룹 선택자, 속성 선택자 ,가상 클래스 선택자 ,가상 요소 선택자, 종속 선택자 , 선택자의 우선순위 가있습니다. ·CSS로 속성을 부여하는 형식은 다음과 같습니다. type선택자 선택자중 가장 간단한 선택자입니다. html문서의 태그 이름을 선택자로 사용할 수 있습니다. id선택자 ※html 문서의 요소 중 같은 요소라도 각기 다른 이름을 지정하여 따로 속성을 부여할 수 있습니다. ※html 요소에id로 이름을 붙일 때에는 유일한 이름을 부여해야 하며, 다른..