배열 안에 객체가 여러 개 들어있는 형태를 자주 사용한다. 그 배열 안의 객체의 특정 키를 선택하여 배열 안의 객체를 정렬하는 방법이다. 📌 정렬하고자 하는 배열 const arr = [ { key: 'out1', value: 0 }, { key: 'out3', value: 1 }, { key: 'out2', value: 4 } ]; 'key' 속성의 문자열을 비교하여 오름차순으로 정렬하고자 한다. 📌 sort 함수 사용 sort() 함수는 기존 배열을 정렬하지 않고, 새로운 배열을 반환한다. a,b 는 비교할 첫번째 변수, 두번째 변수를 나타낸다. const arr = [ { key: 'out1', value: 0 }, { key: 'out3', value: 1 }, { key: 'out2', valu..

💬 구현하고자 하는 기능 1. 파이차트 가운데에 이미지 추가하기 2. 파이차트 클릭 시 url 이동하기 📌 파이차트 가운데 이미지 추가하기 series 속성 안의 label 을 사용하여 이미지를 추가한다. series: [ { label: { position: 'center', // 1. 변수 'a' 설정 formatter: () => { return '{a|}' }, rich: { // 'a' 변수에 들어갈 속성 설정 a: { backgroundColor: { image: require(`@common/DashBoard/Content/img/${this.chartId}.png`), }, height: 35 }, } }, } ] 📌 파이차트 클릭시 이벤트 추가하기 차트를 초기화한 후, click 이벤트를..

💬 개요 현재 진행하는 프로젝트는 main / cc / dev 로 총 3개의 서비스로 구성중인데 main 프로젝트 안에 iframe 으로 cc/dev에서 만든 컴포넌트를 뿌리는 방법이다. 이 때 dev 컴포넌트 안에서 main의 url을 변경했어야 했는데, window.location.href 를 사용하니까 dev 안에서 url 변경이 이루어졌다. ( = iframe의 url 이 변경됨 ) 📌 해결 : window.parent.location.href 사용 main 프로젝트의 (=브라우저) url을 변경할 수 있었다. 새로고침 효과가 적용되었다.

💬 개요보통 나는 객체나 기본 자료형을 복사할 때 나는 = 키워드를 사용하였다.하지만 객체는 = 키워드를 사용했더니 기존의 변수도 같이 수정됐다. 📌 자바스크립트의 원시값 vs 참조값자바스크립트에서의 값은 원시값과 참조값 두 가지 데이터의 타입이 존재한다. - 원시값 기본 자료형(단순한 데이터)를 의미 ( Number,String,Boolean, Null, undefined 등)변수에 원시값을 저장하면, 변수의 메모리 공간에 실제 데이터 값이 저장된다. 할당된 변수를 조작하려고 하면 저장된 실제 값이 조작된다.const a = 1;let b = a;b = 2console.log(a); //1console.log(b); //2원시값은 값을 복사 할 때 복사된 값을 다른 메모리에 할당 하기 때문에 원래의..
- Total
- Today
- Yesterday
- Vscode단축키
- 객체복사
- frontend
- Chart
- Location
- SASS
- chartjs
- 환경설정
- package
- web
- SCSS
- Legend
- Figma 기초
- 얕은복사
- package-lock
- figma
- 프론트엔드
- echarts
- npm install
- npm
- 객체
- x축스크롤
- Figma 버튼
- javascript
- VUE
- Figma Style
- vscode
- BarChart
- piechart
- 깊은복사
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |