Generato函数，async函数，Proxy，初识nodejs

最新推荐文章于 2024-05-03 11:08:18 发布

xj1216wt

最新推荐文章于 2024-05-03 11:08:18 发布

阅读量40

点赞数

文章标签： javascript 前端 node.js

本文链接：https://blog.csdn.net/xj1216wt/article/details/134495269

版权

includes()

概念：数组是否包含指定值,查找到返回true否则false

<script>
var a = [1, 2, 3,NaN].includes(NaN);
console.log(a);
</script>

flat()

概念：嵌套数组转一维数组,Infinity

<script>
var a = [1,[2,[3,4,5],6,7],8,9].flat(Infinity);
console.log(a);
</script>

flatMap()

概念：先对数组中每个元素进行了的处理
参数1：遍历函数，该遍历函数可接受3个参数：当前元素、当前元素索引、原数组
参数2：指定遍历函数中 this 的指向

<script>
let obj = {
			do(n){
				return n*10;
			}
		}
		var a = [1,[2,[3,4,5],6,7],8,9].flat(Infinity).flatMap(function(item){
			return this.do(item);
		},obj);
		console.log(a);
</script>

class类

1.class 的本质是 function。
2.不可重复声明。
3.类定义不会被提升，这意味着，必须在访问前对类进行定义，否则就会报错。
4.类中方法不需要 function 关键字。
5.方法间不能加分号。
命名类
let Example = class Example{}
匿名类
let Examples = class{}

