请叫我杰拉德6-CSDN博客

原创 css样式书写顺序及原理

浏览器对 CSS 的匹配原理浏览器CSS匹配不是从左到右进行查找，而是从右到左进行查找。例如： #divBox p span .red{color:red;}浏览器的查找顺序如下：先查找 html 中所有 class=’red’ 的 span 元素，找到后，再查找其父辈元素中是否有p元素，再判断p的父元素中是否有 id 为 divBox 的 div 元素，如果都存在，则 CSS 匹配上CSS选择器解析的顺序是从右至左，css源文件经过浏览器解析后会检索html树，如果从左往右匹配，当匹配失败时会

2022-04-04 11:28:38 1541

原创数组方法总结

一、稀松数组1、稀松数组概念;2、访问empty打印值是undefined;二、类数组（是对象，有length属性，可以通过[ ]访问，但是没有Array上的方法） 1、arguments 2、DOM List 3、String --> var str ='12345'; console.log(str[1]);//2 console.log(str.length);//5三、数组上面方法：ES5和以前1

2022-03-14 13:08:21 413

原创 this指向总结

1、默认绑定规则：this指向windows1、console.log(this === window) //true2、函数独立调用,函数独立调用理解：test()，没有借助外物 function test(){ console.log(this === windows)};test()//true 每个函数执行都会产生一个this，this都不一样，具体指向可能是一样的，这个要看执行方式决定的var obj ={ a: 2, foo

2022-03-14 12:04:36 457

原创 undefined和null的区别

undefined和null有何区别

2022-01-28 10:11:49 1466 1

原创 ES6-4.扩展对象的功能性

1、对象字面量语法扩展-属性初始值的简写例如下面的代码，属性初始化如果key值和变量名一直，可以省略不写 <script> // ES5 初始化属性 function createPerson(name , age){ return { name: name, age: age }; } // ES6初始化属

2022-01-28 09:28:24 486

原创 ES6-5.对象和数组解构

1、对象解构例如以下代码：直接将对象node解析成type和name变量。 <script> const node ={ type:"monkey", name:"swk" }; const {type, name} = node; console.log(type); //monkey

2022-01-28 09:28:01 746

原创 ES6-6.Set集合和Map集合

一、Set集合Set集合是一种包含多多个重复值的无序列表，可以快速访问其中的数据，更有效的追踪各种离散值1、创建Set集合并添加元素 //由于在set集合中，不会对所存值进行强制的类型转换，所以数字5和字符串'5'可以作为独立的元素存在 let set = new Set(); set.add(5); set.add('5'); console.log(set.size); //2 //因为不会强制转换，所以可以添加多个对象 le

2022-01-28 09:27:25 302

原创 ES6-6.Symbol和Symbol属性

1.Symbol概念Symbol是ES6中新引进一种原始数据类型，主要作用是可以表示独一无二的值，比如定义对象的唯一属性名，定义不会重复的常量2.Symbol语法-基础用法场景：定义不会重复的常量Symbol（‘描述符’） // 描述信息可有可无使用Symbol注意事项：1.不能new 一个Symbol出来，因为Symbol不是构造函数，否则会报错let s = new Symbol();console.log(s); //报错：Symbol is not a constructor

2022-01-28 09:27:05 1447

原创 ES6-3.函数

