使用cocos2d-js制作游戏新手引导(二)

本文上接前我一篇博文《使用cocos2d-js制作游戏新手引导（一）》

一、定位器的实现

定位器的目的是实现对场景树中的节点精确定位，获取对象实例，从而获取节点在界面中的位置、矩形大小等信息。
定位器：在cocos2d（js）游戏引擎中用于精确描述场景树中的某一节点的字符串，其实现方式借鉴了css（层叠样式表）选择器设计思路，以下我们将实现一个简单的从定位器字符串解析到节点定位的整个过程。

1.定位符规则

在cocos2d中可以通过节点名字、节点tag值来表示一个节点，在js中还可以使用对象的变量名比如：this[‘_button’]来获取节点对象。 一共有三种有效方式来表示一个node节点对象，于是这里对应三种定位符号，如下：

“/” ：名字（name）定位符，例如： ‘a/b/c’ 、’dialogLayer/_closeButton’
“#”：tag（id）定位符，例如：’a#123’
“.”：变量名（var）定位符，例如：’a._okButton’

还有为了简化定位器字符串的长度，借鉴css中的子选择器

“>”：子（child）定位符，例如：’a>c’

2.定位器解析

定位器字符串中只存在名字、tag、变量名、定位符，其中由定位符将名字、tag、变量名隔开。在js中最简单的就是使用String.split函数将其分开，但这里分隔符（/、#、. 、>）不止一个符号如何实现呢？之前我是自己写的一个遍历函数来解析，但感觉有些丑陋。思考之后觉得split不应该不支持多个分隔符，于是搜索了下，发现果真不出我所料splite还支持正则表达示的分隔规则，代码由n行变成1行，非常满意，越来越喜欢上了js。

 > var locator = "a/b.c#1"
 > locator.split(/[.,//,>,#]/g);
 [ 'a', 'b', 'c', '1' ]

其实分隔符是用于修饰名字、tag、变量名的，一个定位符配合一个名字，于是设计一个简单的对象，如下：

{symbol: ‘/’, name:’a’}

代码如下

//使用正则表达示分隔名字
var names = str.split(/[.,//,>,#]/g);
var segments = names.map(function(name) {
   
    var index = str.indexOf(name);
    var symbol = str[index - 1] ||