기억하지 못해 남겨두기

a태그 자바스크립트 함수 실행 여러개가 있겠지만 특이한 한개는 <a href= "javascript:locate()" > 이런 방법으로 locate함수 실행 가능함

말줄임 표시하기(...) 여러방법이 있겠지만 css로는 .title { float : left ; width : calc( 100 % - 100px ); color : #111 ; overflow : hidden ; text - overflow : ellipsis; white-space : nowrap ; } 마지막의 overflow, text-overflow, white-space가 셋트임

02. Vue 가이드 문서 따라가기 Vue 인스턴스 <div id= 'app' > <div> {{msgA}} </div> <div> {{msgB}} </div> <button v-on:click= 'changeMessage' > Change! </button> </div> <script> //msgB는 반응성을 가지지 않음 const vm = new Vue({ el: '#app' , data : { msgA : 'Message A.' }, methods : { changeMessage(){ this .msgA = 'Changed message A!' this .msgB = 'Changed message B!' } }, } }) < /script> 생성될때 정의되지 않으면  데이터는 반응성을 보이지 않는다. {{msgB}}는 동작을 하지만 vm.msgB값을 넣어도 반응하지 않는다. 라이프 사이클 <div id= "app" > <div ref= 'msg' > {{msg}} </div> <div ref= 'div' ></div> </div> <script> const vm = new Vue({ el : '#app' , data : { msg : 'Hello Vue!' },

forOf 순회하기 var data = [ 1 , 2 , undefined , NaN , null , '' ]; data.forEach( function (value){ console.log( 'valueis' , value); }); //문제점은 자신이 가지고 있지 않는 상위의 값까지도 추가해서 문제가 될수가 있음 Array .prototype.getIndex = function (){}; //function(){}가 생김 //그래서 forin을 array에서 쓰면 안됨 for ( let idx in data){ console.log(data[idx]+ 'forIn' ); } //forOf는 forin의 문제가 안일어남 for ( let value of data){ console.log(value+ 'forOf' ); } var str = "hello world!!!!" ; //배열만을 위한게 아님 //문자열의 공백까지도 나옴 for ( let value of str){ console.log(value); }

시작하는 값확인, 끝부분, 포함값 확인 let str = 'hello world ! ^^ ~~' ; let matchstrStart = 'hello' ; let matchstr = '^ ~~' ; console.log(str.startsWith(matchstrStart)); console.log(str.endsWith(matchstr)); console.log(str.includes( '^^' )); startsWith : 시작하는지 true/false반환 endsWith : 끝나는지 true/false반환 includes : 포함하는지 true/false반환

let은 스코프 단위로 사용 가능 function home(){ var homevar = "homevar" ; for ( let i = 0 ; i< 100 ; i++){ console.log(i); } //console.log(i); if ( true ){ let myif= "myif" ; } console.log(myif); } let대신 var이라면 myif가 나오지만 let은 undefined나옴

01. Vue 시작하기 노드 설치 및 팁 https://heropy.blog/2018/02/17/node-js-install/ 패키지 매니저로 설치시 Mac - Homebrew brew install node@12 Windows - Chocolately choco install nodejs-lts 버전관리 노드 설치전 mac - NVM wondows - nvm-windows, nodist 노드 설치후 n쓰면 됨 웹 에디터 Codepen, JSFiddle은 Vue세팅이 가능함 JSBin은 CDN갖다가 붙여야 하긴함 선언적 렌더링 {{msg}} = 템플릿 문법 v-bind 속성은 디렉티브(v-접두어) 조건문 반복문 조건문 <div id= "app-3" > <p v-if= "seen" > 이제 나를 볼 수 있어요 </p> </div> var app3 = new Vue({ el: '#app-3' , data: { seen: true } }) 반복문 <div id= "app-4" > <ol> <li v-for= "todo in todos" > {{ todo.text }} </li> </ol> </div> var app4 = new Vue({ el: '#app-4' , data: { todos: [ { text: 'JavaScript 배우기' }, { text: 'Vue 배우기' }, { text: '무언가 멋진 것을 만들기' } ] } }) 사용자 입력 핸들링 <div id= "app-5" > <p> {{ message }} </