Jin

문자열 메서드 자바스크립트 문자열 메서드를 이용하면 다양한 문자열 조작 작업을 간단하게 수행할 수 있습니다. 예를 들어, 문자열을 검색하거나, 일부 문자열을 추출하거나, 문자열을 대/소문자로 변경하거나, 문자열을 분리하거나, 문자열을 변환하거나 등의 작업을 수행할 수 있습니다. 또한, 문자열 메서드를 사용하여 문자열의 형식을 지정하거나, 문자열을 다른 데이터 유형으로 변환하는 것도 가능합니다. 이는 다양한 작업에서 매우 유용합니다. 또한, 자바스크립트는 문자열 메서드뿐만 아니라 정규 표현식(regular expression)도 지원합니다. 이를 사용하여 더욱 복잡한 문자열 작업을 수행할 수 있습니다. at() 메서드 메서드는 지정한 숫자(index)를 받아, 문자열에서 해당 되는 인덱스의 요소를 반환합니..

문제 풀이 사이트를 cbt 형식으로 만들어 보았습니다. 제출하기 버튼을 클릭하면 채점하고 문제를 풀기 시작하면 시간이 카운팅 되는 기능은 다음시간에 넣을 예정입니다. Quiz 객관식 CBT 유형 1 2 3 4 5 5-1 6 7 7-1 2015년 4월 4일 웹디자인 기능사 기출문제 1. 객체지향 프로그램에서 데이터를 추상화하는 단위는 ? 클래스 메서드 상속 메시지 객체지향 언어는 ___입니다. 객체지향언어 2. 다음 빈칸을 채우시오. 객체지향 언어는 ____ 입니다.객체지향 언어는 ____ 입니다.객체지향 언어는 ____ 입니다.객체지향 언어는 ____ 입니다.객체지향 언어는 ____ 입니다. 클래스 메서드 상속 메시지 객체지향 언어는 ___입니다. 객체지향언어 수험자 : 장진용 59분 10초 제출하기 문..

01. 다음 결과값을 작성하시오. { let num = 0; while(false){ num++; if( num == 3 ){ continue; } if( num > 10 ){ break; } } console.log(num); } // 정답 : 0 풀이 : num은 전역변수이고 while문의 조건이 false 이므로 while문 안의 값은 출력되지 않습니다. 따라서 변수 num=0이 그대로 출력됩니다. 02. 다음 결과값을 작성하시오. { let a = 6, b = 9, c = 3, result; result = ++a + b++ + ++c; console.log(result); console.log(a+b+c); } // 정답 : 20, 21 03. 결과값을 작성하시오 { function func()..

마무리 문제 1. 이미지에서 마우스 포인터를 다른 곳으로 이동하면 그림이 바뀌는 소스를 작성해 보세요. 마우스 오버하면 이미지 바꾸기 이름이 container인 div박스 안에 화면에 표시될 이미지를 넣었습니다. 스타일 태그 안에는 각각의 스타일을 지정하였습니다. 스크립트 코드 선택자를 지정하고 마우스 오버했을 때 선택자에 이벤트 메서드인 addEventListener("mouseover") 를 했을 때 변경 될 이미지가 나오게 설정합니다. 마우스 아웃했을 때 선택자에 이벤트 메서드인 addEventListener("mouseout") 를 적용하여 마우스가 그림에서 떨어졌을 때 그림이 원래대로 변하는 효과를 넣었습니다. 마무리 문제 2. 이벤트를 활용하여 필요에 따라 메뉴가 나타나고 감추어 지도록 만들어..

자바스크립트에서 number와 boolean,string 유형은 별도로 프로토타입 객체가 만들어져 있습니다. 즉, 숫자는 Number 객체, 문자열은 String 객체라는 식으로 만들어졌는데, 이런 객체를 '래퍼 객체'라고 부릅니다. 문자열에서 길이를 찾을 때는 배열에서처럼 length 프로퍼티를 사용합니다. let str = ""Good morning!" let a = "안녕하세요?" str.length// 14 a.length // 6 공백도 문자열에 포함 됩니다. chatAt(), indexOf() 메서드를 활용하여 문자열에서 문자의 위치를 찾을 수 있습니다. 문자열에서 특정 위치의 문자를 가져오려면 charAt() 함수를 사용합니다. 위치는 인덱스로 표시되는데, 인덱스는 0부터 시작합니다. let..

