- 博客(100)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 vuex
vuex是什么？Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式简单来说: 对应用中组件的状态进行集中式的管理(读/写)状态自管理应用state: 驱动应用的数据源view: 以声明方式将state映射到视图actions: 响应在view上的用户输入导致的状态变化(包含n个更新状态的方法)多组件共享状态的问题多个视图依赖于同一状态来自不同视图的行为需要变更同一状态以前的解决办法 * 将数据以及操作数据的行为都定义在父组件 * 将数据以及操作数据的行为传递给需要的各
2021-03-25 23:38:15
162
原创 Vue组件化编码
1. vue脚手架用来创建vue项目的工具包创建项目: npm install -g vue-cli vue init webpack VueDemo开发环境运行: cd VueDemo npm install npm run dev生产环境打包发布 npm run build npm install -g serve serve dist http://localhost:50002. eslint用来做项目编码规范检查
2020-09-20 00:54:16
263
原创 VUE基础核心
模板引入Vue.js创建Vue对象el : 指定根element(选择器)data : 初始化数据(页面可以访问)双向数据绑定 : v-model显示数据 : {{xxx}}理解vue的mvvm实现<!--模板--><div id="test"> <input type="text" v-model="msg"><br><!--指令--> <input type="text" v-model="msg">&
2020-08-05 13:34:19
439
原创 ES6
let关键字let作用:与var类似, 用于声明一个变量特点:在块作用域内有效不能重复声明不会预处理, 不存在提升应用:循环遍历加监听使用let取代var是趋势//console.log(age);// age is not defined let age = 12; //let age = 13;不能重复声明 console.log(age); let btns = document.getElementsByTagName('button');
2020-07-28 21:19:54
263
原创 ES5
严格模式理解:除了正常运行模式(混杂模式)，ES5添加了第二种运行模式：“严格模式”（strict mode）。顾名思义，这种模式使得Javascript在更严格的语法条件下运行目的/作用消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为消除代码运行的一些不安全之处，为代码的安全运行保驾护航为未来新版本的Javascript做好铺垫使用在全局或函数的第一条语句定义为: ‘use strict’;如果浏览器不支持, 只解析为一条简单的语句, 没有任何副作用语法和行为
2020-07-13 02:14:32
87
原创 内存溢出与内存泄漏
内存溢出一种程序运行出现的错误当程序运行需要的内存超过了剩余的内存时, 就出抛出内存溢出的错误内存泄露占用的内存没有及时释放内存泄露积累多了就容易导致内存溢出常见的内存泄露:意外的全局变量没有及时清理的计时器或回调函数闭包例： // 1. 内存溢出 var obj = {} for (var i = 0; i < 100000000000; i++) { obj[i] = new Array(10000000000) } console.log('-.
2020-07-11 00:21:49
269
原创 线程机制与事件机制
线程与进程进程：程序的一次执行, 它占有一片独有的内存空间线程： CPU的基本调度单位, 是程序执行的一个完整流程进程与线程一个进程中一般至少有一个运行的线程: 主线程一个进程中也可以同时运行多个线程, 我们会说程序是多线程运行的一个进程内的数据可以供其中的多个线程直接共享多个进程之间的数据是不能直接共享的浏览器运行是单进程还是多进程?有的是单进程firefox老版IE有的是多进程chrome新版IE如何查看浏览器是否是多进程运行的呢?任务管理器==>进程浏览器运行
2020-07-11 00:18:19
319
原创 继承模式
原型链继承方式1: 原型链继承套路定义父类型构造函数给父类型的原型添加方法定义子类型的构造函数创建父类型的对象赋值给子类型的原型将子类型原型的构造属性设置为子类型给子类型原型添加方法创建子类型的对象: 可以调用父类型的方法关键：子类型的原型为父类型的一个实例对象 function Supper() { //父类型 this.superProp = 'The super prop' } //原型的数据所有的实例对
2020-07-10 22:56:50
137
原创 对象创建模式
Object函数构造模式方式一: Object构造函数模式套路: 先创建空Object对象, 再动态添加属性/方法适用场景: 起始时不确定对象内部数据问题: 语句太多 var ob = new Object(); ob = {}; ob.name = "凌月"; ob.age = 18; ob.setName = function (name) { name = this.name; }
2020-07-09 23:41:49
125
原创 闭包
理解闭包如何产生闭包?当一个嵌套的内部(子)函数引用了嵌套的外部(父)函数的变量(函数)时, 就产生了闭包闭包到底是什么?使用chrome调试查看理解一: 闭包是嵌套的内部函数(绝大部分人)理解二: 包含被引用变量(函数)的对象(极少数人)注意: 闭包存在于嵌套的内部函数中产生闭包的条件?函数嵌套内部函数引用了外部函数的数据(变量/函数)闭包的作用使用函数内部的变量在函数执行完后, 仍然存活在内存中(延长了局部变量的生命周期)让函数外部可以操作(读写)到函数内部的数据(变量/
2020-07-09 07:58:35
121
原创 作用域、作用域链
作用域理解就是一块"地盘", 一个代码段所在的区域它是静态的(相对于上下文对象), 在编写代码时就确定了分类全局作用域函数作用域没有块作用域(ES6有了)作用隔离变量，不同作用域下同名变量不会有冲突作用域与执行上下文区别1全局作用域之外，每个函数都会创建自己的作用域，作用域在函数定义时就已经确定了。而不是在函数调用时全局执行上下文环境是在全局作用域确定之后, js代码马上执行之前创建函数执行上下文环境是在调用函数时, 函数体代码执行之前创建区别2作用域是静态的, 只要函
2020-07-09 07:00:53
77
原创 执行上下文与执行上下文栈
变量提升与函数提升变量声明提升通过var定义(声明)的变量, 在定义语句之前就可以访问到值: undefined函数声明提升通过function声明的函数, 在之前就可以直接调用值: 函数定义(对象)//变量提升 var a = 4 function fn() { console.log(a) var a = 5 } fn();//函数提升 a2() // 可以
2020-07-09 06:47:51
119
原创 原型、原型链
原型（prototype）函数的prototype属性(图)每个函数都有一个prototype属性, 它默认指向一个Object空对象(即称为: 原型对象)原型对象中有一个属性constructor, 它指向函数对象给原型对象添加属性(一般都是方法)作用: 函数的所有实例对象自动拥有原型中的属性(方法) // 每个函数都有一个prototype属性, 它默认指向一个对象(即称为: 原型对象) console.log(Date.prototype, typeof Date.prototy
2020-07-09 05:29:19
80
原创 数据类型的分类和判断、数据,变量, 内存的理解、对象的理解和使用、函数的理解和使用
数据类型的分类和判断基本(值)类型Number ----- 任意数值 -------- typeofString ----- 任意字符串 ------ typeofBoolean ---- true/false ----- typeofundefined — undefined ----- typeof/===null -------- null ---------- ===对象(引用)类型Object ----- typeof/instanceofArray ------ instanc
2020-06-16 20:49:38
200
原创 轮播图
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ margin: 0; padding: 0; } /* * 设置outer的样式 */ #outer{ /*设置宽和高*/ width:
2020-06-12 21:37:17
110
原创 JSON
JSON- JS中的对象只有JS自己认识，其他的语言都不认识- JSON就是一个特殊格式的字符串，这个字符串可以被任意的语言所识别，并且可以转换为任意语言中的对象，JSON在开发中主要用来数据的交互- JSON- JavaScript Object Notation JS对象表示法- JSON和JS对象的格式一样，只不过JSON字符串中的属性名必须加双引号其他的和JS语法一致JSON分类：1.对象 {}2.数组 [] JSON中允许的值： 1.字符串
2020-06-12 21:33:31
128
原创 二级菜单
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>二级菜单</title> <style type="text/css"> * { margin: 0; padding: 0; list-style-type: none; } a,img { border: 0; text-
2020-06-12 21:07:59
158
原创 类的操作
类的操作通过style属性来修改元素的样式，每修改一个样式，浏览器就需要重新渲染一次页面这样的执行的性能是比较差的，而且这种形式当我们要修改多个样式时，也不太方便我希望一行代码，可以同时修改多个样式修改box的class属性我们可以通过修改元素的class属性来间接的修改样式这样一来，我们只需要修改一次，即可同时修改多个样式，浏览器只需要重新渲染页面一次，性能比较好，并且这种方式，可以使表现和行为进一步的分离 box.className += " b2
2020-06-10 18:16:21
197
原创 定时器、延时调用
定时调用window.onload = function(){ //获取count var count = document.getElementById("count"); //使count中的内容，自动切换 /* * JS的程序的执行速度是非常非常快的 * 如果希望一段程序，可以每间隔一段时间执行一次，可以使用定时调用 */ /*for(var i=0 ; i<10000 ; i++){ cou
2020-06-09 22:57:54
342
原创 BOM
BOM- 浏览器对象模型- BOM可以使我们通过JS来操作浏览器- 在BOM中为我们提供了一组对象，用来完成对浏览器的操作- BOM对象Window- 代表的是整个浏览器的窗口，同时window也是网页中的全局对象Navigator- 代表的当前浏览器的信息，通过该对象可以来识别不同的浏览器Location- 代表当前浏览器的地址栏信息，通过Location可以获取地址栏信息，或者操作浏览器跳转页面History- 代表浏览器的历史记录，可以通过该对象来操作浏览器的历史记录由于隐私
2020-06-04 09:33:37
102
原创 拖拽、滚轮事件、键盘事件
拖拽 #box1{ width: 100px; height: 100px; background-color: red; position: absolute; } #box2{ width: 100px; height: 100px; background-color: yellow; position: absolute; left: 200px; top: 200px;
2020-06-04 09:10:33
240
原创 事件的委派、事件的绑定、事件的传播
事件的委派<body> <button id="btn01">添加超链接</button> <ul id="u1" style="background-color: #bfa;"> <li> <p>我是p元素</p> </li> <li><a href="javascript:;" class="link">超链接一</a></l
2020-06-03 00:48:55
166
原创 DOM对CSS的操作、事件（Event）、事件的冒泡（Bubble）
DOM对CSS的操作- 读取和修改内联样式- 使用style属性来操作元素的内联样式- 读取内联样式：语法：元素.style.样式名- 例子：元素.style.width元素.style.height- 注意：如果样式名中带有-，则需要将样式名修改为驼峰命名法将-去掉，然后-后的字母改大写- 比如：background-color --> backgroundColorborder-width —> borderWidth- 修改内联样式：语法：元素.style.样式名
2020-06-02 23:48:47
471
原创 DOM操作
DOM操作- DOM查询- 在网页中浏览器已经为我们提供了document对象，它代表的是整个网页，它是window对象的属性，可以在页面中直接使用。- document查询方法：- 根据元素的id属性查询一个元素节点对象：- document.getElementById("id属性值");- 根据元素的name属性值查询一组元素节点对象:- document.getElementsByName("name属性值");- 根据标签名来查询一组元素节点对象：- document.ge
2020-06-02 06:35:47
86
原创 正则表达式
正则表达式正则表达式用于定义一些字符串的规则，计算机可以根据正则表达式，来检查一个字符串是否符合规则，获取将字符串中符合规则的内容提取出来语法：var 变量 = new RegExp("正则表达式","匹配模式");使用typeof检查正则对象，会返回objectvar reg = new RegExp("a"); 这个正则表达式可以来检查一个字符串中是否含有a在构造函数中可以传递一个匹配模式作为第二个参数，可以是i 忽略大小写g 全局匹配模式使用字面量来创建正则表达式语法：v
2020-05-30 22:08:41
92
转载 字符串相关的方法
字符串相关的方法在底层字符串是以字符数组的形式保存的[“H”,“e”,“l”]length属性- 可以用来获取字符串的长度console.log(str.length);console.log(str[5]);charAt()- 可以返回字符串中指定位置的字符- 根据索引获取指定的字符str = "中Hello Atguigu";var result = str.charAt(6);charCodeAt()- 获取指定位置字符的字符编码（Unicode编码）result =
2020-05-29 09:00:42
94
原创 Math
Math- Math和其他的对象不同，它不是一个构造函数，它属于一个工具类不用创建对象，它里边封装了数学运算相关的属性和方法- 比如Math.PI 表示的圆周率console.log(Math.PI);abs() 可以用来计算一个数的绝对值console.log(Math.abs(-1));Math.ceil()- 可以对一个数进行向上取整，小数位只有有值就自动进1console.log(Math.ceil(1.1));//2Math.floor()- 可以对一个数进行向下取整
2020-05-29 08:13:07
66
原创 Date
DateDate对象- 在JS中使用Date对象来表示一个时间创建一个Date对象如果直接使用构造函数创建一个Date对象，则会封装为当前代码执行的时间var d = new Date();创建一个指定的时间对象需要在构造函数中传递一个表示时间的字符串作为参数日期的格式 月份日年 时:分:秒var d2 = new Date("2182011 11:10:30");getDate()- 获取当前日期对象是几日var date = d2.getDate();getDay()
2020-05-29 07:50:52
118
原创 call()、apply()、arguments
call()和apply() - 这两个方法都是函数对象的方法，需要通过函数对象来调用 - 当对函数调用call()和apply()都会调用函数执行 - 在调用call()和apply()可以将一个对象指定为第一个参数 此时这个对象将会成为函数执行时的this - call()方法可以将实参在对象之后依次传递 - apply()方法需要将实参封装到一个数组中统一传递- this的情况：1.以函数形式调用时，this永远都是window2.
2020-05-29 07:36:13
103
原创 数组的方法
数组的方法push()- 该方法可以向数组的末尾添加一个或多个元素，并返回数组的新的长度- 可以将要添加的元素作为方法的参数传递，这样这些元素将会自动添加到数组的末尾- 该方法会将数组新的长度作为返回值返回var result = arr.push("参数1","参数2","参数3","参数4");pop()- 该方法可以删除数组的最后一个元素,并将被删除的元素作为返回值返回result = arr.pop();unshift()- 向数组开头添加一个或多个元素，并返回新的数组长度
2020-05-29 06:34:27
174
转载 forEach
forEach一般我们都是使用for循环去遍历数组，JS中还为我们提供了一个方法，用来遍历数组forEach()- 这个方法只支持IE8以上的浏览器IE8及以下的浏览器均不支持该方法，所以如果需要兼容IE8，则不要使用forEach还是使用for循环来遍历forEach()方法需要一个函数作为参数- 像这种函数，由我们创建但是不由我们调用的，我们称为回调函数- 数组中有几个元素函数就会执行几次，每次执行时，浏览器会将遍历到的元素以实参的形式传递进来，我们可以来定义形参，来读取这些内容-
2020-05-29 06:17:39
107
原创 数组（Array）
数组（Array）内建对象宿主对象自定义对象数组（Array）- 数组也是一个对象- 它和我们普通对象功能类似，也是用来存储一些值的- 不同的是普通对象是使用字符串作为属性名的，而数组时使用数字来作为索引操作元素- 索引：从0开始的整数就是索引- 数组的存储性能比普通对象要好，在开发中我们经常使用数组来存储一些数据创建数组对象var arr = new Array();使用typeof检查一个数组时，会返回objectconsole.log(typeof arr);向数组
2020-05-29 05:44:33
284
原创 原型、toString、垃圾回收（GC）
原型prototype我们所创建的每一个函数，解析器都会向函数中添加一个属性prototype这个属性对应着一个对象，这个对象就是我们所谓的原型对象如果函数作为普通函数调用prototype没有任何作用当函数以构造函数的形式调用时，它所创建的对象中都会有一个隐含的属性，指向该构造函数的原型对象，我们可以通过__proto__来访问该属性原型对象就相当于一个公共的区域，所有同一个类的实例都可以访问到这个原型对象，我们可以将对象中共有的内容，统一设置到原型对象中。当我们访问对象的一个属性或方法时
2020-05-29 05:04:02
306
原创 返回值、立即执行函数、对象、枚举、作用域（scope）、 this、工厂方法创建对象、构造函数
返回值创建一个函数，用来计算三个数的和可以使用 return 来设置函数的返回值语法：return 值return后的值将会会作为函数的执行结果返回， 可以定义一个变量，来接收该结果在函数中return后的语句都不会执行如果return语句后不跟任何值就相当于返回一个undefined，如果函数中不写return，则也会返回undefinedreturn后可以跟任意类型的值function sum(a , b , c){ //alert(a + b +c);
2020-05-27 21:30:47
148
原创 对象、属性名和属性值、基本和引用数据类型、对象字面量、函数、函数的参数
对象JS中数据类型- String 字符串- Number 数值- Boolean 布尔值- Null 空值- Undefined 未定义- 以上这五种类型属于基本数据类型，以后我们看到的值只要不是上边的5种，全都是对象- Object 对象 基本数据类型都是单一的值"hello" 123 true, 值和值之间没有任何的联系。 在JS中来表示一个人的信息（name gender age）： var name = "孙悟空"; var
2020-05-26 20:22:24
816
原创 流程控制语句
流程控制语句- JS中的程序是从上到下一行一行执行的- 通过流程控制语句可以控制程序执行流程，使程序可以根据一定的条件来选择执行- 语句的分类：1.条件判断语句2.条件分支语句3.循环语句if条件判断语句：- 使用条件判断语句可以在执行某个语句之前进行判断，如果条件成立才会执行语句，条件不成立则语句不执行。- if语句- 语法一：if(条件表达式){语句…}if语句在执行时，会先对条件表达式进行求值判断，如果条件表达式的值为true，则执行if后的语句，如果条件表达式的
2020-05-26 08:19:06
118
原创 运算符
逻辑运算符JS中为我们提供了三种逻辑运算符! 非- !可以用来对一个值进行非运算- 所谓非运算就是值对一个布尔值进行取反操作，true变false，false变true- 如果对一个值进行两次取反，它不会变化- 如果对非布尔值进行元素，则会将其转换为布尔值，然后再取反所以我们可以利用该特点，来将一个其他的数据类型转换为布尔值可以为一个任意数据类型取两次反，来将其转换为布尔值，原理和Boolean()函数一样&& 与- &&可以对符号两侧的值进行与运算并
2020-05-25 20:46:16
80
原创 强制转换与运算符、++与--
强制类型转换强制类型转换- 指将一个数据类型强制转换为其他的数据类型- 类型转换主要指，将其他的数据类型，转换为String Number Boolean将其他的数据类型转换为String方式一：- 调用被转换数据类型的toString()方法- 该方法不会影响到原变量，它会将转换的结果返回- 但是注意：null和undefined这两个值没有toString()方法，如果调用他们的方法，会报错//调用a的toString()方法 //调用xxx的yyy()方法，就是xxx.yy
2020-05-24 19:39:40
684
原创 初识JavaScript
JavaScript是什么是页面上的脚本语言JavaScript作用实现网页动态效果表单验证<script type="text/javascript"></script>JavaScript用法1）<head>JS代码 </head>2）<body>JS代码</body>3）某一行里<inpu...
2020-05-24 17:28:32
442
原创 像素、视口、移动端页面、VW适配、响应式布局、媒体查询
像素像素：- 屏幕是由一个一个发光的小点构成，这一个个的小点就是像素- 分辨率：1920 x 1080 说的就是屏幕中小点的数量- 在前端开发中像素要分成两种情况讨论：CSS像素 和 物理像素- 物理像素，上述所说的小点点就属于物理像素- CSS像素，编写网页时，我们所用像素都是CSS像素- 浏览器在显示网页时，需要将CSS像素转换为物理像素然后再呈现- 一个css像素最终由几个物理像素显示，由浏览器决定：默认情况下在pc端，一个css像素 = 一个物理像素视口（viewport）-
2020-05-24 06:59:06
673
空空如也
运行vue项目疯狂报错，求个大佬指教
2020-10-18
TA创建的收藏夹 TA关注的收藏夹
TA关注的人