필요없는 목록/JAVASCRIPT 30

패럴렉스 효과 3 / 7

완성된 화면 HTML 삽입 미리보기할 수 없는 소스 이번에 배운 패럴렉스는 메뉴를 클릭하면 해당 브라우저의 scroll의 위치로 이동을 하는 것을 배웠습니다. HTML+CSS코드 Javascript Parallax Effect01 패럴랙스 이팩트 : 사이드 메뉴 1 2 3 4 5 6 7 메뉴1 메뉴2 메뉴3 메뉴4 메뉴5 메뉴6 메뉴7 메뉴8 메뉴9 01 Section1 성공은 준비된 기회와 만나는 것이다. 훌륭한 기회가 없다면, 자신의 능력을 끌어내는 기회를 만들어야 한다. 01 Section1 자신을 믿고 당당하게 꿈을 향해 나아가라. 당신이 믿는다면, 누구나 당신을 믿게 될 것이다. 03 Section3 가장 큰 위험은 위험을 감수하지 않는 것이다. 더 나은 미래를 향해 나아가려면 불확실성과 위험을..

간단한 게임 만들기 - 음악리스트 (3 / 5)

게임 메인 화면 만들기2 주소 https://skadldldl123.tistory.com/94 간단한 게임 만들기 음악 리스트 페이지 꾸며보기 2 / 5 최종 완성된 모습 HTML 삽입 미리보기할 수 없는 소스 저번에 만들었던 메인페이지 제작을 완료 한 뒤에 음악 리스트 페이지를 만들었습니다. 음악리스트 넣은 모습 JAVASCRIPT코드 const musicWrap = docu skadldldl123.tistory.com 메인화면 만들기 3번은 게임 메인화면 만들기 2번에서 만들었던 재생목록 창에다가 효과를 넣어주는 것을 해봤어요. 재생 목록, 반복 듣기, 1번만 듣기, 자동 재생 HTML코드 뮤직 리스트 코드 설명 재생 목록, 반복 듣기, 1번만 듣기, 자동 재생 JAVASCRIPT코드 const mu..

마우스 효과 4 / 5

최종 완성된 모습 HTML 삽입 미리보기할 수 없는 소스 저번에 배웠던 마우스 효과입니다. 이번거는 마우스가 특정 영역에서만 작동되게 만들었습니다. HTML+CSS코드 Javascript Mouse Effect01 마우스 이펙트 - 마우스 따라다니기 1 2 3 4 5 Do not seek fancy things. What matters is your talent and the amount of love you pour into your actions. 화려한 일을 추구하지 말라. 중요한 것은 스스로의 재능이며, 자신의 행동에 쏟아 붓는 사랑의 정도이다. mailto:skadldldl123@gmail.com 코드 설명 1. div태그 중 .mouse__wrap은 "마우스를 따라다니는 div태그 2개와" /..

문자열 객체 10개를 정리해봐요~^~^~

1.at() at() 메서드는 정수 값을 받아, 배열에서 해당 값에 해당하는 인덱스의 요소를 반환합니다. 양수와 음수 모두 지정할 수 있고, 음수 값의 경우 배열의 뒤에서부터 인덱스를 셉니다. at() 메서드의 존재가 대괄호 표기법을 부정하는 것은 아닙니다. 예를 들어 array[0]은 문제 없이 배열의 첫 요소를 반환합니다. 그러나 맨 마지막 요소를 가져오고 싶을 때 length 속성을 사용해 array[array.length - 1]을 하는 대신, 짧게 array.at(-1)을 사용할 수 있습니다. 배열에서 반환할 요소의 인덱스(위치). 음수 값을 지정할 경우 배열의 마지막을 기준으로 한 인덱스입니다. 즉, 배열 앞 대신 끝에서부터 위치를 계산합니다. 주어진 인덱스에 위치한 배열 요소. 주어진 인덱스..

SQL 오답노트 정리(2023.04.21 금)

