Vue 基本概念 Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。库是封装的属性或方法（如：jQuery），而框架是拥有自己的规则和元素，比库强大的多（如：Vue）。 Vue.jshttps://cn.vuejs.org/ MVVM 设计模式 MVVM，一种软件架构模式，决定了写代码的思想和层次 M： model 数据模型 (data 里定义) V： view 视图 （html 页面） VM： ViewModel 视图模型 (vue.js 源码) MVVM 通过数据双向绑定让数据自动地双向同步 不再需要操作 DOM V（修改视图） -> M（数据自动同步） M（修改数据） -> V（视图自动同步） @vue/cli 脚手架 123yarn global add @vue/cli# ORnpm install -g @vue/cli Vue CLIhttps://cli.vuejs.org/zh/guide/ 创建项目启动服务 项目名称不能带大写字母，中文和特殊符号 创建项目 12# vue和create是命令, ...

Ajax 简介 Ajax 的全称是 Asynchronous JavaScript and XML（异步的 JavaScript 和 XML），即在网页中利用 XMLHttpRequest 对象和服务器进行数据交互的方式 XMLHttpRequest XMLHttpRequest （简称 xhr）是浏览器提供的 JavaScript 对象，通过它，可以请求服务器上的数据资源 XMLHttpRequest 的基本使用 创建 xhr 对象 调用 xhr.open()函数 调用 xhr.send()函数 监听 xhr.onreadystatechange 事件 使用 xhr 发起 GET 请求 12345678910111213// 1. 创建 XHR 对象var xhr = new XMLHttpRequest();// 2. 调用 open 函数xhr.open('GET', 'http://www.liulongbin.top:3006/api/getbooks');// 3. 调用 send 函数xhr.send();// 4. 监听 on ...

