发表于 | 更新于

angular 指令匹配

angular 官网自定义指令提到了如下信息：

AngularJS normalizes an element’s tag and attribute name to determine which elements match which directives. We typically refer to directives by their case-sensitive camelCase normalized name (e.g. ngModel). However, since HTML is case-insensitive, we refer to directives in the DOM by lower-case forms, typically using dash-delimited attributes on DOM elements (e.g. ng-model).

The normalization process is as follows:

Strip x- and data- from the front of the element/attributes.
Convert the :, -, or _-delimited name to camelCase.

意思就是跳过x-和data-,然后 把:,-,_这种分隔字符 做驼峰处理。比如下面就比配ngBind指令

1
2
3
4
5
<span ng-bind="name"></span> <br/>
<span ng:bind="name"></span> <br/>
<span ng_bind="name"></span> <br/>
<span data-ng-bind="name"></span> <br/>
<span x-ng-bind="name"></span> <br/>

angular内部源码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

var SPECIAL_CHARS_REGEXP = /([\:\-\_]+(.))/g;

/**
 * Converts snake_case to camelCase.
 * Also there is special case for Moz prefix starting with upper case letter.
 * @param name Name to normalize
 *骆驼 https://my.oschina.net/yongqing/blog/300313
 */
function camelCase(name) {
  return name.
    replace(SPECIAL_CHARS_REGEXP, function(_, separator, letter, offset) {
      return offset ? letter.toUpperCase() : letter;
    }).
    replace(MOZ_HACK_REGEXP, 'Moz$1');
}

//非获取匹配，匹配pattern但不获取匹配结果，不进行存储供以后使用。这在使用或字符“(|)”来组合一个模式的各个部分时很有用。
//例如“industr(?:y|ies)”就是一个比“industry|industries”更简略的表达式。
var PREFIX_REGEXP = /^((?:x|data)[\:\-_])/i;
//http://www.cnblogs.com/whitewolf/p/3495822.html
/**
 * Converts all accepted directives format into proper directive name.
 * @param name Name to normalize
 */
function directiveNormalize(name) {
  return camelCase(name.replace(PREFIX_REGEXP, ''));
}

发表于 | 更新于

看到面试分享：一年经验初探阿里巴巴前端社招 这篇文章，学习到了很多，也发现了自己其实有很多不知道，所以记录下。。

数组去重

博主提到了这些方法：

1
2
3
4
5
6
7
///ES6实现：
[...new Set([1,2,3,1,'a',1,'a'])]

///ES5实现：
[1,2,3,1,'a',1,'a'].filter(function(ele,index,array){
    return index===array.indexOf(ele)
})

然后有人回复说用Map,我查了下，应该是这种方式：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
Array.prototype.unique = function () {
        var arr = [];
        var map = new Map();
        for(var i = 0; i < this.length; i++){
            if(!map.has(this[i])){
                arr.push(this[i]);
                map.set(this[i],true)
            }
        }
        return arr;
    };

    Array.prototype.unique2 = function () {
        var arr = [];
        var set = new Set(this);
        set.forEach(function (item) {
            arr.push(item);
        });
        return arr;
    };

二分查找时间复杂度分析

博主在二分查找的时间复杂度怎么求，是多少 问题上 没回答上来，我看的时候也忘记了，遂查了下：

二分查找的基本思想是将n个元素分成大致相等的两部分，去a[n/2]与x做比较，如果x=a[n/2],则找到x,算法中止；如果x<a[n/2],则只要在数组a的左半部分继续搜索x,如果x>a[n/2],则只要在数组a的右半部搜索x.

时间复杂度无非就是while循环的次数！

总共有n个元素，

渐渐跟下去就是n,n/2,n/4,….n/2^k，其中k就是循环的次数

由于你n/2^k取整后>=1

即令n/2^k=1

可得k=log2n,（是以2为底，n的对数）

参考资料：
二分查找时间复杂度的计算(转)
二分查找时间复杂度分析
理解O(log2N)和O(Nlog2N)

发表于 | 更新于

scalatra隐式request

