본문 바로가기
728x90
반응형

스마트인재개발원/자바스크립트8

[JS] 내부,외부 자바스크립트 생성 방법/객체/배열의 선언/배열의 생성/배열의 데이터 추가/배열의 길이 구하기 내부 자바스크립트 작성 위치에 따라 실행순서와 브라우저 렌더링에 영향을 미친다. ( head , body) 내 작성 : 단순한 로직처리(설정값 초기화) 앞 작성 : 복잡한 로직처리(제어) 즉 , 모든 요소들은 body에 작성 외부 자바스크립트 1. js파일 생성 후 함수 작성 2. head에 외부 자바스크립트 파일 불러오기 3. body에서 버튼 클릭시 기능 호출 ※ 렌더링 동안 병렬로 다운로드 명령(async src) ※ -> 시간 단축 효과 ※ 모든 파일 병렬로 다운로드 명령(defer src) ※ 객체(Object) : 키(key) - 값(value) 를 쌍으로 데이터를 저장하는 구조 배열(Array) : 여러가지 자료들을 한꺼번에 다룰 수 있는 자료구조 : 여러 자료형을 섞어서 하나의 배열에 저장.. 2022. 10. 7.
[JS] 자바스크립트 반복문(for문/switch문) / 랜덤숫자 맞추기 반복문 누적값 계산 하는 실습 반복문 실습2 : 랜덤하게 뽑힌 숫자를 맞추는 프로그램 1. 숫자입력창 2. 비교 알림창 2022. 10. 7.
[JS] 자바스크립트 조건문/ 조건문 활용한 예제/ 입력창 입력값에 따른 배경색 지정/ 점수 입력 후 평균과 학점 계산 조건문 if문 () 안에는 비교연산자, 논리연산자 사용 값에 따라 따로 처리 -> switch문 조건문 실습1 : java, python, r 점수를 입력받고, 평균과 학점 출력 : 90점 이상 = a , 80점 이상 = b , 70점 이상 = c, 그 외, f 조건문 실습2 : 입력창에 빨강, 초록, 파랑 중에 원하는 색을 입력했을 때, 웹 브라우저 배경색이 바뀌도록 작성 2022. 10. 7.
[JS]자바스크립트 연산자 종류/예제/형변환 종류/사용방법 연산자 종류 산술연산자 + - * / : 실제나누기 연산결과 몫X % : 나머지 ** : 지수 증감연산자 ++ -- 대입연산자 = += -= *= /= %= 비교연산자 == : 동등연산자 (자동으로 자료형 변환 후 비교) : 숫자와 문자열 비교 시 문자열을 숫자로 변환 : 피연산자가 boolean일 경우 true는 1로 false는 0로 변환 : 객체와 숫자/문자열 비교시 객체를 기본 데이터타입으로 변환 : null과 undefined는 true 반환 === : 일치 연산자 : 타입 변환을 하지않고 정확히 값과 자료형을 비교 그 외 != !== > >= 2022. 10. 7.
[JS] 입력창에 입력된 값 콘솔창에 띄우기 / 자바스크립트 자료형 종류 및 특징/ undefined,null,NaN 차이점 이름입력 창 띄우고 해당 이름 콘솔창에 저장 실습 입력창 화면 코드 / 콘솔창 화면 -> var 대신 let 사용 가능 최종 코드 자바스크립트 자료형 number 정수, 실수 등 산술 연산이 가능한 자료형 string 문자열로 이루어진 자료형 boolean 참/거짓으로 표현되는 논리형태의 자료형 undefined 값이 할당된 적이 없거나 존재하지 않는 속성일때의 유형 null 아무런 값을 나타내지 않을 때의 자료형 Symbol 객체의 프로퍼티 키를 고유하게 설정함으로써 프로퍼티 키의 충동을 방지 undefined : 사용자나 개발자가 값을 넣어두지 않았을 때 ex) var a; -> undefined null : 빈 값 ( 비어있는 것 x ) -> 자체가 값이다. ( defined가 싫어서 null값을 .. 2022. 10. 6.
[JS]자바 스크립트,자바 변수 사용 차이점/ 변수 네이밍 법칙/var,let,const 차이/정의 변수 : 저장하는 데이터에 따라서 데이터 저장 JAVA JAVA SCRIPT int var char var double var 정적타입/강력한 타입 언어 동적타입/느슨한 타입 언어 - 자료형을 컴파일시 결정 - 컴파일시 자료형에 맞지않는 값이 들어있으면 컴파일 오류발생 - 자료형을 런타임 타입 언어 - 실행 도중 변수에 예상치 못한 데이터 값이 들어오면 Type Error발생 카멜표기법 var userName 변수명, 함수명 스네이크표기법 var user_name 파스칼표기법 var UserName 클래스명, 생성자명 헝가리언표기법 var strUserName : ECMAScript6 표준안에서 새로운 변수 키워드 등장 let ( 변수) const ( 상수) var let(변수) const (상수) 변수.. 2022. 10. 6.
[JS]자바스크립트 실행오류 확인방법/입력과 출력 방법/콘솔창에 입력값 나오게하기 자바스크립트 vscode live server 실행 후 오류 확인 방법 1. f12번 해서 console창 들어가 확인하기 2. f12에서 source창 들어가서 파일 선택 후 오류 확인하기 자바스크립트 작성 기초 간단한 예제 (버튼을 클릭하면 문서 배경 변경 실습) 디자인 바꾸기 버튼 클릭시 -> 검정배경, 흰글씨 되돌리기 버튼 클릭시 -> 흰배경, 검정글씨 자바스크립트 무작정 따라하기!!!!!!!!!!!! 디자인바꾸기 짠!&nbsp&nbsp되돌리기 짠! HTML CSS JS 오늘은 12/08일 즐거운 JavaScript 수업입니닷! javaScript 입력과 출력(script태그 내에 사용) html문서 내에 출력 document.write() console창에 출력 console.log() - 출력.. 2022. 10. 6.
[JS]자바스크립트 의미 /언어구별종류/특징/라이브러리와 프레임워크 차이 / 바닐라 자바스크립트란? JavaScript - 자바랑 관련 없다! - 객체 기반의 스크립트 프로그래밍 언어 인터프리터 언어 vs 스크립트언어 vs 컴파일언어 1. 인터프리터 언어 (ex.파이썬, R) : 통역 -> 해석안되는 문장을 제외한 윗쪽은 실행o 2. 스크립트 언어(ex.자바 스크립트) -> 기존에 이미 존재하는 응용 소프트웨어 제어 3. 컴파일 언어(ex.c언어, 자바, c++) : 번역 -> 코드 상에 하나라도 안되면 실행x 자바 스크립트 특징 모든 웹브라우저에서 동일하게 동작 웹 브라우저에서 실행 결과 즉시 확인 다양한 용도의 프로그램 개발 다양한 자바스크립트 공개 api 다양한 라이브러리와 프레임워크 라이브러리 vs 프레임워크(framework) 라이브러리 : 내가 라이브러리를 부르는것 (ex. jQuery) :.. 2022. 10. 6.
728x90
반응형