JavaScript学习笔记014-this指向0Iterator0Generator
JavaScript学习笔记014-this指向0Iterator0Generator
Mr. 柳上原
发布于 2018-09-05 15:22:23
发布于 2018-09-05 15:22:23
Author：Mr.柳上原
- 付出不亚于任何的努力
- 愿我们所有的努力，都不会被生活辜负
- 不忘初心，方得始终
在微信公众号看到一篇文章
感触很深
《在公司里，千万不要骂20多岁的小年轻，因为他们一不爽就不来了》
《但是你们可以使劲骂30岁以后还拿5000左右工资的油腻中年人，因为他们不敢辞职》
或许很残酷
社会真的是这样
说什么------浪子回头金不换，学习永远来得及，什么时候改好都不算晚.....
这些都是假的
社会没那么多时间会给你去改正
一步跟不上
只有被淘汰
你唯一能做的
就是每天都要进步
每天都要学习
每天都比昨天的自己好
这样
或许能有一丝机会
不会被后来者取代
这就是社会
<!DOCTYPE html> <!-- 文档类型：标准html文档 -->
<html lang='en'> <!-- html根标签 翻译文字：英文 -->
<head> <!-- 网页头部 -->
<meat charset='UTF-8'/> <!-- 网页字符编码 -->
<meat name='Keywords' content='关键词1,关键词2'/>
<meat name='Description' content='网站说明'/>
<meat name='Author' content='作者'/>
<title>前端59期学员作业</title> <!-- 网页标题 -->
<link rel='stylesheet' type='text/css' href='css/css1.css'/> <!-- 外链样式表 -->
<style type='text/css'> /*内部样式表*/
</style>
</head>
<body> <!-- 网页主干：可视化区域 -->
<script>
/*
函数的this指向：看函数的调用，谁调用就指向谁
主动执行调用函数：
call // call传递的实参是一个个值
apply // apply传递的实参是一个数组
不主动执行调用函数：
bind // 不兼容低版本IE
第一个参数为修改的this指向的对象，函数的实参依次写在第一个参数的后面
*/
var a = 1;
var obj = {
a: 2
}
function fn(a, b, c){
console.log(this.a);
}
fn.call(obj, 1, 2, 3); // this指向变为obj
fn.apply(obj, [1, 2, 3]); // this指向变为obj
fn.bind(obj, 1, 2, 3)( ); // this指向变成obj
document.onclick = fn.bind(obj, 1, 2, 3); // 右边不主动执行
// 定时器传参
setTimeout(fn.bind(null, 1, 2, 3), 1000); // 不需要指向时，可以null
setTimeout("fn(1, 2, 3)", 1000); // 第二种传参方法，字符串不会主动执行
setTimeout("fn.call(null, 1, 2, 3)", 1000); // 需要修改指向时
// 函数的this指向
Function.prototype.bind = function (){
console.log(this); // this指向调用它的函数
return function (){
fn();
};
}
function fn(){ };
fn.bind(); // fn调用bind
fn.bind()(); // 执行的是return出来的匿名函数，匿名函数里的fu自执行，看起来如同fn执行
// 类数组转数组
function (){
Array.prototype.slice.call(arguments);
}
fn(1, 2, 3, 4, 5, 6, 7);
/*
iterator：一种接口，用于遍历数据结构
具备iterator接口的对象：
能被 for of
能被 ...
原生具备iterator接口的数据结构：
Array
Map
Set
String
函数的arguments对象
NodeList对象
*/
// 遍历流程
let arr =["a", "b", "c"];
let iter = arr[Symbol.iterator]( );
iter.next( ) // {value: "a", done: false}
iter.next( ) // {value: "b", done: false}
iter.next( ) // {value: "c", done: false}
iter.next( ) // {value: undefined, done: true}
// 原生实现iterator
function myIter(arr){
let i = 0;
return {
next( ){
let done = (i >= arr.length);
let value = !done ? arr[i++] : undefined;
return {
value,
done,
}
}
}
}
/*
generator：惰性函数
必须用iterator接口调用
调用一次，返回一次yield的值
*/
// generator的写法
function* fn( ){ // 一次执行可以返回多个值，有多少个yield就可以返回几个值
yield console.log(1); // 暂停
yield console.log(2);
return console.log(3);
}
let iter = fn( );
iter.next( ); // 1
iter.next( ); // 2
iter.next( ); // 3
// for of输出
for(let key of iter){ } // 1, 2, 3
// generator的注意
function* foo(x){
var y = 2 * (yield (x + 1)); // yield返回值后默认变成undefined
var z = yield (y / 3);
return (x + y + z);
}
var a = foo(5);
a.next( ); // 6
a.next( ); // NaN
a.next( ); // NaN
var b = foo(5);
b.next( ); // 6
b.next(6); // 4
b.next(4); // 21
// generator函数调用
function* foo(){
yield 1;
yield 2;
}
function* too(){
yield 3;
yield 4;
yield* foo( ); // 同类型generator函数调用方法
}
for (let key of too){
console.log(key); // 3, 1, 2, 4
}
</script>
</body>
</html>本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2018.08.20 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读