编程风格
编程风格本章探讨如何将 ES6 的新语法,运用到编码实践之中,与传统的 JavaScript 语法结合在一起,写出合理的、易于阅读和维护的代码。
多家公司和组织已经公开了它们的风格规范,下面的内容主要参考了 Airbnb 公司的 JavaScript 风格规范。
块级作用域(1)let 取代 var
ES6 提出了两个新的声明变量的命令:let和const。其中,let完全可以取代var,因为两者语义相同,而且let没有副作用。
123456789"use strict";if (true) { let x = "hello";}for (let i = 0; i < 10; i++) { console.log(i);}
上面代码如果用var替代let,实际上就声明了两个全局变量,这显然不是本意。变量应该只在其声明的代码块内有效,var命令做不到这一点。
var命令存在变量提升效用,let命令没有这个问题。
123456"use strict";if (true) ...
读懂 ECMAScript 规格
读懂 ECMAScript 规格概述规格文件是计算机语言的官方标准,详细描述语法规则和实现方法。
一般来说,没有必要阅读规格,除非你要写编译器。因为规格写得非常抽象和精炼,又缺乏实例,不容易理解,而且对于解决实际的应用问题,帮助不大。但是,如果你遇到疑难的语法问题,实在找不到答案,这时可以去查看规格文件,了解语言标准是怎么说的。规格是解决问题的“最后一招”。
这对 JavaScript 语言很有必要。因为它的使用场景复杂,语法规则不统一,例外很多,各种运行环境的行为不一致,导致奇怪的语法问题层出不穷,任何语法书都不可能囊括所有情况。查看规格,不失为一种解决语法问题的最可靠、最权威的终极方法。
本章介绍如何读懂 ECMAScript 6 的规格文件。
ECMAScript 6 的规格,可以在 ECMA 国际标准组织的官方网站(www.ecma-international.org/ecma-262/6.0/)免费下载和在线阅读。
这个规格文件相当庞大,一共有 26 章,A4 打印的话,足足有 545 页。它的特点就是规定得非常细致,每一个语法行为、每一个函数的实现都做了详尽的清晰的描述。基 ...
Express框架
Express 介绍
Express 是一个基于 Node.js 平台,快速、开放、极简的 web 开发框架
Express 是一个第三方模块,有丰富的 API 支持,强大而灵活的中间件特性
Express 不对 Node.js 已有的特性进行二次抽象,只是在它之上扩展了 Web 应用所需的基本功能
链接
Express 官网
Express 中文文档(非官方)
Express GitHub 仓库
Hello World
下载 Express 包
12npm init -ynpm i express
代码
123456789101112// 0. 加载 Expressconst express = require("express");// 1. 调用 express() 得到一个 app// 类似于 http.createServer()const app = express();// 2. 设置请求对应的处理函数// 当客户端以 GET 方法请求 / 的时候就会调用第二个参数:请求处理函数app.get("/", ( ...
Node基础
安装 Node.js软件下载地址
NPM介绍
CommonJS 包规范是理论,NPM 是其中一 种实践。
对于 Node 而言,NPM 帮助其完成了第三 方模块的发布、安装和依赖等。借助 NPM, Node 与第三方模块之间形成了很好的一个 生态系统。
NPM 命令123456789npm -v # 查看版本npm # 帮助说明npm search 包名 # 搜索模块包npm install 包名 # 在当前目录下安装包npm install -g 包名 # 全局模式安装包npm remove 包名 # 删除一个模块npm install 文件路径 # 从本地安装npm install 包名 -registry=地址 # 从镜像源安装npm config set registry 地址 # 设置镜像源
Hello World1234567891011// 引入http模块const http = require("http");// 创建服务const server = http.createServer((req, res) => ...
Hexo博客搭建流程
博客搭建步骤
JS高级
标题
JQuery基础
什么是 Jquery
官方网站
jQuery 是 javascript 实现的一个库
优点
跨浏览器兼容
链式编程,隐式迭代
简化 DOM 操作,支持事件、样式、动画
支持插件扩展开发
开源免费
引入 Jquery1<script src="https://static.zhangsifan.com/jquery.min.js"></script>
入口函数12345678$(document).ready(function() { // 代码});// 或者$(function() { // 代码 alert(1);});
jquery 的顶级对象$
$是 jQuery 的别称,也是 JQuery 的顶级对象
JQuery 和 DOM 对象相互转换用原生 js 获取的对象就是 DOM 对象
用 JQuery 方法获取的元素就是 JQuery 对象(伪数组)
DOM 对象转 JQuery 对象1$(DOM对象);
JQuery 对象转 DOM 对象123// index 是索引号 ...
Web Apis
DOM (文档对象模型/Document Object Model)获取元素通过 ID 获取1<div id="mybox"></div>
1var box = document.getElementById("mybox");
根据 标签名 获取
返回的是元素对象集合 以数组的形式存储如果要获取每个具体标签对象,通过循环遍历的方式
1234567<ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li></ul>
1document.getElementsByTagName("li");
根据 类名 获得1<div class="box"></div>
1document.getElementsByClassName(&quo ...
JS基础
变量运算符循环for 循环123for(初始化变量,条件表达式,操作表达式){ // 循环体}
双重 for 循环
外层循环一次,里面循环全部
123456for(初始化变量,条件表达式,操作表达式){ // 循环体 for(初始化变量,条件表达式,操作表达式){ // 循环体 }}
while 循环
条件表达式为 true 则循环表达体,否则退出循环
12345// 初始化变量while (条件表达式) { // 循环体 // 操作表达式}
do while 循环
先执行循环体,在判断条件 为 true,继续循环,否则退出循环
1234do { // 循环体 // 操作表达式} while (条件表达式);
continue break
continue 退出当前循环,继续执行剩余次数的循环break 退出整个循环(循环结束)
1234567891011121314// continuefor (var i = 1; i <= 5; i++) ...