Node.js 基本概念 + ES6基本语法

r囧r小猫 2022-12-08 14:27 220阅读 0赞

## 基本概念梳理 ##

### 1. 语言 和 环境之间的关系 ###

*  语言，是编写代码的语法规范
    
    程序员遵循特定的语法规范，编写出来的代码，只是单纯的文本字符串而已，`并不具备可执行的特点`
 *  环境：提供了执行代码的能力
    
    如果程序员编写的代码想要成功执行，必须要依赖于特定的执行环境

*  例如：JavaScript代码可以被浏览器中的JS解析引擎执行
    
    所以，浏览器就是一个 JavaScript 的执行环境；因为 JavaScript 代码可以在浏览器中被执行；

### 2. 前端 和 后端 ###

*  前端主要工作
    
    书写页面结构–美化页面样式–使用Ajax调用后台接口
 *  后端主要工作
    
    操作数据库–对外暴露操作数据库的API接口

### 3. 浏览器环境中的 JavaScript ###

*  诞生：上世纪 90年代左右，网景开发的语言`liveScript` =>用于：表单验证
 *  一战：
    
    主角：微软和网景
    
    结果：微软IE胜出
    
    胜利的果实：ECMAScript 语言标准的诞生
 *  二战
    
    主角：谷歌、火狐、IE
    
    结果：谷歌胜出
    
    胜利的果实：谷歌的V8引擎是最快的JS解析引擎
 *  回顾：浏览器中 JavaScript 的组成部分：`ECMAScript核心 + DOM + BOM`

### 4. Node环境中的 JavaScript ###

#### 什么是 Node.js ####

> 官方网址：http://nodejs.cn/

官方定义

*  Node.js是一个基于Chrome V8 引擎的JavaScript运行环境。
 *  Node.js使用了一个`事件驱动`、`非阻塞式I/O的模型`，使其轻量又高效。
 *  Node.js的包管理器 npm，是全球最大的开源库生态系统

> 事件驱动：为元素绑定事件，当事件触发执行处理函数。

serve.on('request',function(){  })

> 阻塞式I/O的模型 与 非阻塞式I/O的模型  
> 推荐文章：`https://blog.csdn.net/hguisu/article/details/7453390`

Node.js 中 JavaScript 的组成部分

*  ECMAScript 核心 + 全局成员 + 核心 API 模块
    
     *  ECMAScript 核心: 通过实现 ECMAScript语言规范而得到
     *  全局成员：console、setInterval、setTimeout…
     *  核心 API 模块：就是 Node 平台 单独提供的一些API，这些API是Node平台所独有的

*  注意：Node.js 中 没有 BOM 和 DOM
    
    由于 Node 服务器端运行环境中，没有浏览器 和 HTML 的概念 【不需要操作：DOM 和 BOM】
    
    所以 Node中的JavaScript 剔除了 DOM 和 BOM 这两个对象模型，
    
    取而代之的，是 全局成员 和 核心 API 模块

#### ECMAScript 规范，浏览器中的js，Node中的js之间的关系 ####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY2NjY0NA_size_16_color_FFFFFF_t_70_pic_center]

* 浏览器中的 js 组成部分：ECMAScript 核心 + DOM + BOM
    
        1.浏览器中的js实现了ECMAScript 规范！它是一门具体的实现，也是一门语言
          浏览器中的js语言从何而来？通过实现ECMAScript 规范而得到的
    
        2.ECMAScript 核心从何而来？实现了ECMAScript 规范从而就有了ECMAScript 核心
          注意：DOM 和 BOM 是浏览器端根据这个规范扩展出来的，
               也就是说：DOM 和 BOM并不在规范中，是由浏览器端独自扩展实现出来的DOM 和 BOM
    
    * Node中的js组成部分：ECMAScript 核心 + 全局成员 + 核心API成员
    
        1.浏览器中的js实现了ECMAScript 规范！它是一门具体的实现，也是一门语言
    
        2.ECMAScript核心是由ECMAScript 规范实现而来，通过实现这个规范我们还扩展出了全局成员和核心API成员
          注意：全局成员和核心API成员在规范中没有定义，而是node独自实现的

#### 学习 Node.js 可以做什么 ####

*  像 PHP 一样，使用 JavaScript 编写符合规范的**后端 API 接口** 或 **网站**
 *  使用 Node.js 开发一些**实用的工具** 或 **包**
 *  基于 Socket 技术，开发类似于聊天室之类的**即时通讯项目**
 *  基于 Electron 环境，开发**桌面软件**

## Node.js 环境安装 ##

### 1. LTS 和 Current 版本区别 ###

