源码
//JavaScript 写法
//声明一个对象
// let people = {
// //给对象增加一个 name 属性 值为一个数组
// name:['xiaochuan','xiaoming','xiaohong'],
// //给对象增加一个 获取名字的方法
// getName:function(){
// //这里需要得到的名字的随机的
// return function(){
// //声明一个 i 接收一个 0 ~ 4 随机的
// //Math.floor floor() 方法可对一个数进行下舍入。 http://www.w3school.com.cn/jsref/jsref_floor.asp
// //Math.random random() 方法可返回介于 0 ~ 1 之间的一个随机数。 http://www.w3school.com.cn/jsref/jsref_random.asp
// var i = Math.floor(Math.random()*4);
// //将结果作为一个对象返回
// return {
// // n:this//测试输出为 [object Window]
// n:this.name[i]//测试输出为 undefined 因为此时的 this 指向的是 window
// }
// }
// }
// };
// //声明一个接受返回函数的变量
// let MyName = people.getName();
// //输出结果
// alert("名字：" + MyName().n);//这里输出的是 undefined 因为此时的 this 指向的是 window
//使用 lambads 和 this 关键字修复上面出现的问题
//实际上这个 lambads 就是 ES6 中的 =>
let people = {
//给对象增加一个 name 属性 值为一个数组
name:['xiaochuan','xiaoming','xiaohong','xiaoheng'],
//给对象增加一个 获取名字的方法
getName:function(){
//这里需要得到的名字的随机的
//箭头函数的实现原理：除了简洁之外，箭头函数还有另外一个优点，就是函数体内的this的指向始终是指向定义它所在的对象，而不会指向调用它的对象，我们知道es5中的函数是谁执行它，它就指向谁，所以这里指向的是 people 这个对象
return ()=>{
//声明一个 i 接收一个 0 ~ 4 随机的
//Math.floor floor() 方法可对一个数进行下舍入。 http://www.w3school.com.cn/jsref/jsref_floor.asp
//Math.random random() 方法可返回介于 0 ~ 1 之间的一个随机数。 http://www.w3school.com.cn/jsref/jsref_random.asp
var i = Math.floor(Math.random()*3);
console.log(i);
//将结果作为一个对象返回
return {
// n:this//测试输出为 [object object] 其实指向的是 people
n:this.name[i]//测试输出为正确的随机出来的名字了
}
}
}
};
//声明一个接受返回函数的变量
let MyName = people.getName();
//在控制台打印结果
console.log("名字：" + MyName().n);//现在这里就输出了正确的随机出来的名字了
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>TypeScript 函数- lambads(实际上这个 lambads 就是 ES6 中的 =>) 和 this 关键字的使用</title>
</head>
<body>
<script type="text/javascript" src="Functions.js"></script>
</body>
</html>
