简单谈谈Javascript高级特性

1. 闭包

1.1 什么是闭包

闭包是指有权访问另一个函数作用域中变量的函数，常用来创建私有变量和方法，还可以用来实现函数柯里化等。

1.2 闭包的使用场景

1.2.1 创建私有变量和方法

function counter() {
  var count = 0;

  return {
    increment: function() {
      count++;
      console.log(count);
    },
    reset: function() {
      count = 0;
      console.log(count);
    }
  }
}

var c = counter();
c.increment(); // 1
c.increment(); // 2
c.reset(); // 0

1.2.2 实现函数柯里化

function add(x) {
  return function(y) {
    return x + y;
  }
}

var increment = add(1);
console.log(increment(2)); // 3
console.log(increment(3)); // 4

1.3 闭包的优缺点

1.3.1 优点

• 创建私有变量和方法
• 实现函数柯里化

1.3.2 缺点

• 内存泄漏：如果闭包长期持有一些变量的时候，这些变量的内存就无法被释放

2. 原型链

2.1 什么是原型链

原型链是Javascript中的一个重要概念，每一个对象都有一个原型对象，通过原型对象可以实现继承。

2.2 原型链的使用场景

2.2.1 继承

function Animal(name) {
  this.name = name;
}

Animal.prototype.sayName = function() {
  console.log('My name is ' + this.name);
}

function Cat(name) {

}

Cat.prototype = new Animal();

var cat = new Cat('Kitty');
cat.sayName(); // My name is Kitty

2.2.2 扩展原型对象

String.prototype.startsWith = function(str) {
  return this.indexOf(str) === 0;
}

console.log('Hello world'.startsWith('Hello')); // true
console.log('Hello world'.startsWith('World')); // false

2.3 原型链的优缺点

2.3.1 优点

• 实现继承
• 扩展原型对象

2.3.2 缺点

• 由于原型链中所有对象共享同一个实例，如果修改了该实例，所有对象都会受到影响
• 在创建继承关系时，会创建多个实例，造成内存浪费

3. 事件委托

3.1 什么是事件委托

事件委托是指将事件处理程序添加到父元素上，根据触发事件的目标元素来判断被点击的是哪个子元素。

3.2 事件委托的使用场景

3.2.1 提高性能

<ul id="list">
  <li>item1</li>
  <li>item2</li>
  <li>item3</li>
  ……
  <li>itemn</li>
</ul>

如果每个li上都添加一个事件监听器，总的事件监听器的个数将是n，可能会导致性能问题。

document.querySelector('#list').addEventListener('click', function(e) {
  if (e.target.tagName === 'LI') {
    console.log(e.target.textContent);
  }
});

3.2.2 动态元素

如果有一些元素是通过js动态添加的，那么需要使用事件委托绑定事件。

var li = document.createElement('li');
li.textContent = 'item4';
document.querySelector('#list').appendChild(li);

3.3 事件委托的优缺点

3.3.1 优点

• 提高性能
• 能够处理动态元素

3.3.2 缺点

• 只能绑定一种事件，如果要绑定多个事件，需要添加多个处理函数

以上是Javascript高级特性的简单介绍，希望对你有所帮助。