qq_36158581的博客

单例模式 一个构造函数一生只能有一个实例，不管你 new 多少次, 都是这一个实例 + 应用: => 自定义弹出层 => 结构: div > xxx, 默认隐藏, 在一定条件下显示 => 实现: 每次显示都是一个新的 div 还是一个 div 来回来去的显示 单例模式的核心代码 let instance = null function singleton() { if (!instance) insta

事件轮询(客户端 Event Loop) + 就是 JS 代码的同步异步执行机制 调用栈 : 专门用来执行代码的栈 => LIFO: last in first out 队列 : 异步任务排队的位置 => 事件队列: Event queue => 微任务队列: Microsoft Queue -> Promise.then() => 宏任务队列: Macrosoft Queue -> ...

继承 extend 当多个构造函数需要使用一些共同的方法或者属性的时候 => 我们需要把这些共同的东西拿出来, 单独书写一个构造函数 => 让其他的构造函数去继承自这个公共的构造函数 + 概念 => 让 B 构造函数的实例能够使用 A 构造函数的属性和方法 => 我们管 B 构造函数叫做 A 构造函数的子类 => 我们管 A 构造函数叫做 B 构造函数的父类 + 目的: => 让

闭包: 形成闭包的条件 1. 一个不会被销毁的函数执行空间 2. 函数内部 直接 或者 间接 的返回一个函数 3. 内部函数操作(访问, 赋值)着外部函数的变量 当三个条件都满足的时候 => 我们管内部的函数叫做外部函数的 闭包函数闭包的作用 1. 保护变量私有化 + 定义在函数内部的变量就是私有变量 2. 在函数外部访问函数内部的私有变量 + 利用闭包函数访问闭包的特点 1. 保护变量私有

Promise - 承诺 一个承诺三个状态 => 持续 pending => 成功 resolved => 失败 rejected ES6 的语法，专门用来解决回调地狱问题 Promise 的语法 + Promise 是 ES6 内置的构造函数 + 语法: new Promise(function () { 你要执行的异步的事情 }) => 实例化的时候, 这个函数接收两个参数 => re

同源策略 同源策略是浏览器给的一个行为 + 当你再发送请求的时候, 会涉及到两个地址 1. 打开当前页面的地址 2. 你要请求的地址 + 两个地址中的 端口号 域名 传输协议 => 只要由任意一个不一样, 就是非同源请求 => 就会触发浏览器的同源策略 => 不允许你获取这个服务器上的数据 触发了同源策略的请求叫：跨域请求 解决浏览器不允许请求别人家服务器的情况 + 基于 http 协议

1.建立一个本地的购物网站域名建立本地域名后，项目文件就可以不用放在WWW文件夹中，任一个路径即可，在浏览器中访问建立的域名：www.shop.com2.建立基本html页面，设计CSS样式3.list页面的业务逻辑根据数据库中的分类渲染列表页面的分类选项发送ajax请求 -> 后端到数据库中查询，将分类列表返回给前端 -> 前端根据返回结果渲染分类选项...

ajax 前后端交互的一种手段 + 通过 JS 向服务端发起请求 => 所有服务端返回的响应都不会直接显示再页面上 => 而是返回给 js 这个语言 说明: JS 和服务端交互 => 依赖于浏览器来发送请求 ajax => a: async => j: javascript => a: and => x: xml使用方式 1. 找到一个对象能帮我发送

session + 一个存在于 服务器 端的存储空间 + 当他打开的那一瞬间, 就会生成一个 "密码" + 这个密码会自动存储到 cookie 里面 + 等到返回前端的时候, 会自动把这个带回去 + 只要你想向 session 空间里面存储内容或者获取内容 => 必须要先开启, 后使用开启 session 空间 + session_start();存储一些数据 + PHP 有一个内置的 关联型数组就叫做 $_SESSION值就是session_id

后端操作 cookie 1. 获取 => php 天生自带一个关联型数组, 叫做 $_COOKIE => 里面包含所有的 cookie 信息 => 你想获取哪一个, 直接从关联型数组里面获取 2. 设置 cookie => 有一个方法叫做 setcookie() => 语法: setcookie(key, value, expires, path)/1. 后端获取 cookie print_r($_COOKIE);

Cookie + 浏览器端的本地存储空间 + 用来存储一些数据cookie 的特点(记下来!!!) 1. 按照域名存储的 + 哪一个域名存储的, 在当前域名下就可以访问 + 换一个域名就不能访问 2. 按照文件路径存储 + 你在 a 文件夹下存储的数据 + 只能在 a 文件夹及子文件夹访问 + 在 a 文件夹的上级目录不能访问 3. cookie 的存储时按照字符串的形式存储 + 'key=value; key2=value2; key

请求方式 + 前端和后端的交互手段 + 最早: 不分 GET POST => 后来为了语义化, 做了一些区分 => 本质是一样的常见的请求方式 HTTP/1.0 1. GET : 偏向于获取的方式 + 大部分都是给后端一些参数, 用来获取一些列数据 2. POST : 偏向于给服务器一些数据 + 大部分都是登录, 给服务器一些信息, 你给我一个简单的结果 3. PUT : 偏向于给服务器一些信息, 但是是添加使用

http 传输协议 + 前后端交互的方式 + 前端以什么样的形式发送数据给后端 + 后端以什么样的形式返回数据给前端传输协议 1. 必须经历四个步骤 1-1. 建立连接 1-2. 发送请求(前端给后端) 1-3. 返回响应(后端给前端) 1-4. 断开连接 2. 只能由前端发起 + 不能由后端主动沟通前端 3. 一次只能说一个事情 + 对于着一个事情你可以尽可能的描述的详细 + 但是一次连接只能沟通一个事情 4. 前后端

登录功能实现1、准备一个登录页面 login.html form 标签, 一个表单标签 + 有自动提交功能 + action: 提交到哪一个地址(哪一个 php 文件) + button 标签对: 等价于 submit 按钮, 点击的时候会自动提交 input + form 表单的自动提交 + 只会提交有 name 属性的表单 + name 的值作为 key,表单的 value 作为 value + 例子: => gu

查询的 sql 语句1. 查询所有 + SELECT * FROM `表` + 查询这个表里面的所有数据, 每一个数据的每一个字段都要$sql = 'SELECT * FROM `student`';2. 查询所有数据, 但是只要几个字段 + SELECT 字段1, 字段2, ... FROM `表`$sql = 'SELECT `name`, `age` FROM `student`';3. WHERE 关键字 + 按照条件查询 + SELECT * FROM `st

了解一下 mysql 数据库 关系型数据库，存储数据的 "仓库"(磁盘: D, E) + mysql 仓库是由很多的 database(库), 理解为 文件夹 => 一个网站的内容放在一个 库 里面 + 每一个 库 由多个 表 组成, 理解为一个文件 => 一类数据存储在一个表上 + 每一个表 由 表头 和 表体 组成 => 我们叫做 字段 和 数据导入 sql 文件 + 打开 MySQL 可视化工具 + 选择一个你要导入表的 库PHP

书写 php + php 代码书写在一个 .php 后缀得文件里面 + 必须写在 php 标签对内部 <?php ?> + 写在外面得内容, 当你在浏览器去运行这个 php 文件得时候 + 都会被当 html 来解析注意: 1. 每一句话都要有分号 2. 你要运行 php 文件, 必须启动 apche, 在服务器环境下访问文件 => localhost 学习 php 代码的书写 1. 定义变量 => $名字 = 值; =&g

ES6 的类 我们在 ES5 以前, 我们就用 函数 来充当 构造函数(类) + ES6 引入了一个 类 的概念 => 就是使用一个新的关键字来定义 构造函数(类) => 定义完毕以后, 就是一个类, 不能当作函数来调用 => 只能通过 new 来得到一个对象 类的语法: 语法: class 类名 { // 构造器, 我这个类创造的对象里面有哪些属性 constructor () {

对象访问机制当你访问一个对象的成员的时候, 会先在自己身上找 + 自己没有去到 __proto__ 上找 + 再没有, 再去 __proto__ 上找 + 一直找到顶级对象的 __proto__ 都没有 + 就返回 undefined 定义1: 每一个对象都有 __proto__ + 随便一个实例化对象的 __proto__ 是所属构造函数的 prototype 定义2: 每一个函数都有一个 prototype, 他是一个对象 + 每一个构造函数的 p

面向过程与面向对象面向过程 => 按照顺序一步一步来面向对象(轮播图) => 找到一个对象, 能帮我完成轮播图 => JS 本身没有, 我们需要第三方 => swiper: 生成一个完成轮播图的对象 面向对象的本质：当你需要完成一个 功能A 的时候，我们找到 JS 有没有这个完成 功能A 的对象。如果没有, 我们 制造一个 "机器"。 "机器" 是什么： + 能力: 能创造一个 有属性 有方法

解构赋值定义: 快速从 对象 或者 数组 里面获取一些数据 1. 解构数组 => 语法: let [变量1, 变量2, ...] = [数据1, 数据2, ...] => 也可以解构多维数组 2. 解构对象 => 语法: let { key1, key2, ... } = { 键值对1, 键值对2, ... } => 解构的时候可以给解构的变量起一个别名 -> { na

ES6 的箭头函数一种新的函数定义方式，对于函数表达式的简写方式(匿名函数) + 匿名函数 => var fn = function () {} => var obj = { fn: function () {} } => setTimeout(function () {}, 0) => setinterval(function () {}, 0) => [].forEach(function () {})

ES6 定义变量ES6 确认了两个定义变量的关键字 1. let : 变量 2. const : 常量 let/const 一起和 var 的区别 1. var 会进行预解析 => let/const 不会进行预解析, 必须先定义后使用 console.log(a)/undefined var a = 100 console.log(a)/100 /定义之前使用会报错 console.log(a)/报错 let a = 100

自执行函数 函数调用的一种方式 function fn() {}, fn() 语法: 1. (function () {})() 2. ~function () {}() 3. !function () {}() 作用： 一般是单独书写 js 文件的时候使用 => 为了保护变量不污染全局 => 每一个 js 文件里面初始化使用一个自执行函数包裹 => 把需要别的文件使用的变量挂载在全局

事件的传播定义: 当事件触发的时候, 会按照结构父级的顺序向上传递同类型事件直到 window 为止； 事件对象里面有一个信息叫做 path, 表示当前事件传播的路径<div class="outer"> <div class="center"> <div class="inner"></div> </div> </div> <p class="other"></p>

光标的坐标(重点) + 只要是鼠标事件, 任何鼠标事件都好使 1. clientX 和 clientY ：滚动条滚动会影响坐标值 光标距离可视窗口左上角的位置 2. pageX 和 pageY ：滚动条滚动不会影响坐标值 光标距离文档流左上角的位置 3. offsetX 和 offsetY 光标距离元素左上角的位置 元素: 光标触发事件的元素(不是事件源) 点在谁身上 扩展: 如

BOM - Browser Object Model 浏览器对象模型 + 浏览器给我们提供的一套操作浏览器窗口的属性和方法 + BOM 的顶级对象是 window => 是一个对象, 当你打开一个页面的时候就有一个 window => 你在全局定义的所有变量都在 window 下 + 所有和 BOM 相关的 API 都是 window.xxx => 在 JS 代码书写的时候, 可以省略 window. 不写...

定时器 单线程 + 代码从上到下的执行 + 一行一行的执行, 同时只能做一个事情 + 例子: 一个厕所, 只有一个坑 同步异步 + JS 是单线程同步代码机制 => 当你写一个死循环的时候, 后面的代码就全都不执行了 + WEBAPI 给我们提供了一个队列的机制 => 用来模拟多线程 => 准备了一个队列 => 我们叫做单线程异步 + 异步: => 不会立即执行

数组的创建1.字面量创建var =[ ]添加数据：var arr=[‘hello’,‘你好’]2.内置构造函数创建var arr=new Array()传递一个数字是数组的长度，空数组传递多个数字，就是里面的数据，不表示长度

对象是什么JS数据类型的一种，是一个复杂的数据类型，用来承载一堆数据。本质：抽象的描述一个事物两种创建方式1.字面量创建var obj={}2.内置构造函数创建var obj=new Object()两种创建方式的区别1.字面量创建可以再创建的时候直接添加一些数据数据以键值对的形式出现key:value2.内置构造函数不好直接添加成员直接创建一个空对象后期通过对象的操作语法来进行增删改查对象的操作语法1.点语法var o={}o.name='jack' /增o.

var myObject = { foo: "bar", func: function() { var self = this; console.log(this.foo); console.log(self.foo); (function() { console.log(this.foo); console.log(self.foo); }

函数的作用域作用域分两种：一个打开的页面是一个全局作用域每一个函数都是一个私有作用域对变量的限制：一个变量只能再自己的作用域中使用或者在下级作用域中使用，不能在上级作用域中使用作用域和函数的调用没有关系，是在定义时就确定了作用域的访问规则：自己有就用自己的自己没有就去上一级查找还没有就再上一级，直至window上都没有，就报错（is not defined）作用域的赋值规则：自己有就给自己赋值自己没有，就给上一级的赋值上一级没有就再上一级，直至window上都没有，就把这个变

函数的两个阶段定义阶段：1.声明式函数function fn() {}2.赋值式函数var fun=function () {}调用阶段：声明式函数可以在声明之前调用，也可以在声明之后调用赋值式函数只能在声明之后调用函数定义阶段做的事情1.开辟一个存储空间2.把函数体内的代码一模一样的存储在这个空间中（不解析变量）3.把空间的地址给到变量名函数的参数形参：函数体内定义的变量只能在函数体内使用形参的值取决于函数调用时传递的实参**实参：**给形参赋值函数参数的个数关系

循环循环的四个要素：初始化、条件判断、执行代码、自身改变var init=0while (init<3){console.log(init)init++}数组是一个复杂数据类型，按照索引0~正无穷排序var arr=[‘hello’, 1,2]三元运算符对if else的简写：条件？成立执行：不成立执行...

页面操作元素的id可以直接在js里面使用点击事件 btn.onclick = function(){}获取元素的value值元素.value给文本框赋值元素.value = xxx注意：页面中获取的内容都是字符串分支语句1.if2.switch注意：条件和情况一定要是 ===，没有break时继续向下执行...

一、数据类型1.基本数据类型数值number所有的数字表示NaN字符串string单引号和双引号包裹的一切内容转义符（\n \t）布尔 booleantrue falseundefined空 null2.复杂数据类型二、检测数据类型使用typeof 关键字，返回值是变量的数据类型三、数据类型转换1.转数值Number（变量）把这个数据当成一个整体来看待parseInt:把这个数据当作一个文本来看，从左到右一位一位的看，不认识小数点parseFloat:把这个数

三种书写形式行内式（不推荐）写在a标签的href属性中 href=“javascript:alert(‘hello world’);”写在非a标签上，依赖于行为， οnclick=“alert(‘你好世界’)”内嵌式写在script标签中，尽量写在head的末尾外链式写在.js后缀的文件中，通过script标签的src属性引入 注释单行 //多行 /* */变量在计算过程中保存一个中间值使用，只能保存一个值命名规则和规范命名规则只能数字、字母、下划线、美元符不能数字开