在之前scala之隐式servletContext这篇文章中，我们提到了scalatra实现的隐式servletContext是如何实现的，那今天我们来看看在scalatra中是如何利用scala的特性来实现隐式HttpServletRequest的：

ScalatraBase

在ScalatraBase这个伴生对象中，我们可以看到如下代码：

1
2
3
4
5
6
7
8
private[this] val KeyPrefix: String = classOf[FutureSupport].getName
val Callbacks: String = s"$KeyPrefix.callbacks"

def addCallback(callback: Try[Any] => Unit)(implicit request: HttpServletRequest): Unit = {
  //http://johnwonder.github.io/2017/03/25/scala-implicit1/
  //放入AttributesMap中
  request(Callbacks) = callback :: callbacks
}

ServletApiImplicits

这边的request(Callbacks)到底是啥呢？我们来结合scala的隐式调用来分析

ScalatraBase中引入了ServletApiImplicits

1
import org.scalatra.servlet.ServletApiImplicits._
1
2
3
4
5
6
//隐式的ServletApi
trait ServletApiImplicits {

  implicit def enrichRequest(request: HttpServletRequest): RichRequest =
  RichRequest(request)
}

那说明实现是在RichRequest中

RichRequest

1
2
case class RichRequest(r: HttpServletRequest) extends AttributesMap {
}

我们看到它还实现了AttributesMap这个trait

AttributesMap

1
2
3
4
5
6
7
8
9

/**
*映射ServletRequest的属性到map
* Adapts attributes from servlet objects (e.g., ServletRequest, HttpSession,
* ServletContext) to a mutable map.
*/
trait AttributesMap extends Map[String, Any] with MutableMapWithIndifferentAccess[Any] {

}

我们看到他最终是继承自Map的，所以request()是Map调用。

发表于 | 更新于

templateSettings

今天在看lodash的typescript定义文件时，发现有这么一处定义：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
declare namespace _ {
     interface LoDashStatic {

     }

     /**
  * By default, the template delimiters used by Lo-Dash are similar to those in embedded Ruby
  *默认像ruby里的嵌入式
  * (ERB). Change the following template settings to use alternative delimiters.
  **/
  interface TemplateSettings {
      /**
      * The "escape" delimiter.
      **/
      escape?: RegExp;

      /**
      * The "evaluate" delimiter.
      **/
      evaluate?: RegExp;

      /**
      * An object to import into the template as local variables.
      **/
      imports?: Dictionary<any>;

      /**
      * The "interpolate" delimiter.
      **/
      interpolate?: RegExp;

      /**
      * Used to reference the data object in the template text.
      **/
      variable?: string;
  }
}

我们看到lodash的官网上有这么一处举例：

`js // using custom template delimiters(分隔符) _.templateSettings.interpolate = /undefined/g; var compiled = _.template('hello !'); compiled({ 'user': 'mustache' }); // => 'hello mustache!'

发表于 | 更新于

typescript声明文件

今天在看lodash的声明文件，看到下面这一段有点疑问：

1
2
3
4
5
declare var _: _.LoDashStatic;

declare namespace _ {

}

如果我在namespace里导出一个function,如下：

1
2
3
declare namespace _ {
  export function test():void;
}

那vscode会提示错误Duplicate identifier,我们回到TypeScript官网文档看下：

与类型相比，你可能已经理解了什么是值。 值是运行时名字，可以在表达式里引用。 比如 let x = 5;创建一个名为x的值。

同样，以下方式能够创建值：

let，const，和var声明
包含值的namespace或module声明
enum声明
class声明
指向值的import声明
function声明

只要不产生冲突就是合法的。 一个普通的规则是值总是会和同名的其它值产生冲突除非它们在不同命名空间里。

也就是说值冲突了，但是如果我把declare var 换成declare class 那就是可以的

1
2
3
4
5
6
7
declare namespace _ {
  export function test():void;
}

declare class _ {

}

typescript官网是这么说的：

1
Note that in this example, we added a value to the static side of C (its constructor function). This is because we added a value, and the container for all values is another value (types are contained by namespaces, and namespaces are contained by other namespaces).
0%