[Githru.v] 새롭게 알게된 것들

Chaejung·2022년 8월 9일
1
post-thumbnail

JS-문자열 다루기

String.prototype.split()

split() 메소드는 문자열을 정해진 seperator를 기준으로 나누어 새로운 배열로 반환해준다.

const example = 'Author:     chaejung Kim <whenucan35@gmail.com>'

const words = example.split(' ');
console.log(words)
//['Author:', '', '', '', '', 'chaejung', 'Kim', '<whenucan35@gmail.com>']
console.log(words[5])
//chaejung

const chars = example.split('');
console.log(chars[21])
//K

const exampleCopy = example.split();
console.log(exampleCopy)
//['Author:     chaejung Kim <whenucan35@gmail.com>']

const email = example.split("<")[1].split(">")[0]
console.log(email)
//whenucan35@gmail.com

새로운 줄마다 자르고 싶으면, 정규 표현식을 쓰면 된다.
/ /는 정규표현식의 시작과 끝을 의미한다.
\r은 Carriage Return을 감지하는데, 이는 새로운 줄로 가는 것을 의미한다.
\n은 Line Feed를 감지하는데, 이는 줄의 마지막을 의미한다.(새로운 줄로 움직여주지는 않음)
(둘이 합쳐서 CRLF!) 출처
?는 바로 앞에 있는 문자가 포함되거나 없어도 되는 것을 의미한다.

example
/th?e/ : t와 e 사이에 h가 있어도, 없어도 된다 -> 'the', 'te'chnology, toe (x)
/e?le?/ : l 앞 뒤로 e가 있어도, 없어도 된다 -> ang'el', ang'le', angu'l'ar

const log = `
commit 5d3f94e4072863b98dc17c3e43d77c98473bd42f 224512334c9526a24ef49af030f93884102a4d2b
Author:     chaejung Kim <whenucan35@gmail.com>
AuthorDate: Fri Jul 29 20:01:18 2022 +0900
Commit:     chaejung Kim <whenucan35@gmail.com>
CommitDate: Fri Jul 29 20:02:36 2022 +0900
    Feat: log to JSON function, parse01
89      0       parser/blcklamb/src/gitLogToJSONParser.ts
`
const splitByNewLine = log.split(/\r?\n/)
// ['', 'commit 5d3f94e4072863b98dc17c3e43d77c98473bd42f 224512334c9526a24ef49af030f93884102a4d2b', 'Author:     chaejung Kim <whenucan35@gmail.com>', 'AuthorDate: Fri Jul 29 20:01:18 2022 +0900', 'Commit:     chaejung Kim <whenucan35@gmail.com>', 'CommitDate: Fri Jul 29 20:02:36 2022 +0900', '    Feat: log to JSON function, parse01', '89      0       parser/blcklamb/src/gitLogToJSONParser.ts', '']

String.prototype.trim()

trim() 메서드는 문자열 양 끝의 공백을 제거해준다.

const dirtyStr = '    SSuk Frappuccino   '
console.log(dirtyStr.trim())
//SSuk Frappuccino

String.prototype.replace()

replace() 메서드는 문자열 중에 원하는 부분을 대체할 수 있다.
주의할 점은, 첫번째 값만 바꿔준다, 그래서 전체를 바꾸려면 global flag(g)를 달면 된다.
참고로 i는 case 무시하는 flag.

const originString = 'I love HamCheese sandwich. I\'m going to eat hamCheese sandwich today.'

const newString = originString.replace(/hamcheese/gi, "Subway")
console.log(newString)
//I love Subway sandwich. I'm going to eat Subway sandwich today.

TS-설정

  1. tsconfig.json 생성하기
# 전역적으로 typescript 모듈 설치
>>> npm i typescript -g
# tsconfig.json 생성
>>> tsc --init
  1. complier options 설정하기 더 알아보기
    이 외에도 많은 설정이 있지만, 이번 프로젝트에 필요할 것 같은 것만 남겨놓고 나머지는 지웠다.
{
  "compilerOptions": {
    /* Visit https://aka.ms/tsconfig to read more about this file */

    /* Language and Environment */
    
    "target": "es6" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
    /* 모던 브라우저가 ES6를 지원하므로 es6가 적절하다. */
    ,
    "lib": [
      "dom",
      "es6",
      "es2016",
      "es2017"
    ] /* Specify a set of bundled library declaration files that describe the target runtime environment. */
    /* 지정되지 않으면 기본 리스트가 삽입된다, es6의 경우-DOM, ES6, DOM.Iterable, ScriptHost */
    /* 구체적인 리스트는 [여기에서](https://www.typescriptlang.org/tsconfig/#lib) */
    ,

    /* Modules */
    "module": "CommonJS" /* Specify what module code is generated. */
    /* 구체적인 배경 설명은 [여기에서](https://www.typescriptlang.org/docs/handbook/modules.html) */
    ,
    "rootDir": "src" /* Specify the root folder within your source files. */,
    "outDir": "dist",
    "moduleResolution": "node" /* Specify how TypeScript looks up a file from a given module specifier. */,
    "resolveJsonModule": true /* Enable importing .json files. */,

    /* JavaScript Support */
    "allowJs": true /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */,

    /* Emit */
    "sourceMap": true /* Create source map files for emitted JavaScript files. */,
    "noEmit": true /* Disable emitting files from a compilation. */,

    /* Interop Constraints */
    "isolatedModules": true /* Ensure that each file can be safely transpiled without relying on other imports. */,
    "allowSyntheticDefaultImports": true /* Allow 'import x from y' when a module doesn't have a default export. */,
    "esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */,
    "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,

    /* Type Checking */
    "strict": true /* Enable all strict type-checking options. */,
    "noImplicitAny": true /* Enable error reporting for expressions and declarations with an implied 'any' type. */,
    "strictNullChecks": true /* When type checking, take into account 'null' and 'undefined'. */,
    "noImplicitThis": true /* Enable error reporting when 'this' is given the type 'any'. */,
    "noUnusedLocals": false /* Enable error reporting when local variables aren't read. */,
    "noUnusedParameters": true /* Raise an error when a function parameter isn't read. */,
    "noImplicitReturns": true /* Enable error reporting for codepaths that do not explicitly return in a function. */,

    /* Completeness */
    "skipLibCheck": true /* Skip type checking all .d.ts files. */
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

출처

MDN_String.prototype.split()

MDN_String.prototype.trim()

How to Split a String by Newline in JavaScript

Regular expression syntax cheatsheet

typescriptlang_the array type

profile
프론트엔드 기술 학습 및 공유를 활발하게 하기 위해 노력합니다.

0개의 댓글