정규 표현 식 ES6 문자열 템 플 릿 기능 구현

선언:
아침 에 지하철 에서 정규 로 ES6 문자열 템 플 릿 을 실현 한 다 는 글 을 봤 는데 디 테 일 을 보지 않 고 호기심 이 생 겼 어 요. 저도 실현 해 볼 게 요.
ES6 템 플 릿 문자열

문법: { lover } 현재 상하 변수 lover 의 값 을 자동 으로 읽 고 채 웁 니 다

맞 춤 법 문자열 로 인 한 번 거 로 움 과 오 류 를 줄 이 는 데 상당히 편리 합 니 다. 특히 DOM 작업 innerHTML 에서

시작 하 다
문자열 " ${ me }， ${ lover },${ lover } ." 의 자리 표시 자 를 변수 로 대체 합 니 다.

function template(string){
    let reg = /\${([^{}]*)}/g;
    return string.replace(reg,function(match,p1){
        let variable = p1.trim();
        if(variable === ""){
            //    
            return "";
        }else if(!/^[a-zA-Z_$]+[\w$]*$/.test(variable)){
            //         。      ,          
            throw ("Unexpected token "+ variable )
        }else{
            //     eval             
            return eval(variable)
        }
    })
}

//    
var me = "hezebing";
var lover = "wangyanyan";
template("  ${ me }，   ${ lover }");//"  hezebing，   wangyanyan"

//    
template("  ${ _me }，   ${ lover }");//_me is not defined
template("  ${ +me }，   ${ lover }");//Unexpected token +me

ok 운행 완벽.

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

Chrome Extension 2 편 -- 통신

메모: 만약 여러 페이지 가 onMessage 사건 을 감청 한다 면, 어떤 사건 에 대해 서 는 sendResponse () 를 처음 호출 하 는 것 만 성공 적 으로 응답 할 수 있 고, 모든 다른 응답 은 무 ...

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

정규 표현 식 ES6 문자열 템 플 릿 기능 구현

좋은 웹페이지 즐겨찾기