url을 a 태그로 변환하기

딱히 좋은 방법은 아닌거 같긴 한데 급할때는 최선인듯 하다.

    function parseUrl(orgnTxt) {
      var rplcdTxt, rplcdPttrn1, rplcdPttrn2, rplcdPttrn3;

      //  http://, https://로 url이 시작한다면.
      rplcdPttrn1 = /(\b(https?):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/gim;
      rplcdTxt = orgnTxt.replace(rplcdPttrn1, '<a href="$1" target="_blank">$1</a>');
      console.info('rplcdTxt : ', rplcdTxt);

      //  http?없이 www로 시작한다면.
      rplcdPttrn2 = /(^|[^\/])(www\.[\S]+(\b|$))/gim;
      rplcdTxt = rplcdTxt.replace(rplcdPttrn2, '$1<a href="http://$2" target="_blank">$2</a>');
      console.info('rplcdTxt : ', rplcdTxt);

      //  메일 주소일 경우
      rplcdPttrn3 = /(([a-zA-Z0-9\-\_\.])+@[a-zA-Z\_]+?(\.[a-zA-Z]{2,6})+)/gim;
      rplcdTxt = rplcdTxt.replace(rplcdPttrn3, '<a href="mailto:$1">$1</a>');
      console.info('rplcdTxt : ', rplcdTxt);

      return rplcdTxt;
    }
728x90
반응형

'Language > JavaScript' 카테고리의 다른 글

[javascript] HTML form to JSON object  (0) 2022.08.08
[JS] 페이지 리로드  (0) 2021.06.07
windows 10 NVM 과 nodejs 설치하기  (0) 2020.12.09
[JS] 날짜 비교  (0) 2020.11.11
[Modern JS] 동기 처리를 위한 Async Await  (0) 2020.06.14

Arrow Function

화살표 함수는 function 키워드 대신 => 를 사용하여 보다 간락한 방법으로 함수를 선언할 수 있다.

Arrow Function의 선언

  // 매개변수 지정 방법
  // 매개변수가 없을 경우
      () => { ... }
  // 매개변수가 한 개인 경우, 소괄호를 생략할 수 있다.
      x => { ... }
  // 매개변수가 여러 개인 경우, 소괄호를 생략할 수 없다.
  (x, y) => { ... }

  // 함수 몸체 지정 방법
  // single line block
  // 함수 몸체가 한줄의 구문이라면 중괄호를 생략할 수 있으며 암묵적으로 return된다.
  x => { return x * x }
  x => x * x

  //  객체를 반환하는 경우. 소괄호를 사용한다.
  () => { return { a: 1 }; }
  () => ({ a: 1 })

  // multi line block.
  () => {
    const x = 10;
    return x * x;
  };

Arrow Function과 callback

화살표 함수가 기존의 function키워드를 완전히 대신할 수는 없지만, callback 함수에서 사용하면 간결하게 사용 가능하다.

02.js

  const nums = [1, 2, 3, 4, 5,];

  const oddNums = nums.filter(n => n % 2);

  console.log(oddNums);

Arrow Function과 this

Arrow Function은 자신을 포함하는 외부 scope에서 this를 계승 받는다.

  function That() {
    this.name = 'ASDF';

    setTimeout(function () {
      console.log(this.name);
    }, 1000);

    setTimeout(() => {
      console.log(this.name);
    }, 1000);
  }

  That();
728x90
반응형

+ Recent posts