es6中容易忽视的细节（三）

Michael_Lin 发布于2019-08-22 13:50 / 319人阅读

摘要：模块就是对象，输入时必须查找对象属性模块不是对象，而是通过命令显式指定输出的代码，再通过命令输入。大括号里面的变量名，必须与被导入模块对外接口的名称相同。

proxy代理的坑

var obj = {index:"index"}
    var newObj = new Proxy(obj,{
        get:(target,key)=>{
            console.log(target)  // {index: "index"}
            return target[key]+123;
            // return target.key  如果这块这样返回的话访问newObj.index就会报undefined
        }
    })
    newObj.index    // index123
    实践中遇到这样的问题，但是具体什么原因还还弄清楚，有谁希望大家在底部留言告知，不胜感激

es6中模块与commonJs的区别

ES6 模块的设计思想，是尽量的静态化，使得编译时就能确定模块的依赖关系，以及输入和输出的变量。

CommonJS 模块就是对象，输入时必须查找对象属性；ES6 模块不是对象，而是通过export命令显式指定输出的代码，再通过import命令输入。

```
// CommonJS模块：这种引入方式只有在运行时加载，并且把整个fs对象引入，不能够静态加载
let { stat, exists, readFile } = require("fs");
// ES6模块：es6的模块中的每一个组件都是独立的，这样引入只把对应组件引入，能够静态加载(这就导致无法动态的加载需要模块，实现模块的按需加载)
import { stat, exists, readFile } from "fs";
```

import命令接受一对大括号，里面指定要从其他模块导入的变量名。大括号里面的变量名，必须与被导入模块（profile.js）对外接口的名称相同。

var a={name:"zhangsan",sex:"man"};
export {person as a};

import {personX as person} form "./person.js";

import命令有自动提升的功能，会自动提升到文件的顶部，所以在文件中只要我们引入即可使用，不需要考虑引入的位置，与let相反

console.log(personX);    // {name:"zhangsan",sex:"man"};这样不会报错
import {personX as person} form "./person.js";

import是静态执行，所有在引入组件过程中能不能掺杂任何表达式

// 报错
if (x === 1) {
  import { foo } from "module1";
} else {
  import { foo } from "module2";
}
import "lodash"    // 这样会直接执行模块

import命令与require命令同时存在时会先执行import命令，因为import在静态解析阶段执行，所以它是一个模块之中最早执行的。

import与export结合使用

export { es6 as default } from "./someModule";

// 等同于
import { es6 } from "./someModule";
export default es6;
这样暴露在另一个文件中引入的时候就可以 import anyName from "es6";

import()类似于commonJs的require()区别是前者是异步执行，后者是同步执行

扩展

module.exports==export.default，这样暴露引入的时候就可以任意指定模块名称，exports暴露引入时只能用{}把内部组件包裹起来

GPU服务器海外云主机不能忽视的问题容易混淆的问题 webrtc的视频容易崩溃最容易实现的替换算法

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/92492.html

es6中容易忽视的细节（一）

摘要：但是对于复杂类型的数据数组对象，保存的是一个指针，真正的数据是存储在堆区，只能保证这个指针不会变化，不能保证里面的数据不发生变化的变量声明方式在中声明的全局变量是和顶层对象的属性对等的获取全局对象的方法你可能不知道的let与const let var声明的变量会发生变量提升，在var声明之前调用该变量会数处undefined,但是let声明的变量不会发生提升，在声明之前调用就会...

baishancloud 2019-08-21 18:44 评论0 收藏0
es6中容易忽视的细节（二）

摘要：变量的解构赋值结构赋值允许使用默认值内部使用严格相等运算符，判断一个位置是否有值。所以，只有当一个数组成员严格等于，默认值才会生效。这样的层层判断非常麻烦，因此现在有一个提案，引入了传导运算符，简化上面的写法。变量的解构赋值结构赋值允许使用默认值 let [foo = true] = []; foo // true ES6 内部使用严格相等运算符（===），判断一个位置是否...

RayKr 2019-08-21 18:44 评论0 收藏0
2018前端值得关注的技术

摘要：年前端有哪些领域，技术值得关注，哪些技术会兴起，哪些技术会没落。自从谷歌提出后，就持续的获得了业界的关注，热度可见一斑。就在今年，谷歌也宣布将获得与安卓原生应用同等的待遇与权限。但是无论都值得关注。 1.前言 2017悄然过去，2018已经来到。人在进步，技术在发展。2018年前端有哪些领域，技术值得关注，哪些技术会兴起，哪些技术会没落。下面就我个人的判断进行一个预测判断，希望能对大家...

xiao7cn 2019-08-29 14:12 评论0 收藏0
2018前端值得关注的技术

摘要：年前端有哪些领域，技术值得关注，哪些技术会兴起，哪些技术会没落。自从谷歌提出后，就持续的获得了业界的关注，热度可见一斑。就在今年，谷歌也宣布将获得与安卓原生应用同等的待遇与权限。但是无论都值得关注。 1.前言 2017悄然过去，2018已经来到。人在进步，技术在发展。2018年前端有哪些领域，技术值得关注，哪些技术会兴起，哪些技术会没落。下面就我个人的判断进行一个预测判断，希望能对大家...

用户84 2019-08-21 18:42 评论0 收藏0
Polyfill：Function.prototype.bind的四个阶段

摘要：第二阶段被忽略的细节函数的属性，用于表示函数的形参。第三阶段被忽视的细节通过生成的构造函数。五本文涉及的知识点的用法的用法除操作符外的构造函数的用法下诡异的命名函数表达式技术六总结在这之前从来没想过一个的会涉及这么多知识点，感谢给的启发。昨天边参考es5-shim边自己实现Function.prototype.bind，发现有不少以前忽视了的地方，这里就作为一个小总结吧。一、Fu...

mudiyouyou 2019-08-22 10:57 评论0 收藏0