1.SQL문의 빈칸을 완성하시오. [학생] 테이블에서 전화번호가 NULL 값이 아닌 학생명을 모두 검색하기 위한 SQL문의 작성하시오. SELECT 학생명 FROM 학생 WHERE 전화번호 _____; 답: IS NOT NULL 2.SQL문의 빈칸을 완성하시오. 사용자 "HWANG"에게 테이블을 생성할 수 있는 권한을 부여하기 위한 SQL문을 작성하시오. _____ CREATE TABLE _____ HWANG 답: GRANT, TO 3.SQL문의 빈칸을 완성하시오. [성적] 테이블에서 점수가 90점 이상 95점 이하인 '컴퓨터공학과' 학생의 정보를 검색한 SQL문을 작성하시오. SELECT * FROM 성적 WHERE (점수 _____ 90 _____ 95) AND 학과 = '컴퓨터공학과'; 답: BET..

금요일 또 오답노트(2023.04.21)

오늘도 시험을 보고 많이 틀렸네요.(불합격) 1.다음의 결괏값을 작성하시오 let i = 0; let sum = 0; while(i < 10){ i = i+1; if( i % 3 == 0) sum -= i; if( i % 3 == 1) sum += i; if( i % 3 == 2) sum *= i } console.log(sum) 답: 129 2.다음의 결괏값을 작성하시오 let num = [10, 20, 30, 40, 50]; let i, max, min; max = min = num[0]; for(i=0; i max) max = num[i]; if(num[i] < min) min = num[i]; } console.log(max, min); 답: 50, 10 3.다음의 결괏값을 작성하시오. funct..

웹디자인기능사 필기 오답 노트(2014년 7월)

오답 정리 1. 다음 중 디자인의 조건에 해당하지 않는 것은? ④ ① 합목적성 ② 심미성 ③ 경제성 ④ 유통성 2. 물리적인 빛이 우리의 눈에서 색채로 지각되어 범위의 파장 한계 내에 있는 스펙트럼을 의미하는 것은? ① ① 가시광선 ② 색청 ③ 색각 ④ 지각색 11. 색의 3속성에 포함되지 않는 것은? ③ ① 색상 ② 명도 ③ 대비 ④ 채도 12. 촉각적 질감에 대한 설명으로 틀린 것은? ① ① 촉각적 질감에는 장식적 질감, 자연적 질감, 기계적 질감 이 있다. ② 촉각적 질감은 눈으로 볼 수 있을 뿐 아니라 손으로 만 져서 느낄 수 있는 질감이다. ③ 촉각적 질감은 2차원 디자인의 표면과 함께 3차원의 양 각(relief)으로 확대하는 것이다. ④ 촉각적 질감의 연출방법에는 자연재료사용, 재료변형, 재..

웹디자인기능사 필기 오답 노트(2016년 7월)

오답 정리 1. 다음 중 디자인의 기본 요소들로 옳은 것은? ② ① 선, 색채, 공간, 수량 ② 점, 선, 면, 질감 ③ 시간, 수량, 구조, 공간 ④ 면, 구조, 공간, 수량 12. 다음 중 게슈탈트의 시각에 관한 법칙으로 볼 수 없는 것은? ④ ① 근접의 원리 ② 유사의 원리 ③ 연속의 원리 ④ 통일의 원리 13. 다음 디자인 형태 중에서 다른 성격을 지닌 것은 어느 것인가? ③ ① 추상적 형태 ② 기하학적 형태 ③ 유기적 형태 ④ 기능적 형태 17. 먼저 본 색의 영향으로 나중에 보는 색 이 다르게 보이는 현상은? ④ ① 동시대비 ② 면적대비 ③ 연변대비 ④ 계시대비 20. 오스트발트(Ostwald) 색상환은 무채색 축을 중심으로 몇 색 상이 배열되어 있는가? ④ ① 9 ② 10 ③ 11 ④ 24 ..

웹디자인기능사 필기 오답 노트(2015년 7월, 2013년 10월)

2015년 7월 오답노트 1. 색의 3속성 중 사람의 눈이 가장 예민하고 강하게 반응하는 대비는? ① ①명도대비 ②색상대비 ③보색대비 ④채도대비 2.색의 주목성에 대한 설명으로 옳지 않은 것은? ④ ①명시도가 높으면 색의 주목성이 높다 ②채도 차이가 클수록 주목성이 높다 ③빨강은 초록보다 주목성이 높다 ④명도채와 채도가 낮은 색이 주목성이 높다 3. 디자인의 원리 중 비례에 대한 설명이 잘못된 것은? ① ①균형을 가장 많이 고려하여 구성해야 한다. ②부분과 부분, 부분과 전체에 균형이 잡혀있음을 말한다. ③조형을 구성하는 모든 단위의 크기를 결정한다. ④객관적 질서와 과학적 근거를 명확하게 드러내는 구성 형식이다. 4. 색의 감정에서 저채도의 배색이 주는 느낌은? ① ①부드러운 느낌 ②명쾌한 느낌 ③화려..

