javascript设计模式之解释器模式详解(3)

if (!pEle) {
                // 说明现在获取的是根元素
                context.setPreEle(context.getDocument().documentElement);
            } else {
                // 根据父级元素和要查找的元素的名称来获取当前的元素
                var nowEle = context.getNowEle(pEle, this.eleName);
                // 把当前获取的元素放到上下文中
                context.setPreEle(nowEle);
            }

var ss;
            // 循环调用子元素的interpret方法
            for (var i = 0, len = this.eles.length; i < len; i++) {
                ss = this.eles[i].interpret(context);
            }

// 返回最后一个解释器的解释结果，一般最后一个解释器就是终结符解释器了
            return ss;
        }
    };

/**
     * 元素作为终结符对应的解释器
     * @param {String} name [元素的名称]
     */
    function ElementTerminalExpression(name) {
        this.eleName = name;
    }

ElementTerminalExpression.prototype = {
        interpret: function (context) {
            var pEle = context.getPreEle();
            var ele = null;
            if (!pEle) {
                ele = context.getDocument().documentElement;
            } else {
                ele = context.getNowEle(pEle, this.eleName);
                context.setPreEle(ele);
            }

// 获取元素的值
            return ele.firstChild.nodeValue;
        }
    };

/**
     * 属性作为终结符对应的解释器
     * @param {String} propName [属性的名称]
     */
    function PropertyTerminalExpression(propName) {
        this.propName = propName;
    }

PropertyTerminalExpression.prototype = {
        interpret: function (context) {
            // 直接获取最后的元素属性的值
            return context.getPreEle().getAttribute(this.propName);
        }
    };

先来看看如何使用解释器获取单个元素的值：

复制代码 代码如下:

void function () {
    var c = new Context();
    // 想要获取多个d元素的值，也就是如下表达式的值：“root/a/b/c”
    // 首先要构建解释器的抽象语法树
    var root = new ElementExpression('root');
    var aEle = new ElementExpression('a');
    var bEle = new ElementExpression('b');
    var cEle = new ElementTerminalExpression('c');

// 组合
    root.addEle(aEle);
    aEle.addEle(bEle);
    bEle.addEle(cEle);

console.log('c的值是 = ' + root.interpret(c));

}();

输出： c的值是 = 12345

然后我们再用上面代码获取单个元素的属性的值：

复制代码 代码如下: