码迷,mamicode.com
首页 > 编程语言 > 详细

javascript与php模板引擎实现原理

时间:2018-04-17 11:53:39      阅读:132      评论:0      收藏:0      [点我收藏+]

标签:javascript与php模板引擎实现

一、简单替换:
  1. javascript:
    a. 代码:
    var data = {
        ‘name‘:‘lee‘,
        ‘place‘:‘wuhan‘
    }
    var str = "Hello {{name}}, Welcome to {{place}}!";
    var res = str.replace(
            /{{([\s\S]+?)}}/g,
            function(param1,param2){
                var index = param2
                return data[index]
            }
        );
    console.log(res)

    b. 输出:

    Hello lee, Welcome to wuhan!
  2. php:
    a. 代码:
    <?php
    $data = array(
        ‘name‘=>‘lee‘,
        ‘place‘=>‘wuhan‘
    );
    $str = "Hello {{name}}, Welcome to {{place}}!";
    $res = preg_replace_callback(
            "/{{([\s\S]+?)}}/",
            function($param) use($data){
                $index = $param[1];
                return $data[$index];
            },
            $str
        );
    echo $res;

    b. 输出:

    Hello lee, Welcome to wuhan!

    二、复杂替换:

  3. javascript:
    a. 代码:
    var data = {
    ‘name‘:‘lee‘,
    ‘place‘:‘wuhan‘
    }
    var str = "Hello {{data.name}}, Welcome to {{data.place}}!";
    var res = str.replace(
        /{{([\s\S]+?)}}/g,
        function(param1,param2){
            var ret = eval(param2)
            return ret
        }
    );
    console.log(res)

    b. 输出:

    Hello lee, Welcome to wuhan!
  4. php:
    a. 代码:
    <?php
    $data = array(
        ‘name‘=>‘lee‘,
        ‘place‘=>‘wuhan‘
    );
    $str = "Hello {{data.name}}, Welcome to {{data.place}}!";
    $res = preg_replace_callback(
            "/{{([\s\S]+?)}}/",
            function($param) use($data){
                $raw = $param[1];
                $arr = explode(‘.‘,$raw);
                $command = ‘return ‘.‘$‘.$arr[0].‘[\‘‘.$arr[1].‘\‘];‘;
                $ret = eval($command);
                return $ret;
            },
            $str
        );
    echo $res;

    b. 输出:

    Hello lee, Welcome to wuhan!

javascript与php模板引擎实现原理

标签:javascript与php模板引擎实现

原文地址:http://blog.51cto.com/12173069/2104231

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!