자바스크립트 오답노트(왜 자꾸 틀릴까?? 몰르겠다..)

틀린 것 : 4, 7, 10, 14, 15, 16 1번. 다음의 결괏값을 작성하시오. let num = 0; while(false){ num++; if(num == 3){ continue; } if(num > 10){ break; } } console.log(num); 답 : 0 설명 : while문은 true일때 조건을 반복합니다. false일떄는 while문을 벗어납니다. 2번. 다음의 결괏값을 작성하시오. let a=6, b=9, c=3, result; result = ++a + b++ + ++c; console.log(result); console.log(a+b+c); 답 : 20, 21 설명 : 선연산자와 후연산자 입니다. 선연산자는 먼저 값이 적용되지만 후연산자는 1번 더 호출이 되어야 적용됩..

문자열에 접근하는 함수 정리하기

1.원시 유형과 객체 원시 유형이어도 프로퍼티와 메서드를 사용할 수 있습니다. 문자열로 예를 들겠습니다. let str = "hello" str.length; //5 자바스크립트에서 number와 boolean, string 유형은 별도로 프로토타입 객체가 만들어져 있습니다. Number 객체, 문자열은 String 객체라는 식으로 만들어졌는데 이런 객체를 "래퍼 객체"라고 부릅니다. 2.문자열의 길이 : length 프로퍼티 ● 문자열.length 문자열의 길이를 찾을 때는 배열에서처럼 length프로퍼티를 사용합니다. let str = "Good morning!"; let greeting = "안녕하세요?"; str.length; //14 greeting.length; //6 3.문자열에서 문자의 위..

3월 24일 금요일 쪽지시험 오답노트

