二、TypeScript 介绍与安装
TypeScript 简介 TypeScript 是由微软公司在 2012 年正式发布，现在也有 8 年的不断更新和维护了，TypeScript 的成长速度是非常快的，现在已经变成了前端必会的一门技能。TypeScript 其实就是 JavaScript 的超集，也就是说 TypeScript 是建立在 JavaScript 之上的，最后都会转变成 JavaScript。真的好用，比如说它的扩展语法、面向对象、静态类型。如果一个前端项目我可以做主，我会在强烈的要求所有人都使用 TypeScript 的语法进行编程。 TypeScript 安装与编译第一步 新建一个空文件夹用来学习 ts 第二步 全局安装 ts 和 ts-node 12npm i -g typescript // 全局安装tsnpm i -g ts-node // 全局安装ts-node 第三步 生成 tsconfig.js 配置文件 1tsc --init 我们就先按照自动生成的 tsconfig 配置项去使用 里面的配置咱们可以先不去管它 后续熟练了再去配置 第四步 在项目下新建一个index.ts直...
一、VS Code 配置与插件
前言 作为一款由 TypeScript 编写的编辑器，VS Code 天然为 TypeScript 开发提供了卓越的支持，包括智能类型检查、代码补全和语法高亮等功能。为了进一步提升开发体验，社区贡献了许多优秀的插件，以下是几款特别推荐的 TypeScript 开发增强工具： TypeScript Importer - 智能类型导入助手点击安装：https://marketplace.visualstudio.com/items?itemName=pmneo.tsimporter 插件功能： 自动扫描项目中的所有类型定义 在输入冒号(:)时提供类型建议 选择类型后自动添加对应的 import 语句 Move TS点击安装：https://marketplace.visualstudio.com/items?itemName=stringham.move-ts 插件功能： 提供安全的 TypeScript 文件移动和重命名功能 自动更新所有相关引用路径 支持跨目录结构调整 ErrorLens点击安装：https://marketplace.visualstudi...
【基础积累】Grid 网格布局系统
栅格介绍名词解释CSS 网格布局(Grid Layout) 是 CSS 中最强大的布局系统。 这是一个二维系统，这意味着它可以同时处理列和行。 栅格系统与 FLEX 弹性布局有相似之处理，都是由父容器包含多个项目元素的使用。 兼容性下面是栅格系统兼容性数据，你也可以在 https://caniuse.com/ 网站查看，所以在根据项目使用的场景决定是否使用栅格布局。 基本知识下面了解栅格有关的元素说明，可以帮助你更好的使用栅格。 声明容器块级容器 1234567891011121314151617181920212223242526272829303132333435363738<style> * { padding: 0; margin: 0; } body { padding: 200px; } article { width: 400px; height: 200px; border: solid 5px silver; display: grid; ...
【极客笔记】玩转Git三剑客
GIT 的一些基础命令基本常识 一般配置 123456git --version // 查看git版本内心戏git config --global user.name // 获取当前登录的用户git config --global user.email // 获取当前登录用户的邮箱git config -l // 查看当前git的配置git config --system --list // 查看系统配置git config --global --list // 查看用户自己设置的配置 登录 git 123/* 如果刚没有获取到用户配置，则只能拉取代码，不能修改 要是使用git，你要告诉git是谁在使用 */git config --global user.name 'louhaojie' //设置git账户，louhaojie为你的git账号，git config --global user.email '851681631@qq.com' 初始化 git 仓库 1git init // ...
二十、浅谈ES6中Promise解决了什么问题
封装 AJAX ajax 使用起来太麻烦，因为每次都要写很多的代码 那么我们就封装一个 ajax 方法来让我们使用起来简单一些 确定一下使用的方式 因为有一些内容可以不传递，我们可以使用默认值，所以选择对象传递参数的方式 1234567// 使用的时候直接调用，传递一个对象就可以ajax({ url: "", // 请求的地址 type: "", // 请求方式 data: "", // 携带的参数 success: function () {}, // 成功以后执行的函数}); 确定好使用方式以后，就开始书写封装函数 封装123456789101112131415161718192021function ajax(options) { // 先准备一个默认值 var defInfo = { url: "", // 地址不需要默认值 type: "GET", // 请求方式的默认值是 G...
十九、前后端交互-Ajax
AJAX ajax 全名 async javascript and XML 是前后台交互的能力 也就是我们客户端给服务端发送消息的工具，以及接受响应的工具 是一个 默认异步 执行机制的功能 AJAX 的优势 不需要插件的支持，原生 js 就可以使用 用户体验好（不需要刷新页面就可以更新数据），可以实现局部刷新 减轻服务端和带宽的负担 缺点： 搜索引擎的(seo)支持度不够，因为数据都不在页面上，搜索引擎搜索不到 AJAX 的使用 在 js 中有内置的构造函数来创建 ajax 对象 创建 ajax 对象以后，我们就使用 ajax 对象的方法去发送请求和接受响应 创建一个 ajax 对象12345// IE9及以上const xhr = new XMLHttpRequest();// IE9以下const xhr = new ActiveXObject("Mricosoft.XMLHTTP"); 上面就是有了一个 ajax 对象 我们就可以使用这个 xhr 对象来发送 ajax 请求了 配置链接信息12345678const xhr = new XML...
十八、初次认识浏览器中Cookies
通信协议定义：通信协议是指双方实体完成通信或服务所必须遵循的规则和约定。协议定义了数据单元使用的格式，信息单元应该包含的信息与含义，连接方式，信息发送和接收的时序，从而确保网络中数据顺利地传送到确定的地方。总结一句话：交流的规则。比如：汉语、英语、德语、日语等。在计算机通信中，通信协议用于实现计算机与网络连接之间的标准，网络如果没有统一的通信协议，电脑之间的信息传递就无法识别。 通信协议是指通信各方事前约定的通信规则，可以简单地理解为各计算机之间进行相互会话所使用的共同语言。两台计算机在进行通信时，必须使用的通信协议。常见的协议有：TCP/IP 协议、HTTP 协议等等。 HTTP http 是我们前后台交互的时候的传输协议（即超文本传输协议） HTTP 的工作流程 和服务器建立链接 建立链接后，发送一个请求给服务器（请求 request- req） 服务器接受到请求以后进行相应的处理并给出一个回应（响应 response-res） 断开于服务器的链接 和服务器建立链接 怎么和服务器建立链接呢？ 需要保证客户端的接受和发送正常，服务器端的接受和发送正常 这里就涉...
十七、数据库操作-Mysql
PHP 和 mysql第一节webserver Web Server 中文名称叫网页服务器或 web 服务器。WEB 服务器也称为 WWW(WORLD WIDE WEB)服务器，主要功能是提供网上信息浏览服务 Web 服务器可以解析(handles)HTTP 协议。当 Web 服务器接收到一个 HTTP 请求(request)，会返回一个 HTTP 响应(response)，例如送回一个 HTML 页面。为了处理一个请求(request)，Web 服务器可以响应(response)一个静态页面或图片，进行页面跳转(redirect)，或者把动态响应(dynamic response)的产生委托(delegate)给一些其它的程序例如 CGI 脚本，JSP(JavaServer Pages)脚本，servlets，ASP(Active Server Pages)脚本，服务器端(server-side)JavaScript，或者一些其它的服务器端技术。无论它们(译者注：脚本)的目的如何，这些服务器端的程序通常产生一个 HTML 的响应(response)来让浏览器可以浏览 通俗...
十六、JSON与localstorage
JSON 字符串和对象的转换JSON(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式。它基于 [ECMAScript] (欧洲计算机协会制定的 js 规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写，同时也易于机器解析和生成，并有效地提升网络传输效率 注意 json 字符串中的属性名只能是字符串，并且只能用双引号。属性值如果是字符串的话，也只能使用双引号 1234let str = '{"name":"李四","age":18}'let productsStr = '[{"pname":"iphone11","price":1000},{"pname":"iphone12","pric...
十五、万物皆对象（面向对象思想）
面向对象 首先，我们要明确，面向对象不是语法，是一个思想，是一种 编程模式 面向： 面（脸），向（朝着） 面向过程： 脸朝着过程 =》 关注着过程的编程模式 面向对象： 脸朝着对象 =》 关注着对象的编程模式 实现一个效果 在面向过程的时候，我们要关注每一个元素，每一个元素之间的关系，顺序，。。。 在面向过程的时候，我们要关注的就是找到一个对象来帮我做这个事情，我等待结果 例子 🌰： 我要吃面条 面向过程 用多少面粉 用多少水 怎么和面 怎么切面条 做开水 煮面 吃面 面向对象 找到一个面馆 叫一碗面 等着吃 面向对象就是对面向过程的封装 我们以前的编程思想是，每一个功能，都按照需求一步一步的逐步完成 我们以后的编程思想是，每一个功能，都先创造一个 面馆，这个 面馆 能帮我们作出一个 面（完成这个功能的对象），然后用 面馆 创造出一个 面，我们只要等到结果就好了 创建对象的方式 因为面向对象就是一个找到对象的过程 所以我们先要了解如何创建一个对象 调用系统内置的构造函数创建对象 js 给我们内置了一个 Object 构造函数 这个构造函...
