ECMAScript 6 入门学习日志&笔记 2024/8/6 13:59

就读书籍:

ECMAScript 6 入门

作者：阮一峰https://www.ruanyifeng.com/

个人理解笔记

{ } 块级函数不能先用后声明 Let 优先函数表达

不可重复声明同一变量

{

let=function (){ }

}

不谈其他,只要在{ } 中即可 ,简单暴力理解

const 和 let 类似 ,指向对象 ,

简单理解:指向房子可以加家具不能换房

// 冻结对象 Object.freeze(obj); 把房子(obj)门关上

`constantize(obj) 把房子里的所有门都关上 null 不注明会报错还要检测是不是门`

`Object.keys(obj) 返回房子内部的物件名字`

obj[ `Object.keys(obj)` ] 通过名字找到具体物品

函数的作用是确保一个对象及其所有嵌套的对象都被冻结，从而实现深层的不可变性。

变量声明方法

六种: let var import class const function

顶层变量: var function

++浏览器里面，顶层对象是`window`， Node 和 Web Worker 无 `window`。++

++浏览器和 Web Worker 里面，`self`指向顶层对象， Node 无`self`。++

++Node 里面，顶层对象是`global`，其他环境不支持。++

CSP 内容安全策略 eval、new Function 方法可能无法使用

解构赋值: 用于数组 [ ] and 对象 { } 键必须相同键类似索引

写法: 模式匹配两边模式相同

不是可遍历的结构 let [a,b,c] =1 错误

实用技巧

将现有对象的方法，赋值到某个变量。

VS好用的一个插件:A-super-comprehensive

古怪赋值方式 ( )内部包裹{ } 解构语法合法 ( ) 防止 { } 被默认为块

复制代码

({} = [true, false]);
({} = 'abc');
({} = []);

解构赋值的规则是，只要等号右边的值不是对象或数组，就先将其转为对象。

解构用途

//用途一交换值

let x=1,y=2;
$x,y\]=\[y,x\]; console.log(x,y); //用途二函数返回多个值 function f(){ return \[1,2\]; } console.log(f()); let \[a,b\]=f(); //解构赋值 console.log(a,b); //对象的解构赋值 function f1(){ return { name:"网络", ago:25 } } let {name,ago}=f1();//解构赋值 console.log(name,ago); let {log}=console;//函数的解构赋值 //用途三函数参数定义 //有序 function f2(\[h,v,n\]){log(\`Received: h=${h}, v=${v}, n=${n}\`);} f2(\[1,2,3\]); //无序 function f3({n,v,h}){log(\`Received: h=${h}, v=${v}, n=${n}\`);} f3({h:1,n:2,v:3}); //提取json数据 let jsonData={ id:1, namea:"网络", age:25 } let {id,namea,age}=jsonData; log(\`id=${id},name=${name},age=${age}\`);$

旧方法提取 JSON

const jsonString = '{"name": "John", "age": 30, "city": "New York"}';

const jsonObject = JSON.parse(jsonString);

// 访问对象属性

console.log(jsonObject.name);

// 输出:

John console.log(jsonObject['age']);

// 输出: 30

console.log(jsonObject.city);

用解构

const jsonString = '{"name": "John", "age": 30, "city": "New York"}';// JSON字符串

let {name,John,age,city}= JSON.parse(jsonString);// 解析JSON字符串

console.log(name,John,age,city);// 打印结果

const 也是可以的
const jsonString = '{"name": "John", "age": 30, "city": "New York"}';// JSON字符串

const {name,John,age,city}= JSON.parse(jsonString);// 解析JSON字符串

console.log(name,John,age,city);// 打印结果

用法五函数参数的默认值

复制代码

// 定义一个简化版的 jQuery.ajax 方法
jQuery.ajax = function (url, {
    // 默认配置项
    async = true,          // 是否异步，默认为 true
    beforeSend = function () {},  // 发送请求前的回调函数，默认为空函数
    cache = true,          // 是否启用缓存，默认为 true
    complete = function () {},  // 请求完成后的回调函数，默认为空函数
    crossDomain = false,   // 是否允许跨域，默认为 false
    global = true,         // 是否触发全局 AJAX 事件，默认为 true
    // ... 更多配置项
  } = {}) {
    // ... 执行具体的 AJAX 请求逻辑
  };

用法六 遍历 Map 结构

Map 对象:
- Map 是一种内置的 JavaScript 对象，它实现了键值对的集合，类似于对象，但键可以是任意类型的值（不仅仅是字符串或符号）。
- Map 保证了键值对的插入顺序会被记住，这与普通的 JavaScript 对象不同，在普通对象中键值对的顺序是不确定的。
- Map 提供了一些方法，如 set, get, has, delete, 和 clear 用于操作键值对。