VS Code Resolving shell environment fails 提示

某次升级完 VS Code 之后，打开窗口便一直出现一个错误提示。如下所示。

1
2
Unable to resolve your shell environment in a reasonable time.
Please review your shell configuration.

点击错误提示下方的官方文档按钮，进入官方文档，查看如何解决。文档说是加载终端配置的时间太长了，才出现的错误；终端配置文件可能是 ~/.bashrc 和 ~/.zshrc。

查看终端配置文件，发现我并没有 ~/.bashrc，猜想可能是该文件缺失导致的。

Read More

前端进阶

4-ts--TypeScript

TypeScript 是一种类型安全的 JavaScript 语言，以下使用 TS 进行代称，使用的 TS 的好处如下：

  • 引入静态类型声明，减少不必要的类型判断和文档注释；
  • 及早发现错误，静态类型检查 1 或编译时发现问题，不用等到运行；

    Read More

前端进阶

2-各种模块化标准

前端有各种模块化标注 AMD/CMD/CommonJS/ES6 module，各种模块化标准实现各有不同。

AMD

在声明依赖时，就加载。

CMD

在使用依赖时，才加载

CommonJS

针对服务端，运行时加载；值拷贝。

ES6 module

针对客户端，编译时加载；引用拷贝。

3-浏览器详解

浏览器对象

  • window 对象
    1.关注 window.onerror，用于前端错误收集和上报，ps 阿里云有免费的日志服务，可以收集前端错误，上报到阿里云服务器
    2.使用 setTimeout 替换 setInterval 用于定时器，setInterval 缺点是不能控制间隔时间，有可能浏览器重新获得焦点后会执行多次
    3.innerWidth 和 innerHeight 可以获取浏览器窗口的宽高，有些浏览器不支持，比如 IE，可以使用 document.body.clientWidth 和 document.body.clientHeight 获取

  • location 对象
    1.关注 location.href，用于获取当前页面的 url 和替换当前页面的 url，可回退
    2.关注 location.replace，用于替换当前页面的 url，不可回退

  • navigator 对象
    1.关注 navigator.userAgent，用于获取当前浏览器的 userAgent
    2.关注 navigator.language，用于获取当前浏览器的语言
    3.关注 navigator.onLine，用于获取当前网络是否连接

  • history 对象
    1.关注 history.pushState，用于替换当前页面的 url，可回退
    2.关注 history.replaceState，用于替换当前页面的 url，不可回退

Read More

前端进阶

1-了解 Promise

Promise 是 ES6 内置的对象，用一个对象实例表示某个操作最终是成功或者失败，并且将成功值或者原因暴露出来，它主要解决了异步编程过程中存在的两个问题：
1.回调地狱问题
2.信任问题

解决的问题

1.回调地狱问题

  • 传统异步编程
    传统异步编程中，如果需要多次将请求的返回结果当做下次请求的参数，便需要不断在回调函数中嵌套请求，形成回调地狱。回调地狱代码嵌套，可读性差。
1
2
3
4
5
6
7
ajax('/url1', {param: {}},  (res1) => {
    ajax('/url2, {param: res1}, (res2) => {
        ajax('/url3, {param: res2}, (res3) => {
            // 继续回调
        })
    })
})

Read More

深入浅出 React

Hooks 组件的优点

Hooks 是 React 16.8 版本新出的功能，比 class 具有很多优点。

  • class 组件需要手动绑定 this 或者使用利用 class property 和箭头函数绑定
  • 抽象并复用状态逻辑
  • 替换逻辑复杂的高阶组件
  • useEffect 让相关的逻辑聚合