1、函数形参的默认值在ES5中函数定义了参数，如果要设置默认值，则需要在函数内进行判断处理，例如：要进行判断然后给出相应的默认值 function makeRequest(url, timeout, callback){ timeout = (typeof timeout !== 'undefined')? timeout :2000; callback = (typeof callback !== 'undefined')? callback :function

2022-01-28 09:26:30 427

原创 ES6-1.块级作用域绑定

块级作用域绑定，let和const

2022-01-28 09:24:49 285

原创 2021最好理解的Promise

一.为什么需要promise传统通过ajax请求数据，需要在回调函数中层层嵌套回调，这种结构叫做回调地狱，不利于阅读和后期维护Promise出现正好解决了回调地狱二.Promise的基本使用Promise是一个构造函数，通过new关键字实例化对象语法：new Priomise（（resolve， reject）=> { }）Promise接收一个函数作为参数在参数函数中接收两个参数resolve：成功函数reject：失败函数Promise实例Promise实例有两个属

2021-09-06 20:48:10 131

原创 Vue.js--自定义指令

在Vue中自定义指令分为：全局自定义指令和局部自定义指令1.全局自定义指令①首先自定义一个叫’focus’的自定义指令，使用时候加 v-focus 即可，加上v-focus，执行时候会干一件事情，会有一个叫 mounted 生命周期函数，指的是当这个指令挂载到某个dom节点上，mounted函数会自动执行，并且接收第一个参数el（当前挂载dom节点），然后开始自动执行el.focus()②不管是全局自定义指令和局部自定义指令，里面都可以调用Vue生命周期函数，比如mounted（），before

2021-07-21 22:21:02 322 2

原创 Vue.js--动画

1、在Vue中实现一个简单的小动画<style> @keyframes leftToRight { 0% { transform: translateX(-100px); } 50% { transform: translateX(-50px); } 0% {

2021-07-21 22:20:37 922 3

原创 Vue.js基础---组件

Vue.js基础—组件组件，就是网页上面分割出来的一部分，一部分的内容，小到甚至一个购物车，一个输入框都可以看成是一个组件1、创建父组件和子组件创建一个父组件和一个子组件<body> <div id="root"></div> <script src="./vue.global.js"></script> <script> //创建一个Vue实例 const app

2021-07-21 22:20:02 306 6

原创 Vue.js基础---常用内置指令

Vue.js基础—常用内置指令1.v-html和v-text的区别v-html作用：更新元素的 innerHTML(innerHTML 指的是标签间的所有内容,并且innerHTML包含标签，标签会被识别，并且会被解析，呈现对应的效果)v-text作用：更新元素的 textContent相同点：2者在标签内设置内容都无效<body> <div id="app"> <div :style="{fontSize:fontSize + 'px' }

2021-07-07 21:53:19 350 1

原创 Vue.js基础---简单的模板页面

Vue.js基础—简单的模板页面1.模板页面包含了哪些东西？–> html + js2.js以什么形式(语法)存在？插值: 双大括号表达式，插入一个动态的值在标签内文本内容上，动态显示数据指令: vue自定义标签属性(以v-开头)，属性值是一个js的表达式 v-model=“msg”，指令操作的是标签指令和插值中的表达式自动从data中动态取数据3.双向数据绑定, 2个重要特点:只要改变data中的数据值, 界面就自动更新 ===> 数据(单向)绑定 data =

2021-07-03 17:07:57 1175 1

原创过滤器

理解：对要显示的数据进行特定的格式化后再显示，但它并没有改变原数据，只是产生新的对应数据项目需求，接收到数据为35000，展示数据时显示3.5万过滤器分为全局和局部，先用局部过滤器，后面再用全局的办法来解决局部过滤器：用于差值表达式和v-bind<div id="demo"> {{price | priceFilter}}</div></div><script

2021-05-23 22:00:22 51

原创 Vue实例生命周期钩子函数

理解：每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自己的代码的机会这些生命周期钩子函数，是Vue定义好了的，它没有去使用，是给你干活用的...

2021-05-23 21:07:29 58

原创 Js高级-ES6

一.let作用：同var一样用来声明变量特点在块级作用域内有效不能重复声明变量提升全局变量提升：会创建一个变量对象（script）用来收集全局作用域下let定义的变量局部变量提升：会将var let定义的变量全部放到当前函数的变量对象中同var的变量提升的区别：let提升的变量在为赋值之前不允许被使用应用循环遍历加监听使用let取代var是趋势二.const关键字作用：定义一个常量特点：不能修改，其他特点同let应用：保存不用改变的数据三.解构赋值理解：从对象或数组中提取数

2021-05-01 10:26:44 161

原创 Js高级-ES5

01.严格模式1.理解:除了正常运行模式(混杂模式)，ES5添加了第二种运行模式：“严格模式”（strict mode）顾名思义，这种模式使得Javascript在更严格的语法条件下运行目的/作用消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为消除代码运行的一些不安全之处，为代码的安全运行保驾护航为未来新版本的Javascript做好铺垫3.使用在全局或函数的第一条语句定义为: ‘use strict’;如果浏览器不支持, 只解析为一条简单的语句, 没

2021-05-01 10:26:20 119

原创 Js高级-对象的理解

一：对象基础1.什么是对象?代表现实中的某个事物, 是该事物在编程中的抽象多个数据的集合体(封装体)用于保存多个数据的容器2.为什么要用对象?便于对多个数据进行统一管理3.对象的组成①属性代表现实事物的状态数据由属性名和属性值组成属性名都是字符串类型, 属性值是任意类型②方法代表现实事物的行为数据是特别的属性==>属性值是函数4.如何访问对象内部数据?属性名: 编码简单, 但有时不能用[‘属性名’]: 编码麻烦, 但通用5.难点：对

2021-03-16 21:31:29 87

原创 Js高级-函数的理解

一函数的理解：理解函数也是对象函数是特殊的对象，因为函数具备行为，通过调用可以执行内部语句定义函数方式函数声明式：function fun(){}函数表达式： var fun2 = function(){}调用函数方式test() 直接加括号调用new test() 以构造函数形式调用obj.test() 对象.方法形式调用 var obj = { fun：function(){}; } obj.fun(

2021-03-15 20:37:17 106

原创 Js高级-词法作用域

作用域分类：1.静态作用域（词法作用域）：Javascript2.动态的作用域：bash特征对比：1.词法作用域规定在代码定义的时候就决定了，而不是看调用的时候2.动态作用域是在代码执行的时候决定的 var a = 10； function fun（）{ console.log（a）；}； function fun2（）{ var a = 20； fun（）；}； fun2（）；//输出10 fun（）；//输出10因为函数fun和fun2都是

2021-03-15 20:35:46 57

原创 Js高级-基本数据类型与引用数据类型

js数据类型分为：基本数据类型和复合数据类型(引用数据类型，对象)基本数据类型：- 定义： string， number， boolean，null， undefined- 特征：基本数据类型数据赋值给某一个变量之后值本身就不会再发生改变 var a = 123; a = 234; 问：a本身里面数据有没有被改变？答：a本身的数据没有改变，因为基本数据类型的特点是一旦定义了值是不会被改变引用数据类型:- 定义： object， array， funct

2021-03-07 13:35:47 83

原创 DOM添加

document.createElement（）可以用于创建一个元素节点对象 ,它需要一个标签名作为参数，将会根据该标签名创建元素节点对象，并将创建好的对象作为返回值返回eg:创建一个 livar li = document.createElement（"li"）;document.createTextNode（）可以用来创建一个文本节点对象需要一个文本内容作为参数，将会根据该内容创建文本节点，并将新的节点返回eg:创建广州文本节点var gzText = document.cre

2021-02-10 14:16:18 308 1

原创 DOM简介及查询

当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）HTML DOM 模型被构造为对象的树通过可编程的对象模型，JavaScript 获得了足够的能力来创建动态的 HTMLJavaScript 能够改变页面中的所有 HTML 元素JavaScript 能够改变页面中的所有 HTML 属性JavaScript 能够改变页面中的所有 CSS 样式JavaScript 能够对页面中的所有事件做出反应查找 HTML 元素通常，通过 JavaScript，

2021-02-01 21:38:56 250

原创包装类和字符串的方法

创建一个字符串var str = “Hello Word”在底层字符串是以字符数组的形式保存的[""length属性可以用来获取字符串的长度charAt（）可以返回字符串中指定位置的字符，根据索引获取指定的字符charCodeAt（）可以获取指定位置字符的字符编码（Unicode编码）String.forCharCode（）可以根据字符编码去获取字符...

2021-01-05 21:52:04 164

原创 Date对象简介

Date对象，在js中使用Date对象来表示一个时间创建一个Date对象，如果直接使用构造函数创建一个Date对象，则会封装为当前代码执行的时间var d = new Date（）创建一个指定时间的对象，需要在构造函数中传递一个表示时间的字符串作为参数日期的格式：月份/年/ 时:分:秒var d = new Date（"12/03/2020 10:10:10"）；Date（）对象的方法1.getDate（）获取当前日期对象是几日2.getDay（）获取当前日期对象是周几，会返回一个0

2021-01-04 20:51:32 1040

原创 arguments

在调用函数时，浏览器每次都会传递进两个隐含的参数1.函数的上下文对象this2.封装实参的对象argumentsarguments是一个类数组对象（实际不是数组），它也可以通过索引来操作数据，也可以获取长度在调用函数时，我们所传递的实参都会封装到arguments中arguments.length可以用来获取实参的长度我们即使不定义形参，也可以通过arguments来使用实参，只不过比较麻烦arguments[0]表示第一个实参arguments[1]表示第二个实参它里面还有一个属性

2021-01-04 20:51:14 101

原创 call（）和apply（）

call（）和apply（）这两个都是函数的方法，需要通过函数的对象来调用当对函数调用call（）和apply（）都会调用函数的执行，和调用fun（）是一样的在调用call（）和apply（）可以将一个对象指定为第一个参数，此时这个对象将会成为函数执行时的thiscall（）方法可以将实参在对象之后依次传递apply（）方法需要将实参封装到一个数组中统一传递小结_this的情况：1.以函数的形式调用时，this永远都是window2.以方法的形式调用时，this就是调用那个方法的对象

2021-01-04 20:50:47 54

原创数组的简介

数组（Array）数组也是一个对象，它和我们普通对象功能类似，也是用来储存一些值的，不同的是普通对象是使用字符串作为属性名，而数组使用数字作为索引操作元素–>索引从0开始的整数就是索引数组的储存比普通对象要好，在开发中我们经常使用数组来储存一些数据一：①创建数组对象var arr = new Array（）；②使用字面量创建数组var arr = [ ]；在使用字面量创建数组时候，可以在创建时就指定数组中元素var arr = [1,2,3,4,5]；–>数组中元素

2021-01-03 15:08:01 151

原创垃圾回收

垃圾回收（GC）就像人生活的时间长了会产生垃圾一样，程序运行过程中也会产生垃圾，这些垃圾积攒过多以后，会导致程序运行的速度变慢，所以我们需要一个垃圾回收的机制，来处理程序运行过程中产生的垃圾当一个对象没有任何的变量或属性对它进行运用，此时我们将永远无法操作该对象，此时这种对象就是一个垃圾，这种对象过多会占用大量的内存空间，导致程序运行变慢，所以这种垃圾必须清理在js中拥有自动的垃圾回收机制，会自动将这些垃圾对象从内存中销毁，我们不需要也不能进行垃圾回收的操作我们需要做的是将不再使用的对象设置为nu

2021-01-03 14:42:13 52

空空如也

空空如也