3월 24일 틀린 것 1번, 6번, 7번 ,11번, 13번, 14번, 15번, 17번 시험 내용 1. 결괏값을 작성하시오 const str = "javascript"; const text = str.indexOf("a"); const text2 = str.lastIndexOf("a"); const text3 = str.includes("a"); console.log(text); console.log(text2); console.log(text3); 답 : 1, 3, true 2. 다음의 결괏값을 보고 빈칸을 채우시오. function func(){ document.write("함수2가 실행되었습니다."); } function callback(str){ document.write("함수1가 실행되었습니다...

3월 17일 금요일 쪽지시험 오답노트(틀린 것 : 3번, 6번, 7번, 14번)

01. 결괏값을 작성하시오. (function(){ console.log("함수가 실행되었습니다."); })(); 답 : 함수가 실행되었습니다. 설명 : 즉시 실행 함수입니다. 제일 처음에 인터넷 로딩시에 시작이 됩니다. 02.결괏값을 작성하시오. function func(str = "함수가 실행되었습니다."){ document.write(str); } func(); 답 : 함수가 실행되었습니다. 설명 : ES10에서 도입한 파라미터 함수입니다. 자바스크립트도 매개변수에 직접 데이터를 할당 할 수가 있습니다. 03.결괏값을 작성하시오 let sum = 0; for(var i=1; i num2) return num1 else return num2 } console.log(func(10, 23) + func..

여태까지 배운 것들 중 부족한 것들 올리기

1.객체 : 데이터 불러오기 : hasOwnProperty() 객체에 상속되지 않은 속성 이름인 경우 true를 반환합니다. 이 메서드는 객체가 특정 프로퍼티를 갖고 있는지 확인할 때 사용됩니다. const obj = { a: 100, b: 200, c: "javascript" }; // 데이터가 있으면 true / 없으면 false console.log(obj.hasOwnProperty("a")); console.log(obj.hasOwnProperty("b")); console.log(obj.hasOwnProperty("c")); console.log(obj.hasOwnProperty("d")); console.log("a" in obj); console.log("b" in obj); console...

3월10일 금요일 시험 오답노트 정리(틀린 것 : 2번, 4번, 5번, 6번, 12번)

1. 결괏값을 작성하시오 if( null ){ console.log("true"); } else { console.log("false"); } 정답 : false 설명 : false문은 0, null, undefined, "", false가 있습니다. 2. 결괏값을 작성하시오 let num = 0; while( num 6 ){ break; } console.log(num); } 정답 : 1, 2, 4, 5, 6 설명 : num이 3가 똑같다면 멈췄다가 시작합니다.(3 제외) num이 6과 비교할때 크다면 멈춥니다. 7. 결괏값을 작성하시오 for(let i=1; i { const str = "함수가 실행되었습니다."; return str; } console.log(func()); 정답 : 함수가 실행되었..

비트 연산자에 대해 알아봅시다.(AND, OR, Not, XOR, LEFT SHIFT, RIGHT SHIFT)

비트연산자 설명 비트 연산자는 컴퓨터 프로그래밍에서 비트(bit) 단위로 데이터를 다루는 연산자입니다. 비트 연산자는 이진수(bit)를 다룰 때 사용됩니다. 비트 AND 연산 (&): 두 비트가 모두 1일 경우에만 결과값이 1이 되는 연산입니다. 예를 들어, 1010과 1100을 AND 연산하면 1000이 됩니다. 비트 OR 연산 (|): 두 비트 중에 하나라도 1일 경우 결과값이 1이 되는 연산입니다. 예를 들어, 1010과 1100을 OR 연산하면 1110이 됩니다. 비트 XOR 연산 (^): 두 비트 중에 하나만 1일 경우 결과값이 1이 되는 연산입니다. 예를 들어, 1010과 1100을 XOR 연산하면 0110이 됩니다. 비트 NOT 연산 (~): 비트를 반대로 뒤집는 연산입니다. 0은 1로, 1..

데이터 불러오기 정리(학원에서 알려준거 정리)

01. 변수 : 데이터 불러오기 변수 x, y, z를 선언하고 데이터를 저장함 let x = 100, y = 200, z = "javascript"; //저장된 데이터를 호출 함. console.log(x, y, z); 정답 : 100, 200, javascript 02. 상수 : 데이터 불러오기 //변수 x, y, z를 선언하고 데이터를 저장함 const x = 100, y = 200, z = "javascript"; //저장된 데이터를 호출 함. console.log(x, y, z); 정답: 100, 200, javascript 03. 배열 : 데이터 불러오기 //[] : 배열을 생성 후 안에 데이터를 저장함. const arr = [100, 200, "javascript"]; //배열에 저장된 데이..

for문으로 table태그를 3의 배수를 출력하고 5의 배수만 color 입히기

1.for문으로 table 실행 시키고 그중 5의 배수는 "빨간색"으로 출력하기 학원에서 table 태그를 배웠습니다. 그리고 학원에서 활용을 하라고 숙제를 내주었습니다. 알려준 table태그에 3의 배수만 출력하고. 5의 배수는 color를 입히라는 숙제였습니다. 여태까지 학원에서 알려준 짝수, 홀수 출력을 합쳐서 만들어봤습니다. HTML 삽입 미리보기할 수 없는 소스 코드설명 1.table 태그를 변수에 할당 합니다. 2.그리고 number을 선언합니다.(이값은 나중에 3의 배수를 저장할 값) 3.for 중첩문으로 10x10으로 반복하게 합니다. 4.그리고 number은 +3씩 더해서 3의 배수가 출력되게 해줍니다. 5.if문을 통해서 5로 나누고. 나머지가 0이면 5의 배수이니간 "color: re..

3월3일(금) 시험 본 것들 정리(틀린 것:5번, 8번, 12번, 20번)

1. 빈칸을 채우십시오. var x = 100; var y = 200; var z = "javascript"; console.log(채우시오); console.log(채우시오); console.log(채우시오); 정답 : 100, 200, javascript 2. 빈칸을 채우십시오. let x = 100; let y = 200; let z = "javascript"; x = (채우시오) y = (채우시오) z = (채우시오) console.log(x); // 300 console.log(y); // 400 console.log(z); // jquery 정답 : x+y, y+200, jquery 3. 빈칸을 채우십시오. let x = 100; let y = 200; let z = "javascript"; ..

조건문을 다시 정리해보자.(if문, 삼항연산자, switch문, while문, for문, break문, continue문)

조건문 사용하는 이유!!! 코딩을 하다보면 무조건 코드를 실행 시키는 것이 아니라 특정 조건을 걸고 그 조건에서 실행을 해야하는 경우가 많습니다. 이때 조건문을 사용하면 내가 원하는 조건이나 타이밍에 코드를 실행 시킬 수 있습니다. 프로그램의 유연성 향상: 조건문을 사용하면 프로그램이 다양한 조건에 대해 반응할 수 있습니다. 이를 통해 프로그램의 유연성이 향상되고 더 많은 상황에서 사용할 수 있습니다. 효율적인 문제 해결: 조건문을 사용하여 프로그램은 특정 조건에 따라 다른 작업을 수행할 수 있습니다. 이를 통해 특정 문제에 대한 효율적인 해결 방법을 제공할 수 있습니다. 코드의 가독성 향상: 조건문은 코드의 가독성을 높일 수 있습니다. 조건문을 사용하면 프로그램의 흐름이 명확해지며, 다른 사람이 코드를..

변수, 객체, 조건문을 활용한 예제(2)

1. 사용자에게 입력 받은 것들을 숫자면 양수, 마이너스면 음수, 글씨는 문자열로 출력하기 수업시간에 배운 변수, 상수, 조건문, 함수를 사용하여 만들었습니다. 처음에는 힌트로 prompt를 사용하라는 말을 듣고 당황했습니다. 어떻게 양수, 음수, 문자열을 비교할까?? 20분 정도 고민해보니간.... 0보다 작으면 음수고. 0보다 크면 양수잖아??? 라고 생각이 갑자기 들어서 조건문을 걸어서 실행해보니 출력이 되었습니다. //사용자로부터 값을 입력 받습니다. let user = prompt("숫자를 입력하세요"); //입력 받은 값을 정수로 변환합니다. let number = parseInt(user); //if문의 조건이 만족되면 매개변수로 값을 받고 반환 중입니다. function func(a) { ..

함수의 종류(선언적 함수, 익명 함수, 매개변수 함수, 리턴값 함수, 화살표 함수)에 대해 알아보자.

1.함수 사용 방법 function 함수명() { 코드 } 함수 선언시에 function이라는 예약어를 사용합니다. 함수 이름을 적습니다. 중괄호 안에 실행할 여러개의 명령어를 묶습니다. 함수를 사용하는 이유 자바스크립트 프로그램은 단순히 하나의 동작만 하는게 아니라 여러가지 동작이 연결되어 실행이 됩니다. 동작해야 할 목적대로 여러개의 명령을 묶는 것을 "함수"라고 합니다. 소스를 함수로 분리 넣으면 필요할 때마다 원하는 기능만 따로 실행할 수도 있고. 같은 기능이 필요한 다른 곳에서 다시 사용할 수도 있습니다. 2.선언적 함수 선언적 함수(declarative function)는 함수를 선언할 때 함수 이름과 함께 function 키워드를사용하여 함수를 선언하는 방법입니다. 예를 들어, 다음은 add..

변수, 상수, 배열, 객체 배웠던 것들 정리하기.

1.변수 : 데이터 저장(옛날 방식) 옛날 방식인 var는 변수, 상수가 동시에 가능한 타입 입니다. 변수는 데이터를 저장하는 저장소 입니다. x,y,z에 데이터를 저장하고 console.log()로 호출 중입니다. var x = 100; //변수 X에 숫자 100을 저장함 var y = 200; //변수 y에 숫자 200을 저장함 var z = "javascript" //변수 z에 문자 "Javascript"를 저장함 console.log(x); // 100 출력 console.log(y); // 200 출력 console.log(z); // javascript 출력 var는 변수, 상수가 동시에 가능하기 때문에 최근에는 사용을 안하고 있습니다.(쓰는거는 가능함) 최근부터는 let(변수), const(..

자바스크립트에서 배웠던 것들 이용한 2가지의 예제입니다.

1. 10보다 큰 숫자 찾기 입니다. let arr = [1,3,5,7,9,11,13,15,17,19]; // 배열 안에 주어진 값을 저장합니다. // for문으로 배열의 길이만큼 배열의 인덱스 번호에 접근하여 자료를 호출 합니다. for(let i=0; i 10) { //저장된 값 중 10보다 큰수만 출력 됨. document.write(arr[i]); // 결과값 : 11, 13, 15, 17, 19 } } 결과값 : 11, 13, 15, 17, 19 해결 방법 배열안에 주어진 숫자를 입력합니다. for문을 통해 배열 안에 있는 자료를 하나하나 가져 옵니다. if문을 통해서 가져온 자료를 10과 비교해서 10보다 큰 숫자만 출력하게 합니다. 2. 사용자로부터 1이상 높은 값을 입력 받고 짝수만 출력하..

조건문(if, else if, if중첩, 삼항연산자)에 대해 간략하게 알아봅시다.

이미지 출처 if문 코딩을 하다보면 어떤 경우에는 실행을 하게하고. 어떤 경우에는 실행을 안하게 하고 싶을때가 많습니다. 이때 쓰이는게 조건문 입니다. 그 중 가장 많이 사용하는 if문 입니다. 사용방법 if(조건) { 코드 } else { 코드 } if문의 조건문이 참(true)라면 if문이 실행이 되고. if문의 조건문이 거짓(false)라면 else문이 실행이 됩니다. const number = 100; if(number === 50) { console.log("number은 50가 똑같습니다.(true)"); } else { console.log("number은 50가 똑같지 않습니다.(false)"); } 결과 : number은 50가 똑같지 않습니다.(false) 중첩 if문 중첩 if문은 조..

for문의 종류에 대해 알아봅시다.

반복문을 하기 전에 변수에 대해 알아보자 자바스크립트에는 let(변수)와 const(상수)가 있습니다. var란 변수도 있지만 사용시 변수와 상수가 둘다 가능하기 때문에 let(변수)와 const(상수)를 사용하는 것이 효율적입니다. for문 자바스크립트에서 가장 많이 사용하는 반복문은 for문 입니다. for문은 조건에 들어가는 값이 일정하게 커지면서 명령을 반복 실행할 때 편리하죠. for문에서는 몇번 반복했는지 기록하기 위해 카운터를 사용하고 for문의 첫번쨰 항에서 카운터 변수를 지정합니다. 사용방법 : for(초깃값; 조건; 증가식) { 코드 } 초깃값 : 몇번 반복할지 지정하기 위해 카운터 변수를 사용합니다.이 항목에서 카운터 변수를 선언ㅇ하고 초기화 합니다. 초깃값은 0이나 1부터 시작합니다..

JAVASCRIPT에서 사용되는 연산자에 대해 알아봅시다.

산술 연산자의 종류 1. + : 더하기 연산을 할 때 사용합니다. let number = 10 + 20; console.log(number); // 30 출력 2. - : 빼기 연산을 할 때 사용합니다. let number = 30 - 15; console.log(number); //15 출력 3. * : 곱하기 연산을 할 때 사용합니다. let number = 20 * 30; console.log(number); //60 출력 4. / : 몫을 구 할 때 사용합니다. 나눗셈이라고 보시면 됩니다. 두수를 나누어서 몫에 해당하는 값을 반환하는 연산자 입니다. let number = 10 / 5; console.log(number); // 몫인 2가 출력 5. % : 나머지를 구할 때 사용합니다. %연산자는..

자료형에 대해 알아보자.(컴퓨터가 세상을 보는 방법)

변수부터 익혀보자 변수란 "프로그램에서 사용하기 위해 값을 담아 놓는 바구니"라고 생각하면 쉽습니다. 변수 이름 지정하기 1.변수 이름은 숫자로 시작할 수 없고. 이름 안에 공백이 포함되어 있으면 안됩니다. 2.앞에 숫자가 오면 안됩니다.(ex: 25name) 3.글씨 중간에 띄어쓰기를 사용하면 안됩니다.(ex: na me) 4.특수문자(*, ? 등)은 인코딩할 떄 문제가 발생할 수 있으므로 사용하지 않는 것을 권장합니다.(ex: name*) 5.무의미한 변수 이름은 피합니다. 변수 선언하기 자바스크립트에는 값을 변경할 수 있는 "변수(let)"와 값이 바뀌지 않는 "상수(const)"가 있습니다. 사용할 변수를 선언하고 나면 "=" 기호를 사용해서 변수에 값을 저장할 수 있는데. 이것을 "변수에 값을 ..