*  LTS：【推荐在企业中使用】是长期稳定版的安装包，运行稳定、安全；
 *  Current：【推荐学习或尝鲜去使用】是最新特征版，这个安装包中有最新的Node特性；

### 2. 查看 Node 版本号 ###

*  打开终端，在命令行输入命令`node -v`即可

### 3. path 环境变量 ###

1.  **什么是path环境变量**
    
     *  Path环境变量的作用：能够让我们在终端中执行相关的命令，从而快速启动应用程序；
2.  **通过终端输入命令的形式，快速启动应用程序时，路径的查找规则**
    
     *  先在当前运行 终端命令的 目录中查找，如果有则直接运行；
     *  如果当前运行 终端命令的 目录中没有，则去全局的path环境变量中查找；

## Node.js 环境中 执行 js 代码的方式 ##

### node 命令【推荐】 ###

1.  直接使用 `node 要执行的js文件的路径` 来执行指定的JS文件

> 小技巧：
> 
> 1.  在终端中，使用键盘的↑, 可以快速定位到上一次执行的命令
> 2.  在终端中，使用键盘的 `tab` 键能够快速补全路径
> 3.  windows 系统上，在终端中输入 `cls` 可以清屏

## ECMAScript 6常用语法 ##

### 1. let(变量) 与 const (常量) ###

1.  之前定义变量，用 var 关键字；有如下主要缺点：
    
     *  存在变量提升问题，降低 js 代码的可阅读性
     *  没有块级作用域，容易造成变量污染
2.  let 主要特性：
    
     *  不存在变量提升问题，只有定义之后才能使用此变量
     *  有 `{ }` 作用域
3.  const 主要特性：
    
     *  不存在变量提升问题，只有定义之后才能使用此变量
     *  const 定义的**常量**，**无法被重新赋值**
     *  当定义常量的时候，必须定义且初始化，否则报语法错误
     *  const 定义的常量，也有 块级作用域

### 2. 变量的解构赋值（常用） ###

> \*\*定义：\*\*所谓的解构赋值，就是把 某个对象中的属性，当作变量，给解放出来，这样，今后就能够当作变量直接使用了

### 3. 箭头函数(常用) ###

/** * 原始函数 * 结果为3 * */
    
    // function add(x, y) { 
    // return x + y
    // }
    // console.log(add(1, 2))
    
    
    /**去掉function add，在（）后面添加箭头 * 给箭头函数起名字 * 结果为3 * */
    
    // var add = (x, y) => { 
    // return x + y
    // }
    // console.log(add(1, 2))
    
    
    /** * 变体1：如果箭头函数，左侧的形参列表中，只有一个参数，则，左侧小括号可以省略 * 结果：11 * */
    
    // var add = x => { 
    // return x + 10
    // }
    // console.log(add(1))
    
    /** * 变体2：如果右侧函数体中，只有一行代码，则，右侧的 { } 可以省略； * 结果：6 * */
    // var add = (x, y) => x + y
    // console.log(add(1, 5))
    
    
    /** * 变体3：如果箭头函数左侧 只有一个 形参，而且右侧只有一行代码，则 两边的 () 和 {} 都可以省略 * 结果： 23 * */
    // var add = x => x + 20
    // console.log(add(3))

1.  **箭头函数，本质上就是一个匿名函数**；
2.  **箭头函数的特性**： 箭头函数内部的 this, 永远和 箭头函数外部的 this 保持一致；
3.  **变体**：
    
     *  变体1：如果箭头函数，左侧的形参列表中，只有一个参数，则，左侧小括号可以省略；
     *  变体2：如果右侧函数体中，只有一行代码，则，右侧的 `{ }` 可以省略；
     *  变体3：如果箭头函数左侧 只有一个 形参，而且右侧只有一行代码，则 两边的 `()` 和 `{}` 都可以省略
4.  **注意**： 如果我们省略了 右侧函数体的 `{ }`，那么，默认会把 右侧函数体中代码的执行结果，当作箭头函数的调用结果 return 出去；

### 4. 对象中 `定义方法` 和 `定义属性` 的便捷方式 ###

/** * 对象中定义属性和方法便捷方式: * 1.对象的属性，只写属性名 * 2.对象中的方法可以去掉 ：和 function */
    
    let name = 'zs'
    let age = 22
    
    function show() { 
        console.log('我是zs')
    }
    var person = { 
        name,
        age,
        show,
        say() { 
            console.log('ok')
        }
    }
    console.log(person);
    // { name: 'zs',
    // age: 22,
    // show: [Function: show],
    // say: [Function: say] }

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY2NjY0NA_size_16_color_FFFFFF_t_70_pic_center]: /images/20221123/4d6ab8809635462d88395600eae69377.png