- 博客(29)
- 收藏
- 关注
RSS订阅原创 Typescript
Typescript1// //类型为number// let a:number// //只可以是数字// a=10// //如果变量的声明和赋值同时进行的，ts可以自动对变量进行类型检测// let c = false// c = true//:number返回值是number// function sum(a:number,b:number):number{// return a + b// }// let result = sum(1,2)/* //联合类型
2022-05-20 16:54:52
176
原创 vue-router
路由理解：一个路由(route)就是一组映射关系(key-value),多个路由需要多个路由器（router）进行管理前端路由：key是路径，value是组件1.基本使用安装vue-router，命令：npm i vue-router应用插件：Vue.use(VueRouter)编写router配置项://引入VueRouterimport VueRouter from 'vue-router'//引入路由组件import About from '../component
2022-05-20 16:53:11
106
原创 Vuex浅学
Vuex1.概念 在Vue中实现集中式状态（数据）管理的一个Vue插件，对vue应用中多个组件的共享状态进行集中式的管理（读/写），也是一种组件间通信的方式，且适用于任意组件间通信2.何时使用多组件需要共享数据时3.搭建vuex环境创建文件：src/store/index.js//引入Vue核心库import Vue from 'vue'//引入Vueximport Vuex from 'vuex'//应用Vuex插件Vue.use(Vuex)//准备actions对象-
2022-05-20 16:52:28
124
原创 this指向
this指向全局this 指向windowconsole.log(this); 普通函数中this 非严格模式下指向window，严格模式下指向undefinedfunction fn(){ console.log(this); } fn();// window || undefined var obj={ a:function(){ function fn1(){ console.log(this)
2022-04-06 15:03:45
236
原创 jQuery
jQueryjQuery实现了一套与原生js一样的方法处理，只不过方法缩短内容，更简易，适用多个浏览器要想使用jquery方法就必须是jquery对象。不能使用DOM对象操作jquery方法在jQuery中 $就是jQuery对象function jQuery(){ } var $=jQuery; jQuery对象和DOM对象 (页首) var divs = document.querySelectorAll("div") // DOM对象列表 $("div") //jQue
2022-03-30 22:38:43
861
原创 正则表达式
认识正则表达式 - Regular Expression目的: 验证字符串是否符合规则是一个 复杂数据类型正则表达式的创建字面量方式创建=> 语法: var reg = /abcd/内置构造函数创建=> 语法: var reg = new RegExp(‘abcd’)// 1. 字面量方式创建 const r1 = /abcd/ console.log(r1) // 2. 内置构造函数创建 const r2 = new RegExp(
2022-03-09 18:03:06
153
原创 字符串方法
字符串常用方法都是操作字符串的方法通用语法: 字符串.xxx()注意: 所有字符串方法都不会改变原始字符串, 而是以返回值给出结果charAt()语法: 字符串.charAt(索引)返回值: 该索引位置的字符注意: 当没有该索引位置的时候, 返回值是一个 空字符串(’’)charCodeAt()语法: 字符串.charCodeAt(索引)返回值: 该索引位置的字符的编码(unicode)注意: 返回值是一个 Number 类型, 如果没有该索引位置, 返回 NaN
2022-03-05 20:39:37
106
原创 java script数组方法：
数组方法总结数组常用方法 - 总结 1. push() => 后面追加 => 返回值: 追加后数组最新的长度 2. pop() => 后面删除 => 返回值: 被删除的数据 3. unshift() => 前面添加 => 返回值: 添加后数组最新的长度 4. shift() => 前面删除 => 返回值: 被删除的数据 5. reverse() => 数
2022-03-05 20:39:08
197
原创 JS学习-事件
认识事件指的是和浏览器内的某一个节点约定一个事情, 当用户发生指定行为的时候会执行指定的某一段代码事件三要素:事件源: 绑定在谁身上的事件事件类型: 绑定的什么事件事件处理函数: 当行为发生的时候, 执行的函数定义: 在事件处理函数内, this 关键字就是 事件源注意1: 所有的事件类型, 都是只要有行为发生, 有事件处理函数的绑定, 就会触发函数注意2: 键盘事件所有元素都可以绑定, 但是不是所有元素都能触发(一般绑定给 window, document, 表单元素)注意3:
2022-03-05 20:38:13
192
原创 购物车案例
购物车案例HTML：<html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</
2022-03-05 14:17:15
82
原创 JS穿墙效果案例
穿墙效果案例：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <tit
2022-03-04 23:01:27
80
原创 鼠标拖拽1--JS
鼠标拖拽(1)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Doc
2022-03-04 21:38:25
57
原创 鼠标跟随案例JS
鼠标跟随案例/* 案例 - 鼠标跟随 需求: + 默认, 提示盒子是隐藏 + 当鼠标移入哪一个 li 的时候, 哪一个 li 对应的提示盒子显示 + 当鼠标移出哪一个 li 的时候, 哪一个 li 对应的提示盒子隐藏 + 当鼠标在哪一个 li 内移动的时候, 哪一个 li 对应的提示盒子跟随鼠标移动 问题1: 什么时候出现效果 ? + 鼠标移入 + 鼠标移出
2022-03-04 21:01:28
454
原创 事件对象 - Event
事件对象 - Event事件对象 - Event是一个对象数据类型, 内部存储的内容是对当前事件的描述信息概念: 本次事件触发的时候, 对于本次事件细节的所有描述信息的一个对象数据类型如何获取事件对象标准浏览器直接在事件处理函数位置接受一个形参, 形参就是事件对象会在事件触发的时候, 有浏览器自动传递实参xxx.onclick = function (xxx) {}xxx.addEventLustener(‘click’, function (xxx) {}) var ele =
2022-03-04 19:43:03
159
原创 事件绑定和事件解绑
事件绑定、事件解绑事件绑定：在 JS 内有两种事件绑定方式DOM 0级 事件绑定使用 on 语法进行绑定语法: 事件源.on事件类型 = 事件处理函数特点: 同一个事件源的同一个事件类型只能绑定一个事件处理函数DOM 2级 事件绑定(事件侦听器/事件监听器)标准浏览器：语法: 事件源.addEventListener(‘事件类型’, 事件处理函数)特点: 同一个事件源的同一个事件类型可以绑定多个事件处理函数, 顺序绑定顺序执行IE 低版本语法: 事件源.attachEvent(
2022-03-04 19:42:21
192
原创 认识结点:
认识结点节点: 一个小小的组成部分 我们的页面就是由若干个节点组成 常见的 DOM 节点: 元素节点 特指页面上的所有标签 属性节点 书写在标签身上的属性(原生属性 和 自定义属性) => 属性节点不作为独立节点出现, 只是用来修饰标签使用的 文本节点 所有的文本内容(包含换行和空格) 注释节点 所有的注释内容(包含换行和空格)获取节点第一类: 获取元素节点获取非常规元素节点html: do
2022-03-03 22:54:53
149
原创 认识BOM
认识BOM (一)认识 BOM - Browser Object Model 浏览器对象模型提供给我们一整套操作浏览器相关内容的属性和方法特点:操作的都是和浏览器这个软件本身相关的内容(滚动条, 地址栏, 标签页, 弹窗, …)所有的 BOM 相关操作, 在各个浏览器表现形式不一样BOM 操作一般都是 window.xxxx, 书写的时候, 可以省略 window. 不写浏览器可视窗口大小获取浏览器可视窗口的大小语法:window.innerWidthwindow.inn
2022-03-02 21:42:03
72
原创 数组常用方法2
数组常用方法2reverse()语法: 数组.reverse()作用: 反转数组返回值: 反转以后的数组var arr = [ 1, 6, 4, 2, 9, 5, 7, 3, 8, 11, 22, 17, 10, 35, 21, 100 ] console.log('原始数组 : ', arr)var res = arr.reverse() console.log('反转之后 : ', arr) console.log('返回值 : ', res) // 复杂
2022-02-28 22:26:03
54
原创 数组常用方法1
数组常用方法1push()语法:数组.push(数据)数组.push(数据, 数据2, 数据3, 数据4, …)作用: 按照顺序向数组的后面追加你插入的数据返回值: 追加数据以后, 数组最新的长度 var arr = [ 'hello', 'world', '你好', '世界' ] console.log('原始数组 : ', arr) var res = arr.push('新来的') var res = arr.push('新来的', 100, 2
2022-02-28 20:13:40
109
原创 选择排序：
选择排序逻辑遍历数组, 找到数组中最小的数字, 和最前面一个数字对调第二轮开始，跳过第一个，剩下的继续重复步骤一第 x 轮外层循环控制变量假设里层循环开始对调1001[0] 和 [minIndex]2112[1] 和 [minIndex]3223[2] 和 [minIndex]代码：步骤1:// 1-1. 遍历找到最小的数字的索引 // 假设 [0] 位置数据最小 var minIndex = 0 /
2022-02-28 19:49:38
64
原创 计数排序：
计数排序逻辑准备一个新数组遍历原始数组，把原始数字当做新数组的索引向新数组内填充数据新数组的数据按照计数排列遍历新数组把索引当做数据放进原数组内前提：把原数组清空实现准备一个原始数组和新数组var origin = [ 9, 3, 100, 6, 4, 100, 1, 9, 8, 7, 2, 2, 5, 100, 3, 32, 55 ] console.log('原始数组 : ', origin) // 准备一个新数组 var newarr
2022-02-28 19:30:17
111
原创 冒泡排序:
冒泡排序逻辑遍历数组，两两对比，把相对较大的数字向后移动遍历一遍以后，得到的结果就是最大数字一定在后面重复步骤1，继续比较，两轮以后，最大的两个数字一定排在最后两个位置不管多少数字，只要比较总长度 -1 轮，那么数组排序就完成了步骤分析步骤0：交换数组内两个位置的数据借助第三个变量来实现，交换 [0] 和 [1] 位置的数据var tmp = arr[0]arr[0] = arr[1]arr[1] = tmptmp = nullconso console.log('交换完毕
2022-02-28 18:30:36
49
原创 认识对象数据类型 - Object
认识对象数据类型 - Object认识对象数据类型 - Object：是 js 中的一个数据类型, 是一个复杂数据类型是一个 “盒子”, 承载的是 数据是一个无序的数据集合, 也是一个键(key)值(value)对的集合对象数据类型的创建1.字面量方式创建对象创建空对象: var obj = {}创建带有数据的对象: var obj = { 键值对 }键值对, 键: 值可以书写多个, 多个之间使用 逗号(,) 分隔最后一个键值对后面不需要书写 逗号(,), 可以写但是不推荐 //
2022-02-27 14:31:19
323
原创 JavaScript--函数：
函数：认识函数函数是一个 js 的数据类型, 叫做 Function是一个复杂数据类型(地址/引用私人: 就是一个 “盒子”, 这个 “盒子” 可以承载一段代码涉及到两个过程：函数定义阶段: 把代码装进盒子的过程函数调用阶段: 把盒子内的代码执行的过程函数定义阶段就是一个把代码装进 “盒子” 的过程在这个过程中, 被装进去的代码是不会执行的方式1: 声明式函数语法: function 函数名() { 你要装进盒子的代码 }function 定义函数的关
2022-02-27 14:29:24
48
原创 arguments
arguments:是一个在函数内使用的变量是函数的天生自带的变量是一个数据集合(承载数据的盒子)承载的就是该函数被调用的时候传递的所有 实参函数实参的集合arguments 的基本操作length 属性:语法: arguments.length表示: 该数据集合内有多少个数据, 也就是你传递了多少个实参得到: 是一个数值类型(Number)索引属性:arguments 内的数据是按照顺序依次排列的arguments 内的每一个数据都有一个自己的 “序号”(索引/下标)
2022-02-27 14:27:42
62
原创 预解析（无改动）
预解析预解析: 在所有代码开始执行之前, 对代码进行通读并解释, 解释完毕以后再开始执行代码函数调用问题：在函数定义的时候, 被装进 “盒子” 内的代码是不会执行的在函数调用的时候, 代码才会执行预解析有两部分：全局预解析：打开页面的时候，会对全局代码进行预解析，但函数体内的代码不管局部预解析：当你函数调用的时候，会在函数的私有作用域下进行预解析，解析完毕执行函数体内代码预解析都解释哪些内容：var声明式函数var的预解析：向浏览器内存声明, 有一个变量被定义了, 但是
2022-02-27 14:21:28
96
原创 数据类型赋值：
数据类型赋值：变量的赋值: 把当前变量内存储的内容一模一样的复制一份给到另一个变量基本数据类型 因为变量中就是直接存储的准确的值 赋值的过程中, 就是把准确的值复制了一份给到另一个变量 赋值以后, 两个变量没有任何关系复杂数据类型因为变量中存储的不是准确的数据结构, 存储的是 地址赋值的过程中, 是把变量中存储的地址复制了一份给到另一个变量赋值以后, 两个变量操作同一个存储空间函数的形参和实参的交互, 以及函数的返回值也是赋值的一种
2022-02-27 14:20:43
404
原创 作用域学习
作用域：变量（变量名/函数名）的生效使用范围作用域的分类：全局作用域（window）：一个html页面打开就是一个全局作用域私有作用域：只有函数生成私有作用域只要你书写了一个函数，就i会生成一个私有作用域一经书写，作用域永生不变作用于上下级关系：书写在哪一个作用域内的函数, 就是哪一个作用域的子级作用域提供了三个机制：1.变量定义机制：定义在哪一个作用域下的变量, 就是哪一个作用域的私有变量只能在当前作用域以及后代作用域内使用 // 在全局定义变量 var
2022-02-27 14:18:58
50
原创 前端学习：预解析
预解析预解析: 在所有代码开始执行之前, 对代码进行通读并解释, 解释完毕以后再开始执行代码函数调用问题： 在函数定义的时候, 被装进 "盒子" 内的代码是不会执行的 在函数调用的时候, 代码才会执行 预解析有两部分： 全局预解析：打开页面的时候，会对全局代码进行预解析，但函数体内的代码不管 局部预解析：当你函数调用的时候，会在函数的私有作用域下进行预解析，解析完毕执行函数体内代码 预解析都解释哪些内容： var 声明式函数 var的预解析
2022-02-25 21:39:53
670
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人