오늘은 수업을 배우면서 어려웠던 내용을 다시 한번 복습하겠습니다. 자바스크립트 요소(Element) 객체는 HTML 요소를 나타내는 객체입니다. 이 객체를 사용하여 HTML 요소의 속성, 스타일, 클래스 등을 변경하거나 이벤트를 처리할 수 있습니다. 요소 객체는 다음과 같은 속성과 메서드를 가지고 있습니다. 속성 id: 요소의 고유 식별자를 나타냅니다. className: 요소의 클래스 이름을 나타냅니다. innerHTML: 요소의 내부 HTML 코드를 나타냅니다. outerHTML: 요소의 외부 HTML 코드를 나타냅니다. textContent: 요소의 내부 텍스트를 나타냅니다. value: 입력 요소의 값(value)을 나타냅니다. style: 요소의 스타일을 나타내는 객체입니다. attributes..

01. 결괏값을 작성하시오. { 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); } 풀이 : lastIndexof는 텍스트의 제일 마지막 부분을 가져 옵니다. 결과 확인하기 1, 3, true 02. 다음의 결괏값을 보고 빈칸을 채우시오. { function func(){ document.write("함수2가 실행되었습니다."); } function callback(str){ document.write("함수1가 실행되었습니다..

마우스 이펙트 Javascript Mouse Effect01 마우스 이펙트 - 마우스 따라다니기 1 2 3 4 5 6 A man is known by the company he keeps. 사람은 그가 사귀는 친구로 알 수 있다. clientX : 0px clientY : 0px offsetX : 0px offsetY : 0px pageX : 0px pageY : 0px screenX : 0px screeny : 0px body의 클래스 img01 bg01 font01는 각 배경, 배경색, 폰트 종류를 의미 합니다. header태그에는 각각의 list를 만들어 숫자를 넣어주었습니다. 링크가 연결되어 있어 클릭하면 다른페이지로 이동합니다. mouse__text에 2개의 p단락을 넣고 text를 작성 후 글..

1. 결괏값을 작성하시오. { (function(){ console.log("함수가 실행되었습니다."); })(); } 결과 확인하기 함수가 실행되었습니다. 2. 결괏값을 작성하시오. { function func(str = "함수가 실행되었습니다."){ document.write(str); } func(); } 결과 확인하기 함수가 실행되었습니다. 3. 결괏값을 작성하시오. { let sum = 0; for(var i=1; i num2) return num1 else return num2 } console.log(func(10, 23) + func(40, 50)) } 결과 확인하기 73

변수 : 지역변수 + 전역변수(스코프) 함수 내부에서 선언된 변수는 지역 변수(local variable)라고 하며, 해당 함수 내에서만 접근할 수 있습니다. 반면에 함수 외부에서 선언된 변수는 전역 변수(global variable)라고 하며, 프로그램의 어느 곳에서든지 접근할 수 있습니다. { let x = 100; //전역 변수 let y = 200; //전역 변수 function func(){ let x = 300; //지역 변수 x앞에 let이 없으면 전역변수로 변경 let y = 400; //지역 변수 z = "javascript"; //전역 변수로 취급 string모드 선언하면 에러 console.log("함수 안"+x); //함수 안의 x값은 지역변수이기 때문에 사용가능 console.lo..

오늘은 시험문제 오답노트를 작성하겠습니다. 01. 결괏값을 작성하시오. { if( null ){ console.log("true"); } else { console.log("false"); } } 02. 결괏값을 작성하시오. { let num = 0; while( num 6 ){ break; } console.log(num); } } 풀이 : 변수 num의 초기값은 0입니다. while문 안의 num++에서 num값이 1로 변하고 if문의 num이 3인 경우 continue 즉 3 을 제외하고 계속 된다는 뜻입니다. 다음 if문에서는 num이 6을 초과하는 경우 break가 실행되므로 while문은 6에서 끝이납니다. 따라서 1,2,4,5,6이 출력 됩니다. 정답 : 1,2,4,5,6 07. 결괏값을 작..

JavaScript에서 데이터를 불러오는 방법은 여러 가지가 있습니다. 여기에는 일반적으로 사용되는 몇 가지 방법을 설명하겠습니다. 01. 변수 : 데이터 불러오기 변수안에 저장된 데이터를 불러오는 방법입니다. let x =100, y = 200, z = "javascript"; console.log(x, y, z); // 결과 : 100 200 javascript 02. 상수 : 데이터 불러오기 상수안에 저장된 데이터를 불러오는 방법입니다. 상수 const로 지정한 변수안에 저장된 데이터를 console log 안에 차례로 넣어 값을 냅니다. const x = 100, y = 200, z ="javascript"; console.log(x, y, z); // 결과 : 100 200 javascript ..

오늘도 공부하면서 어려웠던 부분을 복습 하겠습니다. switch문 switch문은 특정 값에 따라 다른 코드 블록을 실행하는 조건문입니다. switch문은 다음과 같은 구조를 가집니다. switch(expression) { case value1: // value1과 일치하는 경우 실행할 코드 break; case value2: // value2와 일치하는 경우 실행할 코드 break; default: // 모든 case와 일치하지 않는 경우 실행할 코드 break; } expression은 switch문에서 평가할 표현식입니다. case 키워드 다음에 나오는 value1, value2 등은 expression과 비교할 값입니다. case 키워드 뒤에 오는 값과 expression이 일치하는 경우 해당 c..

오늘은 공부하면서 헷갈린 부분을 정리 하겠습니다. for문과 if문을 이용하여 25칸 테이블을 만들고 홀수는 파란색 짝수는 빨간색으로 나타내 보세요 let table = ""; for(let i=1; i { return str; } document.write(func("실행되었습니다.")); const func = (str) => { ... }는 func라는 이름의 상수를 선언하고, 화살표 함수를 할당하는 구문입니다. 이 화살표 함수는 매개변수 str을 받아들이고, return을 통하여 str을 반환하는 함수입니다. document.write(func("실행되었습니다."))는 func 함수를 호출하고, 매개변수로 "실행되었습니다." 문자열을 전달합니다. func 함수는 전달받은 문자열을 반환하므로, 이 ..

오늘은 수업시간에 테스트를 보고 틀린 문제를 정리하겠습니다~ 01. 다음의 출력값을 보고 빈칸을 채우시오! var x = 100; var y = 200; var z = "javascript"; console.log(__); console.log(__); console.log(__); //100 //200 //300 풀이 : 결과값이 100, 200, 300 이므로 첫번째 console.log안에는 변수 x, 두번째는 y, 세번째는 x + y입니다. 정답 : x, y, x+y 04. 다음의 출력값을 보고 빈칸을 채우시오! const arr = ________(); arr[0] = 100; arr[1] = 200; arr[2] = "javascript"; console.log(arr[0]); console...

오늘은 자바스크립트의 역사에 대해 알아 보곘습니다!! 탄생 배경 거의 최초의 상용 웹 브라우저인 Netscape Navigator가 처음에 생겼을 때는 HTML과 CSS로 그냥 정적인 웹사이트 밖에 만들 수 없었습니다. 자바스크립트(JavaScript)는 1995년 넷스케이프(Netscape)의 브렌던 아이크(Brendan Eich)가 개발한 프로그래밍 언어입니다. 당시 넷스케이프는 웹 브라우저의 시장을 지배하고 있었는데, 브라우저에 동적인 기능을 추가하기 위해 자바스크립트를 개발하게 되었습니다. 초기에는 "라이브스크립트(LiveScript)"라는 이름으로 출시되었지만, 당시 자바가 인기 있었던 관계로 "자바스크립트(JavaScript)"라는 이름으로 바뀌었습니다. 1996년에는 마이크로소프트(Micro..

문제 1) 사용자가 프롬프트 창에 숫자를 입력했을 때 그 숫자를 함수로 넘겨주고, 함수에서는 숫자가 양수인지, 음수인지, 또는 0인지 판단해서 알림 창에 보여주는 프로그램을 작성해 보세요. function isPositive(n) { if (n > 0) { alert(`${n}은 양수입니다.`); } else if (n < 0) { alert(`${n}은 음수입니다.`); } else { alert(`${n}은 0입니다.`); } } const number = parseInt(prompt('숫자를 입력하세요.')); // parseInt() 는 숫자가 아닐 경우 NaN을 반환함 if(!isNaN(number)) { // 숫자일 경우에만 실행 isPositive(number); } 함수 isPositive..

데이터 제어하기 자바스크립트는 데이터를 제어하고 조작하는 데 사용할 수 있는 다양한 내장 함수와 객체를 제공합니다. 이를 통해 데이터를 필터링, 검색, 정렬, 변환 등 다양한 방법으로 제어할 수 있습니다. 01.if문 조건문은 프로그래밍에서 가장 기본적인 제어문 중 하나입니다. 조건문을 사용하면 조건에 따라 프로그램이 다른 동작을 하도록 할 수 있습니다. // false : 0, null, undefined, false, "" //숫자 0과 null, undefined, false, ""만 false가 나옵니다. ""은 빈문자열입니다 // true : 1, 2, 3, "0", "1", "ABC", [], {}, true //배열, 객체도 true가 나옵니다 if(""){ document.write("실행..

자바스크립트에서 함수란 자바스크립트 함수는 재사용 가능한 코드 블록으로, 입력 매개변수를 받아들이고 출력 값을 반환할 수 있습니다. 함수를 사용하면 코드를 모듈화하고, 코드의 중복을 줄이며, 유지보수성을 향상시킬 수 있습니다. 함수는 하나 이상의 문(statement)을 그룹화하여 이름을 붙이고, 필요할 때 호출하여 실행할 수 있습니다. 함수는 일급 객체로 취급되며, 변수나 객체의 속성으로 할당될 수 있고, 매개 변수로 전달될 수 있습니다. 또한 함수 내에서 다른 함수를 정의하여 중첩된 함수를 만들 수도 있습니다. 함수는 자바스크립트에서 매우 중요한 개념 중 하나입니다. 많은 기능을 수행하기 위해 함수를 사용하며, 함수를 이용하여 코드를 재사용하고 모듈화할 수 있습니다. 화살표 함수(arrow funct..

자바스크립트에서 데이터를 저장하는 방법은 여러 가지가 있습니다. 변수(variables): 자바스크립트에서 변수는 데이터를 저장하기 위해 가장 일반적으로 사용되는 방법입니다. 변수를 선언하고 값을 할당할 수 있습니다. 변수는 숫자, 문자열, 불린 값, 배열, 객체 등 다양한 데이터 타입을 저장할 수 있습니다. 01. 변수 : 데이터 저장 변수는 데이터를 저장하는 저장소입니다. var x = 100; //변수 X에 숫자 100을 저장함 var y = 200; //변수 y에 숫자 200을 저장함 var z = "javascript"; //변수 z에 문자 "javascript"를 저장함 console.log(x); console.log(y); console.log(z); // 결과 : 100, 200, jav..

자바스크립트 배운 내용 책에서 예시 풀어보기 예제 1. 주어진 배열에서 10보다 큰 값을 찾아 화면에 표시하기 길라잡이 배열 요소의 개수만큼 for문을 반복합니다. if 문을 사용해서 요소의 값과 10을 비교합니다. document.write 문을 사용해서 화면에 표시합니다. const arr = [1, 3, 5, 7, 9, 11, 13, 15, 17, 19]; // const 키워드를 사용하여 배열 arr을 상수로 선언하고, 대괄호([]) 안에 각 원소를 쉼표로 구분하여 지정합니다. for(let i=0; i10){ // if 조건문을 사용하여 현재 원소가 10보다 큰 경우에만 실행되는 코드 블록을 만듭니다. 만약 현재 원소가 10보다 작거나 같다면, document.write() 함수가 실행되지 않으..

조건문 자바스크립트에서 조건문은 프로그램의 실행 경로를 제어하는 구문입니다. 조건문은 특정 조건에 따라 다른 코드 블록이 실행되도록 합니다. 조건문이란? 지정된 조건을 Ture, false로 판별하여 각 상황에 맞게 명령을 실행하도록 만드는 것을 뜻합니다. 조건문은 주어진 조건에 따라 실행할 코드를 결정하는 데 사용됩니다. 자바스크립트에서는 if문, switch문, 삼항 연산자,if else, else if 등이 있습니다. if문 조건식은 참(true) 또는 거짓(false) 값을 갖는 표현식(expression)입니다. 조건식이 참일 때 코드 블록({ }) 안에 있는 코드가 실행됩니다. if (조건식) { // 조건식이 true일 때 실행되는 코드 블록 } if else 문 if문은 else문과 함께 ..

See the Pen Untitled by jinyongjang (@jinyongjang) on CodePen. prompt 함수를 사용하여 사용자로부터 숫자를 입력받습니다. prompt 함수는 사용자에게 알림창으로 메시지를 보여주고, 입력받은 값을 반환합니다. 이때 입력값은 문자열(string) 형태로 반환됩니다. if 조건문을 사용하여 입력값이 null이 아닌 경우에만 실행할 코드 블록을 지정합니다. null은 값이 없음을 나타내는 자바스크립트 특수한 값 중 하나입니다. parseInt 함수를 사용하여 입력받은 문자열 값을 정수형으로 변환합니다. 이때 parseInt 함수는 문자열을 정수형으로 변환할 수 없는 경우 NaN 값을 반환합니다. 삼항 연산자를 사용하여 userNumber 변수가 짝수인지 홀..

반복문이란 반복문은 말그대로 같은 동작을 여러 번 실행하기 위해 사용하는 문입니다. 반복문을 사용하면 불필요하게 여러 명령을 늘어놓지 않아도 명령을 반복 실행할 수 있습니다. 특정 구문을 여러번 반복해서 처리하는 방법을 이야기 합니다. 이를 구현하기 위해 자바스크립트에서는 for 나 while 문이 존재합니다. for문 javascript에서 가장 많이 사용하는 반복문은 for문 입니다. for문은 자체적으로 초기식, 표현식, 증감식을 가지고 있습니다. for문은 조건에 들어가는 값이 일정하게 커지면서 명령을 반복 실행할 때 편리합니다. 기본형 for (초기식; 조건식; 증감식){ 조건식의 결과가 참인 동안 반복적으로 실행하고자 하는 실행문 } ex) for (i=0; i

연산자란 1+2, 6 TRUE A || B -> TRUE B || A -> TRUE B || B -> FALSE // 둘 다 FALSE이므로 FALSE ! (not연산자) : Boolean값 역전 !A && !A -> FALSE !A && !B -> FALSE !B && !A -> FALSE !B && !B -> TRUE // ||와 반대 개념으로 둘 다 FALSE 이므로 TRUE

[자바스크립트에서 자료형의 의미] 자료형(data type)은 프로그래밍 언어로 조작할 수 있는 값의 유형을 나타냅니다. 숫자나 문자열처럼 프로그램에서 처리할 자료의 유형을 지정해야 하는데, 이러한 자료의 형태를 '자료형'이라고 합니다. 자바스크립트의 자료형으로는 숫자,문자,논리형(불린),객체,심벌, 널(Null), 미정의(Undefined) 값이 있습니다. 원시 유형은 하나의 값만 지정할 수 있습니다. 원시 유형 외에는 전부 객체입니다. 자료형 문자열: 큰따옴표나 작은 따옴표 모두 앞뒤에 붙는 따옴표는 같아야 합니다. String()은 숫자를 문자열로 변환하는 함수입니다.문자열 자료형은 자바스크립트 내의 텍스트를 표현하며, 문자열은 유니코드 문자의 나열입니다. typeof("안녕하세요") // 'str..