翻滚吧，小牛牛-CSDN博客

原创数组去重

数组去重–改变原数组：数组去重要倒着遍历，正遍历可能会有漏网之鱼！！var arr = ["apple","banana",'pear',"abc","abc","abc","abc","abc","abc","123","apple",'apple','pear',"abc"]; for (var i = arr.length-1; i >= 0; i--) { for (var j = i-1; j >= 0; j--) { if (arr[i]===arr[j]

2021-03-18 15:59:17 75

原创面向对象学习03-es6中的类与继承

es6中的类与继承文章目录es6中的类与继承es6如何使用类继承es6如何使用类 class People { // 构造方法 constructor (name, age) { // 属性 this.name = name this.age = age this._sex = -1 } // 属性的get和set方法 get sex () { // 属性 if (this._sex === 1) { r

2021-03-12 11:25:46 111

原创面向对象02-es5的类与继承

es5的类与集成文章目录es5的类与集成如何使用类es5中的继承1.类式继承2.构造函数继承3.组合继承总结如何使用类 // 声明一个类 function People (name, age) { // this就是当前实例对象 // 实例属性 this.name = name this.age = age // 静态属性 People.count++ } // 静态属性 People.count = 0 // 用类直接声明的方法就是静态方法 Peo

2021-03-12 11:17:01 103

原创动画系列1--transition

文章目录transitiontransition的使用transition过渡(属性变化的监听器)，一共有四个属性分别是：transition-property：指定过渡的属性all 所有能过渡的属性transition-duration 过渡需要的时间transition-timing-function 执行的速度曲线linear 匀速ease 默认，开始慢，中间快，结束慢ease-in 开始慢ease-out 结束慢ease-in-ou

2020-11-11 15:55:13 143

原创 promise专题--手写promise03

文章目录上篇回顾一、问题分析二、重写then方法三、大体思路四、支持then穿透上篇回顾promise专题–手写promise02上篇我们解决了异步调用的问题，但是发现链式调用是行不通的。这篇解决这个问题。一、问题分析原生promise为什么支持then的链式调用？因为原生每次then之后会返回一个promise对象，所以可以支持链式调用，但是上篇我们写的并没有返回一个promise对象，所以当我们再then的时候，就是undefined.then，所以理所当然直接报错喽，所以链式调用的核心就是要

2020-11-03 15:36:20 254 1

原创 promise专题--手写promise02

文章目录一、优化promise类和then方法二、优化后支持异步代码三、测试一、优化promise类和then方法上一篇说道，当resolve或者reject被异步函数包裹的时候，他们没有执行，也就是如下这种情况 /*原因如下：因为setTimeout是异步函数，所以resolve是最后执行的，先执行同步操作，也就是说先打印出ok，然后调用then方法，此时status还是pending的状态，所以不会执行onFulfilled 也就不会打印7777 之后再调用resolve*/ n

2020-11-03 14:18:05 168 1

原创 promise专题--手写promise01

promise常用方法静态方法 Promise.*** all relsove reject race 实例方法 new Promise().*** then catch finally文章目录promise常用方法手写promise一、promise类的思路分析二、then的初步实现思路三、测试手写promise一、promise类的思路分析 let p = new Promise((resolve, reject) => { resolve("成功了"); });

2020-11-03 11:14:14 163 1

原创 promise专题--原生promise基本用法

为什么要用promise？说到promise就绕不开同步和异步的问题，那么什么是同步什么是异步？同步就是比如你烧了一壶水，但是此时你想看电视，但是你只能等这壶水烧开了，你才能去看电视，也就是事件是一件完成以后才能去做下一件，这个是同步。异步就是我再烧水的同时，我也去看电视，当水烧开后发出声音，此时这个声音就相当于个回调函数，告诉我们这个水烧开了，事情做完了，然后我们再去看电视，这个就是异步。但是当我们异步请求，假如一个需求要请求3个接口，第二个接口参数依赖于第一个的返回值，第三个接口的参数依赖于第

2020-10-30 14:37:55 335

原创设计模式学习01-简单工厂模式

简单工厂模式又称静态工厂方法，由一个工厂对象决定创建，某一种产品对象类的实例，主要用来创建同一类对象。文章目录简单工厂模式例子一例子二例子一比如创建一些书，这些书有公共的属性，比如目录，页码等，也有一些不同的属性，比如出版日期，作者等等，所以对于不同的属性进行针对性处理，比如将不同属性作为参数传递进来 function createBook(name, time, type) { // 创建一个对象，并对对象拓展属性和方法 var obj = new Object(); obj.

2020-10-21 15:31:21 84

原创设计模式学习02-工厂方法模式

面向对象学习02-继承为什么使用继承？比如父母会把自己的一点特点遗传给孩子，但是孩子肯定是和父母不能完全一样，总会有自己的特点。所以通俗来讲继承就是可以使用父类的属性和方法。文章目录面向对象学习02-继承继承的几种方式一、类式继承类式继承的缺点二、构造函数继承构造函数继承的缺点组合继承组合式继承的缺点原型式继承寄生式继承寄生组合式继承(寄生+构造函数)继承的几种方式一、类式继承 // 声明父类 function father() { this.fatherValue = "爹"； }

2020-10-21 14:31:08 63

原创面向对象学习01

面向对象01-类面向对象和面向过程的区别：面向过程简单来讲就是讲问题解决过程描述成一个个步骤，然后用函数把这些步骤挨个实现，比如表单校验，针对不同输入框，写了几个不同的校验规则函数，那么这个就是一个面向过程的一种实现方式，并且这种方式会导致页面中添加了很多全局变量，不利于别人重复使用，而一旦别人使用了，那么你就不能轻易去修改这些方法，不利于团队代码的维护，所以下面引出了面向对象的概念。面向对象就是将你的需求抽象成一个对象，然后针对这个对象分析它的属性和方法，而这个对象我们简称为类。面向对象其中很重要的

2020-10-20 16:30:46 92

原创 vue总结04--transition过渡动画

vue过渡动画Vue 在插入、更新或者移除 DOM 时，提供多种不同方式的应用过渡效果在 CSS 过渡和动画中自动应用 class配合使用第三方 CSS 动画库，如 Animate.css在过渡钩子函数中使用 JavaScript 直接操作 DOM文章目录vue过渡动画css过渡动画一、使用步骤二、简单例子三.动画过渡过程四.使用css动画库五.使用钩子函数六.列表过渡css过渡动画transition组件会为嵌套元素自动添加class，可用于做css过度动画一、使用步骤

2020-10-15 13:53:43 314

原创 vue总结03--组件化

组件化组件是可复用的 Vue 实例，带有一个名字，我们可以在一个通过 new Vue 创建的 Vue 根实例中，把这个组件作为自定义元素来使用。文章目录组件化组件基础一、组件注册、使用及数据传递二、自定义事件及其监听三、在组件上使用v-model四、通过插槽分发内容组件化理解总结组件基础一、组件注册、使用及数据传递Vue.component(name, options)可用于注册组件。自定义组件 <hello-world :msg="msg"></hello-wor

2020-10-09 16:06:58 96

原创 vue总结02--vue的生命周期

vue总结02-生命周期每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等，称为Vue实例的生命周期。文章目录vue总结02-生命周期生命周期视图一、使用场景二、测试代码生命周期视图结论：三个阶段：初始化、更新、销毁初始化：beforeCreate、created、beforeMount、mounted更新：beforeUpdate、updated销毁：beforeDestroy、des

2020-10-09 10:54:25 202 1

原创 vue总结01--组件通信的8种方式

组件通信的几种方式props （父传子）父组件中： <template> <div> <mchild1 msg="父亲发送的信息"></mchild1> </div></template>子组件中： <template> <div>子组件1--接收 {{msg}}</div> </template><script>export

2020-09-03 16:26:16 137

原创学习前端第五天

html–Day05 命名方式+背景一丶命名规范<pre>命名：根据每块元素的主题或者功能、在页面上的位置驼峰命名从第二个单词开始每个单词的首字母大写 #mainLeftBox{}每个单词中间以“-”隔开或者‘_’ #main_left_box{}写包含样式的时候能找到这个元素并且不影响其他元素即可页头：header 如：#header{属性:属性值;}或.hea...

2018-11-27 16:43:35 151

原创学习前端第四天

html–Day04 案例练习一、练习1效果图：实现代码：结构代码 <h3>腾讯新闻</h3> <ul> <li><a href="#" title="财经 |债转股17年后再度启动如何演绎旧瓶装新酒？"> <span>财经 |</span&g

2018-11-27 15:33:49 550

原创学习前端第三天

html–Day03 样式初始化标签类型及转换一、标签样式初始化1.body,dl,dd,p,h1,h2,h3,h4,h5,h6{margin:0;}2.ol,ul{margin:0;padding:0;list-style:none;}3.a{text-decoration:none;}4.img{border:none;}css reset 原则：但凡是浏览默认的样式，都不要使...

2018-11-27 14:59:32 1210 3

原创学习前端第二天

html–Day02 盒模型一、盒子模型盒子模型是HTML是网页中一个非常重要的知识点，也是学习HTML的基础（1）、border 边框：元素边框的样式单样式: border-width大小 border-style 样式 border-color 颜色复合样式:大小类型...

2018-11-19 15:32:27 113

原创学习前端第一天

html–Day01一.网页的三层架构我们常见的网页的三层架构分别为html,css,js。结构层html: 超文本标记语言，结构（HyperText Markup Language）（1）双标签：html,body,div （2）单标签：meta,img,hr典型的列子<div> 每个程序员的信仰-h...

2018-11-19 15:23:06 216

weixin_43737355的博客