1
2
3
4
5
6
7
8
9
10
11
function printMessage(message) {
	return function() {
		console.log(message);
	}
}

const printHello = printMessage("Hello");
printHello(); // Hello

const printHi = printMessage("Hi");
printHi(); // Hi

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
/* `handleException` 是一个高阶函数，它接受一个函数作为参数，在函数中添加异常处理功能 */
function handleException(funcAsParameter) {
	console.log("Inside handleException function")
	try {
		funcAsParameter()
	} catch(err) {
		console.log(err)
	}
}

function divideByZero() {
	result = 5 / 0
	if(!Number.isFinite(result)) {
		throw "Division by Zero not a good idea!!"
	}
	console.log("Result of division of 5 by zero is: " + result)
}

/**
 * 将 `divideByZero` 作为参数传递给 `handleException`，
 * 在 `handleException` 内部调用 `divideByZero` 函数并处理可能抛出的异常 
 */ 
handleException(divideByZero)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// 构造函数
function Human(firstName, lastName) {
	this.firstName = firstName;
	this.lastName = lastName;
}

// Human 函数创建的所有对象将共享 getFullName 函数
Human.prototype.getFullName = function() {
	return `${this.firstName} ${this.lastName}`;
}

var person1 = new Human("Virat", "Kohli");
var person2 = new Human("Rohit", "Sharma");

console.log(person1);

1
2
3
4
5
6
7
8
9
10
11
12
class Human {
	constructor(firstName, lastName) {
		this.firstName = firstName;
		this.lastName = lastName;
	}
	
	getFullName() {
		return `${this.firstName} ${this.lastName}`;
	}
}

typeof(Human); // function

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
// 这个装饰器函数接受一个函数作为参数
function log(functionAsParameter) {
	return function() {
		console.log("Execution of " + functionAsParameter.name + " begin");
		// 装饰器函数在内部调用传递的参数
		functionAsParameter();
		console.log("Execution of " + functionAsParameter.name + " end");
	}	
}

class Human {
	constructor(firstName, lastName) {
		this.firstName = firstName;
		this.lastName = lastName;
	}
	
	getFullName() {
		return `${this.firstName} ${this.lastName}`;
	}
}

var humanObj = new Human("Virat", "Kohli");

// Passing the class method getFullName to the log higher order function
var newGetFullNameFunc = log(humanObj.getFullName);
newGetFullNameFunc();

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
function log(classObj, functionAsParameter) {
	return function() {
		console.log("Execution of " + functionAsParameter.name + " begin");
		functionAsParameter.call(classObj);
		console.log("Execution of " + functionAsParameter.name + " end");
	}	
}

class Human2 {
	constructor(firstName, lastName) {
		this.firstName = firstName;
		this.lastName = lastName;
	}
	
	getFullName() {
		return `${this.firstName} ${this.lastName}`;
	}
}

var humanObj = new Human2("Virat", "Kohli");
var newGetFullNameFunc = log(humanObj, humanObj.getFullName);
newGetFullNameFunc();

1
2
3
4
5
6
7
const humanObj = {
	'firstName': 'Virat',
	'lastName': 'Kohli',
	'getFullName': () => {
		return `${this.firstName} ${this.lastName}`;
	}
}

1
2
3
4
5
6
7
8
9
10
Object.getOwnPropertyDescriptor(humanObj, 'firstName');
/* 
Output:
{
	value: "Virat", 
	writable: true, 
	enumerable: true, 
	configurable: true
} 
*/

1
2
3
4
5
6
7
8
9
10
11
Object.defineProperty(humanObj, 'age', {value: 10});
Object.getOwnPropertyDescriptor(humanObj, 'age');
/* 
Output:
{
	value: 10, 
	writable: true, 
	enumerable: true, 
	configurable: true
} 
*/

1
2
3
4
5
6
Object.defineProperty(humanObj, 'firstName', {value: "Rohit"});
console.log(humanObj);
/*
Output
	{firstName: "Rohit", lastName: "Kohli"}
*/

1
Object.defineProperty(humanObj, 'firstName', {writable: false});

1
2
3
4
5
6
humanObj.firstName = 'Virat';
console.log(humanObj);
/*
Output
	{firstName: "Rohit", lastName: "Kohli"}
*/

1
2
3
4
5
6
7
8
// Decorator function
function decoratorFunc(target, property, descriptor) {}

