Javascript 자료

손쉬운 사용

주석처리: Ctrl+?

DOMContentLoaded async&

  • async:비동기 스크립트는 HTML 문서가 완전히 다운로드되지 않은 상태라도 로드 및 실행될 수 있습니다. 스크립트 크기가 작거나 캐싱 처리 되어있을 때 혹은 HTML 문서 길이가 아주 길 때 이런 일이 발생합니다.
  • :지연 스크립트는 문서 다운로드와 파싱이 완료된 후에, DOMContentLoaded 이벤트 발생 전에 실행됩니다.

JavaScript 추천 검색어

  • document: 웹페이지 태그 삭제 혹은 자식태그 추가
  • DOM:document객체에서 찾을수 없다면 DOM으로 수색범위 넓혀 보세요 document객체는 DOM객체의 일부
  • window객체:웹페이지가 아니라 웹브라우저 자체를 제어해야할때"현재 열려잇는 웹주소가 뭔지 알아내야 될수 잇고 생창을 열어야 한수도잇고 웹브라우저의 크기를 자바스크립트를 통해 알아야한다면 윈도우 객체에 속해잇는 프로퍼티나 메소드가 여러분을 도울수잇을거에요
  • ajax:웹페이지를 리로드하지않고 정보를 변경하고 싶다면 ajax가 필요, 현대적인 웹앱을 만드는데 필수적인 테크닉입니다.
  • cookie:웹페이지가 리로드되어도 현재 상태를 유지하고 싶다면 cookie를 배우세요 cookie와 함께라면 사용자를 위한 개인화된 서비스를 제공할수 잇습니다.
  • offline web Application: 인터넷이 끊겨도 웹을 하고싶다면
  • webRTC:화상 통신 웹 앱을 만들고싶다면
  • speech: 사용자의 음성을 인식하고 음성으로 정보를 전달하고 싶다면
  • webGL: 3차원 그래픽으로 게임과 같은 것을 만들고 싶다면
  • webVR: 가상현실에 관심이 많으시다구요?

JavaScript

첫째:자바스크립트는 사용자와 상호작용하는 언어다.
둘째:웹브라우저는 한번 화면에 출력되면 가기 자신을 바꿀수 없다
셋째:자바스크립트는 HTML위에서 동작하는 언어다.

library(도서관) & framework(반제품)

공통점:다른사람의 도움을 받아 소프트웨어를 만든다

UI VS API

UI : User Interface 의 약자이다
API: Application Programming Interface

HTML에서의 출력 확인

          
        console.log:    콘솔창에 출력 console.log('데이터')
        document.write: HTML에 출력  document.write('데이터');
        alert:          경고창에 출력 alert('데이터')
          
        

JavaScript Data types

  • 기본 자료형 (Primitive) 인 여섯가지 데이터 타입
  • Boolean(연산자true&false)
  • Null
  • Undefined
  • Number(숫자)
  • String(문자)
  • Symbol (ECMAScript 6 에 추가됨)
  • 별도로 Object 도 있음

등장 문법:

while: while문은 조건문이 참일 때 실행되는 반복문이다. 조건은 문장안이 실행되기 전에 참, 거짓을 판단한다.

변수(variable) vs 상수(constant

  • variable:변경가능 rw(read/write)
  • constant:변경불가 r(read only)
    • 메모리 값 저장되는 두가지 타입
    • primitive,single item:numer,sting,boolean,null,undefined,symbol
    • object:box container

변수의 효용중 하나

변수 let:선언한 변수에 한해 사용가능하다 var: 선언 하기 전에 사용가능하다,또한 블럭을 무시한다. 그러므로 위험하다 var hoisting-어디에 선언햇는지에 관계없이 맨위로 끌어 올려준다 let name = 'sung'; var name = 'sung'; alert("variable, "+name+",mutable, changeable, "+name+", unsettled, fickle, "+name+",mobile") 변수를 사용할땐 앞에 var 을 붙여준다 var = Variable

문자열에서 가장 많이 사용되는 작업들

          .length    : 문자열의 길이를 확인하는 (length), 
          + 와 +=    : 문자열을 생성하고 연결하는 + 와 += 문자열 연산자, 
          substring  :서브문자열(substring)이 있는지 확인하고, 
          indexOf()  :있으면 위치를 확인하는 indexOf() 메서드, 
          substring():서브문자열(substring)을 추출해내는 substring() 메서드가 있습니다.
        

Template literals(string)

"`${}`"을 이용해 간결하게 만들수잇다 const char ='c'; const brendan = 'brendan'; const greeting = 'hello' + brendan; console.log(`value: ${greeting},type: ${typeof greeting}`); const helloBob = `hi ${brendan}!`; //template literals (string) -> console.log(`value: ${helloBob},type: ${typeof helloBob}`); //template 사용시 -> console.log('value:' +helloBob + 'type: '+typeof helloBob); //template 미사용시

boolean

  • false:0,null,undefined,NaN,''
    • null:비어잇는 값
    • undefined:선언은 되엇지만 지정된 값이 없다
  • true:any other value

symbol

  • symbol: 고유의 식별자가 필요할때 할당(내용이 같으며도 불구하구 false로 판단하다)

Javascript 체험기 내용 바꾸기

          

안녕하세요

올때메로나

document웹문서 .의 get:가져오다 Element:요소 ById:id에 의해서 innerHTML:내부 HTML , 내부 요소 = : 대입 웹문서 ID=hello인 HTML요소 가져와 내부 글자 안녕으로 바꿔줘

이스케이프 표현

    일반적인 출력 문자 외의 특수 문자는 이스케이프 표현을 사용해 적을 수 있습니다.
    
    코드	                출력
    \XXX	                8진수 Latin-1 문자
    \'	                  작은따옴표
    \"	                  큰따옴표
    \\	                  역슬래시
    \n	                  줄바꿈
    \r	                  캐리지 리턴
    \v	                  세로 탭
    \t	                  탭
    \b	                  백 스페이스
    \f    	              폼 피드
    \uXXXX	              유니코드 코드포인트
    \u{X} ... \u{XXXXXX}	유니코드 코드포인트 
    \xXX	Latin-1         문자
    일부 다른 프로그래밍 언어와 달리, JavaScript는 작은따옴표와 큰따옴표 문자열을 구분하지 않습니다. 
    따라서 위의 이스케이프 문자는 작은따옴표나 큰따옴표에서 상관 없이 작동합니다.
          

주의 사항

  • 조작하고 싶은 html이 있으면 그아래에 조작하는 코드를 작성해야 한다.

알람메시지

//'use strict'; 를 사용하면 유저 에러를 잡아준다
  • of Null: Null로 표시한 데이터의 왼쪽 값을 못찾앗다. 비엇다고 보면된다.
  • is not a function:함수가 아닌데요~ 맞춤법확인.