例子：
<script>
class Example{}	
		let Example = class Example{}
		class Example{
			constructor() {
			    console.log("你要调用我哦");
			}
</script>

super()特性在extends继承中

1.子类 constructor 方法中必须有 super ，且必须出现在 this 之前
2.调用父类构造函数,只能出现在子类的constructor构造函数
3.调用父类方法, super 作为对象，在普通方法中，指向父类的prototype原型对象，
在子类静态方法中拿取父类静态方法的值,在静态方法中，指向父类

<script>
class Child2 extends Father {
		    constructor(){
		        super();
		        console.log(this.test());
		    }
		    static test3(){
		        return super.test1()+2;
		    }
		}
		console.log(Child2.test3());
</script>

Generato

函数特性
可以通过 yield 关键字，把函数的执行流挂起，为改变执行流程提供了可能
Generator 有两个区分于普通函数的部分：
1.一是在 function 后面，函数名之前有个 * ；
2.函数内部有 yield 表达式。
3.其中 * 用来表示函数为 Generator 函数，yield 用来定义函数内部的状态。
next()调用

next()调用

	一般情况下，next 方法不传入参数的时候，yield 表达式的返回值是 undefined 。
	当 next 传入参数的时候，该参数会作为上一步yield的返回值。
	done表示函数是否执行完，true执行完，否则false
	value获取的是yield后面的值

return 方法
return 方法返回给定值，并结束遍历 Generator 函数。
return 方法提供参数时，返回该参数；不提供参数时，返回 undefined 。

<script>
	function* func(){
	console.log("one");
		var a = yield 1;
		console.log("two"+a);
		var b = yield 2;
		console.log("three"+b);
		yield 3;
		console.log("flor");
		return 4;
	}
	var f = func();
	console.log(f.next());
	console.log(f.next(10));
	var g = function* () {
	try {
	    yield;
	  } catch (e) {
	    console.log('catch inner', e);
	  }
	};
	var sum = g();
	sum.next();
	console.log(sum.next());
	console.log(sum.next());
	function* func() {
	  while (true) {
	        yield* callee();
	    }
	}
	var f = func();
	console.log(f.next());
</script>

“use strict”;开启严格模式

注意：严格模式下，set代理如果没有返回true，就会报错

Reflect.ownKeys()

返回对象所有的属性，不管属性是否可枚举，包括 Symbol

function* objectEntries(obj) {
		    const propKeys = Reflect.ownKeys(obj);
			console.log(propKeys);
		    for (const propKey of propKeys) {
		        yield [propKey, obj[propKey]];
		    }
		}

async函数中可能会有 await 表达式，async 函数执行时

如果遇到 await 就会先暂停执行，等到触发的异步操作完成后，
恢复 async 函数的执行并返回解析值。
await 关键字仅在 async function 中有效。
如果在 async function 函数体外使用 await ，你只会得到一个语法错误。
Promise 对象：await 会暂停执行，等待 Promise 对象 resolve，
然后恢复 async 函数的执行并返回解析值。
非 Promise 对象：直接返回对应的值

<script>
async function func(){
			return "调用我一下";
		}
		console.log(func());
		func().then((value)=>{
			console.log(value);
		})
		
		async function helloAsync(){
		   await testAwait();
		   console.log("1111111111");
		 }
		helloAsync();
		</script>

Proxy

可以对目标对象的读取、函数调用等操作进行拦截，然后进行操作处理。
它不直接操作对象，而是像代理模式，通过对象的代理对象进行操作，在进行这些操作时，可以添加一些需要的额外操作。
Reflect 可以用于获取目标对象的行为，它与 Object 类似，
但是更易读，为操作对象提供了一种更优雅的方式。它的方法与 Proxy 是对应的。
一个 Proxy 对象由两个部分组成： target 、 handler 。在通过 Proxy 构造函数生成实例对象时，需要提供这两个参数。
target 即目标对象， handler 是一个对象，声明了代理 target 的指定行为。

<script>
let target = {
			name:"张三",
			age:24,
		}
		let target = {};
		let handler = {
			get(target, propKey, receiver){
				console.log(target);
				console.log(propKey);
				console.log(receiver);
				return "hello"+target[propKey];
			},
			set(target, propKey, value, receiver){
				console.log(target);
				console.log(propKey);
				console.log(value);
				console.log(receiver);
				target[propKey] = value;
			}
		}
		let proxy = new Proxy(target,handler);
		console.log(proxy);
		console.log(proxy.name);
		proxy.name = "李四";
		console.log(proxy.name);
		proxy.age = 18;
		console.log(target);
		检测是否为整数
		console.log(!Number.isInteger(10.1));
		Object.defineProperty(target,"ids",{
			value:99
		})
		
		function sub(a, b){
			return this.a + a;
		    // return a - b;
		}
		let obj = {
			a:30
		}
		目标对象上下文，this指向
		let handler = {
		    apply(target, ctx, args){
				console.log(target);
				console.log(ctx);
				console.log(args);
				// console.log(Reflect.apply(...arguments));
		        return Reflect.apply(...arguments);
		    }
		}
		let proxy = new Proxy(sub, handler)
		// proxy(5, 1);
		
		console.log(proxy.apply(obj,[5,1]));
		function func(a,b){
			return a+this.a;
		}
		let thisArg = {
			a:50
		}
		let arr = [11,22];
		console.log(Reflect.apply(func,thisArg, arr));
		</script>

has用于拦截HasProperty 操作，即在判断 target 对象是否存在 propKey 属性时，会被这个方法拦截。

此方法不判断一个属性是对象自身的属性，还是继承的属性。
true说明存在，false不存在

let  handler = {
		    has(target, propKey){
				console.log(target);
				console.log(propKey);
				console.log(propKey in target);
		        return propKey in target;
		    }
		}
		let exam = {name: "Tom"}
		let proxy = new Proxy(exam, handler);
		console.log('name' in proxy);

construct(target, args)用于拦截 new 命令。返回值必须为对象

<script>
let handler = {
		    construct(target, args, newTarget) {
				console.log(Reflect.construct(target, [["dom"]]));
		        return Reflect.construct(target, args, newTarget)  
		    }
		}
		class Exam { 
		    constructor (name) {  
		        this.name = ["dom"]
		    }
		    </script>

delete obj.b; 可删除b 因为时直接对obj操作，忽略proxy的限制

初识node.js

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。
以前：后台—MVC+layui
现在：后台—Spring Boot/Spring code+vue
以前：前端—h5+c3+js+jq+bootstrip+PHP
现在：前端—h5+c3+es6+nodejs+element-UI+vue+微信小程序
执行方式一： ctrl+`打开控制台，cd切换到当前文件目录，node 文件名
执行方式二：查找到文件夹，在文件路径输入cmd，node 文件名
执行方式三：按住shift右键，打开powershell，node 文件名
执行方式四： window+r,输入cmd，cd切换到当前文件目录，node 文件名

D: 切换D盘目录
dir 查看当前目录的所有文件
cd 文件名进入下一级目录
cd … 返回上一级目录
cls 清除控制台记录
tab键可以快速生成执行的路径
使用 esc 键，能够快速清空当前已输入的命令
使用 ↑ 键，可以快速定位到上一次执行的命令
ctrl+左右键，可以快速定位到特殊字符前

 <script>
const fs = require("fs");
fs.readFile("./1.txt","utf-8",function(err,user){
    // console.log(err);
    if(err){
        return console.log("文件读取失败！"+err.message)
    }
    console.log(user);
});
fs.writeFile("./1.txt","要被逼死啦啦啦啦","utf-8",function(err){
console.log(err);
})
 </script>

path.join() 方法，用来将多个路径片段拼接成一个完整的路径字符串

path.basename() 方法，用来从路径字符串中，将文件名解析出来

path.extname() 方法，可以获取路径中的扩展名部分

 <script>
const path = require("path");
const patnName = path.join("http","www","baidu");
console.log(patnName);
const baseame = path.basename("1/index/ainem.html",".js");
console.log(baseame);
const exteame = path.extname("1/index/ainem.html",".html");
console.log(exteame);
 </script>