class DecoEx {
    // Syntax for adding decorator
    @decoratorFunc
    getFullName() {}
}

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
38
39
40
41
// 装饰器函数
function readonlyDecorator(target, property, descriptor) {
    console.log("Target: " );
    console.log(target);
    
    console.log("\nProperty name");
    console.log(property);
    
    console.log("\nDescriptor property");
    console.log(descriptor);
    
    // 将被装饰的函数设置为只读
    descriptor.writable = false;
    // 这个属性描述符会覆盖 getFullName 方法的描述符
    return descriptor;
}

class Human {
	constructor(firstName, lastName) {
		this.firstName = firstName;
		this.lastName = lastName;
	}
	
	// 装饰器语法
	@readonlyDecorator
	getFullName() {
		return `${this.firstName} ${this.lastName}`;
	}
}

humanObj = new Human("Virat", "Kohli");

console.log("\ngetFullName property value");
console.log(humanObj.getFullName);

// 修改 getFullName 的值
humanObj.getFullName = "Hello";

// 由于 getFullName 是只读的，这里打印的值还是 “Hello”
console.log("\nAfter changing getFullName value");
console.log(humanObj.getFullName);

1
2
3
4
5
6
7
8
9
// 获取 `getFullName` 函数的属性描述符
funcDescriptor = Object.getOwnPropertyDescriptor(humanObj, 'getFullName');

// 将 funcDescriptor 作为参数传递并调用 readonlyDecorator
// readonlyDecorator 修改 `getFullName` 函数并返回修改后的 `getFullName` 定义的描述符
descriptor = readonlyDecorator(Human.prototype, 'getFullName', funcDescriptor);

// JavaScript 通过 readonlyDecorator 返回新的 `getFullName` 属性描述符
Object.defineProperty(Human.prototype, 'getFullName', descriptor);

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
38
39
40
41
42
43
44
45
46
47
48
function log(message) {
  function actualLogDecorator(target, property, descriptor) {
    console.log("\ngetFullName descriptor's value property");
    console.log(descriptor.value);

    const actualFunction = descriptor.value;

    const decoratorFunc = function() {
      console.log(message);
      // 调用 HumanObj 对象上的 getFullName 函数
      return actualFunction.call(this);
    }

    // 用 decoratorFunc 覆盖 getFullName 函数
    descriptor.value = decoratorFunc;

	console.log("\nNew descriptor's value property due to decorator");
    console.log(descriptor.value);

    // 这个属性描述符将覆盖 getFullName 属性描述符的 value 属性
    return descriptor
  }

  return actualLogDecorator;
}

class Human {
  constructor(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
  }

  @log("Logging by decorator")
  getFullName() {
    return `${this.firstName} ${this.lastName}`;
  }
}

humanObj = new Human("Virat", "Kohli");

console.log("\ngetFullName's descriptor's value property after modification due to decorator");

// Human.prototype 上定义了类方法
descriptorObject = Object.getOwnPropertyDescriptor(Human.prototype, 'getFullName');
console.log(descriptorObject.value);

console.log("\nOutput for getFullName method");
console.log(humanObj.getFullName());

1
2
3
4
5
6
7
8
var funcDescriptor = Object.getOwnPropertyDescriptor(humanObj, 'getFullName');

// JavaScript 调用装饰器函数，log 函数返回分配给执行器的实际 logDecorator。
// 因此 actualDecorator 是一个在 getFullName 上的具有日志功能的函数
var actualDecorator = log("This is done using decorators"); // 这里返回一个函数

descriptor = actualDecorator(Human.prototype, 'getFullName', funcDescriptor);
Object.defineProperty(Human.prototype, 'getFullName', descriptor);

1
2
3
4
5
6
7
8
9
10
11
12
@decFunc
class Foo {
}

// 等同于

function Foo(FooClass) {
}

NewFoo = decFunc(Foo) || Foo;

Foo = NewFoo;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
function newConstructor(HumanClass) {
	const newConstructorFunc = function(firstName, lastName, age) {
		this.firstName = firstName;
		this.lastName = lastName;
		this.age = age;
	}

	return  newConstructorFunc;
} 

@newConstructor
class Human {
	constructor(firstName, lastName) {
		this.firstName = firstName;
		this.lastName = lastName;
	}
}

const person1 = new Human("Virat", "Kohli", 31);
console.log( person1 );

// 打印修改后的构造函数
console.log( Human.prototype.constructor );
console.log(person1.__proto__.constructor);

1
2
3
4
5
6
7
8
9
function newConstructor(HumanClass) {
	return class NewClass {
		constructor(firstName, lastName, age) {
			this.firstName = firstName;
			this.lastName = lastName;
			this.age = age;
		}
	}
}