본문 바로가기

basic

 (173)
[Vanilla.js] Class https://ko.javascript.info/class 클래스와 기본 문법 ko.javascript.info https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/class class - JavaScript | MDN class 선언은 프로토타입 기반 상속을 사용하여, 주어진 이름의 새로운 클래스를 만듭니다. The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples proje developer.mozilla.org
[Vanilla.js] fetch()와 axios fetch는 js 내장 함수 axios는 별도로 설치해야함 둘다 비동기 통신 지원 http://teamaqua.github.io/JSONTest/ JSON Test by teamaqua JSON Test.com JSON Test.com is a testing platform for programs utilizing JavaScript Object Notation (JSON). To use, just make a request to servicename.jsontest.com. For example, calling http://ip.jsontest.com will return your IP address in JSON-formatted f teamaqua.github.io async() => { const..
[React.js] reactstrap & bootstrap & sweetalert2 npm i reactstrap -s https://reactstrap.github.io/components/alerts/ reactstrap - Alerts Alerts This is a primary alert — check it out! This is a secondary alert — check it out! This is a success alert — check it out! This is a danger alert — check it out! This is a warning alert — check it out! This is a info alert — check it out! reactstrap.github.io npm i bootstrap i -s https://getbootstrap.co..
[React.js] 리액트에서 jquery npm i jquery --s 패키지 모듈을 설치한다. 아래는 입력값을 화면에 표시해주는 jquery를 활용한 간단한 예제이다 import React, { Component } from 'react'; import $ from 'jquery' export default class jquery extends Component { inputHandler = (e) => { const input_val = $('#input').val() $('#result').text(input_val) } render() { return ( this.inputHandler(e)}>입력값 알아오기 ); }
[Vanilla.js] Array.prototype.forEach() & Array.prototype.map(), for...in, for...of developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach Array.prototype.forEach() - JavaScript | MDN Array.prototype.forEach() forEach() 메서드는 주어진 함수를 배열 요소 각각에 대해 실행합니다. arr.forEach(callback(currentvalue[, index[, array]])[, thisArg]) callback 각 요소에 대해 실행할 함수. 다음 세 가지 매 developer.mozilla.org developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/m..
[Vanilla.js] 콜백함수와 this 자바스크립트에서 this는 선언되었을 때 객체를 말하는게 아니라 실행했을 당시에 결정되므로 따라서 호출한 주체를 가르킴 콜백 함수 내부에서 this는 window 객체를 가리킨다. 따라서 this를 이용하려면 bind()함수를 이용하거나 콜백함수 밖에서 this를 변수에 백업 또는 화살표함수를 이용하는 방법이 있다.
[Vanilla.js] concat, Object.assign ... 전개연산자 push는 원본을 바꾼다 하지만 concat은 원본은 놔두고 추가로 합친다 // 배열을 합치는 방법 var arr1 = ['num1', 'num2']; var arr2 = ['num3', 'num4']; var newArr= [arr1[0], arr1[1], arr2[0], arr2[1]]; //각각의 인자를 하나씩 가져오는 방법 var sum = [].concat(arr1, arr2); //concat 함수로 합치기 var es6_arr = [...arr1, ...arr2]; //전개연산자로 합치기 객체도 마찬가지로 전개연산자로 가능하다 var [ sum1, sum2, ...remain] = es6_arr; // es6_arr[0] = sum1, es6_arr[1] = sum2, 나머지는 요소들은 re..
[Vanilla.js] startsWith(), endsWith(), includes() ... ES6 [ ES6에 추가된 string 함수들 ] startsWith(): 변수의 앞에서 부터 일치하는 문자열을 찾아 true또는 false를 반환한다. endsWith(): 변수의 뒤에서 부터 일치하는 문자열을 찾아 true또는 false를 반환한다. includes(): 위치에 상관없이 변수에 특정 문자열이 포함되어 있는지를 판단하여 true또는 false를 반환한다. var str = 'Hello World!' console.log(str.startsWith('hello')) //trueconsole.log(str.endsWith('world')) //trueconsole.log(str.inludes('hi')) //false

티스토리툴바