ES6 简介 ES 的全称是 ECMAScript，它是由 ECMA 国际标准化组织制定的一项脚本语言的标准化规范，ES6 实际上是一个泛指，泛指 ES2015 及后续的版本。 var、let、const let let 声明的变量只在所处的块级作用域有效 123456if (true) { let num = 100; var abc = 200;}console.log(abc);console.log(num); 不存在变量提升 12console.log(a);let a = 100; 暂时性死区 12345var num = 10;if (true) { console.log(num); // ReferenceError let num = 20;} 经典面试题 使用 let 时，每次循环都会产生一个块级作用域，每个块级作用域中的变量都是不同的 函数执行时输出的是自己循环产生的块级作用域下的值 123456789101112131415161718var arr = [];for (var i = 0; i ...

正则表达式 正则表达式（Regular Expression）是用于匹配字符串中字符组合的模式，在 JavaScript 中，正则表达式也是对象。其他语言也会使用正则表达式，本阶段主要是利用 JavaScript 正则表达式完成表单验证。 特点 灵活性、逻辑性和功能性非常的强 可以迅速地用极简单的方式达到字符串的复杂控制 对于刚接触的人来说，比较晦涩难懂 实际开发，一般都是直接复制写好的正则表达式，但要求会按需修改 具体使用 在 JavaScript 中，可以通过两种方式创建一个正则表达式 123456789// 1. 利用 RegExp对象来创建 正则表达式var regexp = new RegExp(/123/);console.log(regexp);// 2. 利用字面量创建 正则表达式var rg = /123/;// 3.test 方法用来检测字符串是否符合正则表达式要求的规范console.log(rg.test(123));console.log(rg.test('abc')); 测试正则表达式 test() 正则对象方法，用于检测字符串是否符 ...

函数的定义和调用 函数的定义方式 123456789// 1. 自定义函数(命名函数)function fn() {}// 2. 函数表达式 (匿名函数)var fun = function () {};// 3. 利用 new Function('参数1','参数2', '函数体');var f = new Function('a', 'b', 'console.log(a + b)');f(1, 2); 第三种当时执行效率低，较少使用 所有函数都是 Function 的实例对象 函数也属于对象 函数的调用方式 普通函数 12345function fn() { console.log('人生的巅峰');}fn();fn.call(); 对象的方法 123456var o = { sayHi: function () { console.log( ...

面向对象编程介绍 面向过程编程 面向过程，就是按照我们分析好了的步骤，按照步骤解决问题 面向过程编程（Procedure Oriented Programming, POP）就是分析出解决问题所需的步骤，然后用函数把这些步骤一步一步实现，使用的时候再一个一个的依次调用就可以了。 面向对象编程 面向对象，就是以对象功能来划分问题，而不是步骤 面向对象编程（Object Oriented Programming, OOP）是把事务分解成一个个对象，然后由对象之间分工与合作。 面向过程与面向对象的对比 面向过程 优点：性能比面向对象高，适合跟硬件联系很紧密的东西，例如单片机就采用的面向过程编程 缺点：没有面向对象易维护、易复用、易扩展 面向对象 优点：易维护、衣服用、易扩展，由于面向对象有封装、继承、多态性等特点，可以设计出低耦合的系统，使系统更灵活，更好维护 缺点：性能比面向过程低 ES6 中的类和对象 对象是由属性和方法组成的： 属性：事物的特征，在对象中用属性来表示（常用名词） 方法：事物的行为，在对象中用方法来表示（常用动词） 类 class 在 ES6 中新 ...

jQuery 概述 JavaScript 库：即 library，是一个封装好的特定的集合。从封装一大堆函数的角度理解库，就是在这个库中，封装了很多预先定义好的函数在里面，比如动画 animate、hide、show 和获取元素等。 简单理解：就是一个 JS 文件，里面对我们原生 js 代码进行了封装，存放到里面，这样我们可以快速高效的使用这些封装好的功能。比如 jQuery，就是为了快速方便的操作 DOM，里面基本都是函数（方法）。 常见的 JavaScript 库 jQuery Prototype YUI Dojo Ext JS 移动端的 zepto jQuery 的基本使用 jQuery 封装了 JavaScript 常用的功能代码，优化了 DOM 操作、事件处理、动画设计和 Ajax 交互 官网地址：https://jquery.com/ 各个版本的下载：https://releases.jquery.com/ 入口函数 1234567$(function () { // 此处是页面 DOM 加载完成的入口});$(document).ready( ...

BOM 概述 BOM（Browser Object Model）即浏览器对象模型，它提供了独立于内容而与浏览器窗口进行交互的对象 1. DOM 文档对象模型 DOM 就是把文档当做一个对象来看待 DOM 的顶级对象是 document DOM 主要学习的是操作页面元素 DOM 是 W3C 标准规范 2. BOM 浏览器对象模型 把浏览器当做一个对象来看待 BOM 的顶级对象是 window BOM 学习的是浏览器窗口交互的一些对象 BOM 是浏览器厂商在各自浏览器上定义的，兼容性较差 window 对象的常见事件 window.onload = function() {}; window.addEventListener("load", function() {}); window.onload 是窗口加载事件，当文档内容完全加载完成会触发该事件（包括图像、脚本文件、css 文件等） 有了 window.onload 就可以把 JS 代码写到页面元素的上方，因为是等页面内容全部加载完毕再去执行处理函数 window ...

Web API 介绍 API 的概念 API（应用程序编程接口，Application Programming Interface）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问源码，无需理解其内部工作机制细节，直接使用即可。 Web API 的概念 Web API 接口https://developer.mozilla.org/zh-CN/docs/Web/API Web API 是浏览器提供的一套操作浏览器功能和页面元素的 API ( BOM 和 DOM )。现阶段我们主要针对于浏览器讲解常用的 API , 主要针对浏览器做交互效果。比如我们想要浏览器弹出一个警示框， 直接使用 alert(‘弹出’)。 DOM 介绍 什么是 DOM 文档对象模型（Document Object Model，简称 DOM），是 W3C 组织推荐的处理可扩展标记语言（html 或者 xhtml）的标准编程接口。W3C 定义了一系列的 DOM 接口，通过这些 DOM 接口可以改变网页的内容、结构和样式。 DOM 是 W3C 组织制定的一套处理 ht ...

作用域 全局作用域 作用于所有代码执行的环境(整个 script 标签内部)或者一个独立的 js 文件。 局部作用域 作用于函数内的代码环境，就是局部作用域。 因为跟函数有关系，所以也称为函数作用域。 JS 没有块级作用域 块作用域由 { } 包括。在其他编程语言中（如 java、c#等），在 if 语句、循环语句中创建的变量，仅仅只能在本 if 语句、本循环语句中使用，如下面的 Java 代码。 java 有块级作用域： 12345if(true){int num = 123;system.out.print(num); // 123}system.out.print(num); // 报错 以上 java 代码会报错，是因为代码中 { } 即一块作用域，其中声明的变量 num，在 “{ }” 之外不能使用； 而与之类似的 JavaScript 代码，则不会报错： Js 中没有块级作用域（在 ES6 之前） 12345if (true) { var num = 123; console.log(num); //123}consol ...