0%

React

  • 用于构建用户界面的 javascript 库
  • Declarative(声明式) Component-Based(组件化)
  • 单向数据流

参考文档

JSX

  • JSX 全称 JavaScript XML,是一种类似于XML的 JS 扩展语法
  • React.createElement(component, props, ...children) 方法的语法糖

注意点

  • 标签内部不要使用单引号或双引号
  • 使用 js 表达式需要使用 { EXPRESSION }
  • 标签类名使用 className 指定,而不是 class
  • 行内样式需要传入对象,格式为 style={{ CSS_STYLE }}
  • 只能有一个根标签
  • 所有标签必须闭合,自结束标签或同名结束标签均可
阅读全文 »

webpack 简介

webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。

核心概念

  • entry(入口)webpack 开始构建的入口模块,从该入口开始构建并计算直接或间接依赖的模块或库
  • output(输出)webpack 对文件的命名和输出
  • loader(加载器)对于非 js 文件处理需要依赖 loader
  • plugins(插件)plugins 将不同的事件运行在不同生命周期的 hook(钩子)中提供具体功能
  • mode(模式)内置优化参数,可选 production(生产模式) developement(开发模式)none(无优化参数)
阅读全文 »

Promise 简介

  • Promise 是异步编程的一种解决方案,比传统的回调函数和事件解决异步更加合理和灵活
    • 异步操作
      • 文件处理
      • 网络请求 (AJAX, 爬虫)
      • 数据库操作
      • 定时器
  • Promise 支持链式调用,可以解决 Callback Hell (回调地狱)
    • 回调地狱: 外部回调函数异步执行结果是内部嵌套的回调执行的条件
    • 回调地狱不便于阅读和异常处理
  • 语法上 Promise 是一个构造函数
  • 功能上 promise 对象用来封装一个异步操作并可以获取其成功或失败的结果值

文档

阅读全文 »

Ajax

  • ajax 全称为 Asynchronous Javascript And XML,就是异步的 js 和 xml
  • ajax 请求是一种特殊的 http 请求,可以动态更新网页数据而无需重载页面
  • 浏览器使用 XHR(XMLHttpRequest)对象或 fetch 函数发送 ajax 请求
阅读全文 »

IDE 的选择

VSCode

对于开发者来说,一个好的开发工具至关重要,在众多 IDE 中 我选择了 VScode,微软的一款轻量级开发工具,对应的开源版本为 VSCodium,就像 Chrome 与 Chromium,有开源版本我当然会用开源版本,但 VScode 的远程开发功能在 VSCodium 中无法使用,这一点使我暂时放弃了 VSCodium,远程开发功能让服务器端写代码像在本地一样,虽然目前还是预览功能,但体验了一下我只能说真香。

强烈推荐 FiraCode 编程字体,只需体验三分钟,你就会跟我一样 … …

阅读全文 »

jquery 简介

jquery 是一个快速,小巧,功能丰富的 javascript 库。其独特的 API 使 html 文档的遍历,事件处理,动画和 Ajax 等变得简单。

使用

1
<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.js"></script>
阅读全文 »

canvas

  • <canvas> 标签是一个图形容器,需要使用 javascript 来绘制图形
  • <canvas> 标签是 inline-block 元素,标签内部是浏览器不支持 <canvas> 标签时显示的内容
  • <canvas> 元素默认宽度 300px,默认高度 150px,只能通过标签属性设置宽高,不能通过 css 设置(会改变像素的宽高比),不需要写单位,以像素计数
阅读全文 »