乔木木木木-优快云博客

原创 Go.Js：Getting Start

Go.Js：Getting Start实现一个简单的图Step1 使用html5Gojs是使用了html5的特性所以要用html5的编码格式作为基础<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <t

2020-09-11 11:14:01 205 1

原创彻底搞懂闭包

闭包首先来看一个问题function books() { var book = '书包里有一本书'}console.log(book)这个执行显然是出错的，为什么呢，这里就牵扯到了闭包，下面会用执行上下文来解释执行上下文每当运行代码时就会生成执行上下文，决定了代码的作用域，js的执行环境分为三种：全局环境函数环境eval环境（慎用）当初次运行代码，会进入全局环境例如：function a(){ b() function b(){ c()

2020-08-10 12:20:35 238

原创 git初次远程提交疯狂踩坑

git初次远程提交疯狂踩坑初次提交首先，初始化git init添加到本地版本库git add .提交本地git commit -m 'first commit'关联远程仓库git remote add origin '你的远程仓库地址'***重要！！！***如果原本远程仓库不为空，一定要把远程和本地合并git pull --rebase origin master把本地仓库提交git push -u origin master然后是我的疯狂踩坑

2020-07-23 14:06:43 887

原创 var、let、const

var、let、const1. var变量提升：(function shiftup(){ if(false){ var show1='a' } console.log(show1) console.log(show)})()在这个函数中，正确的执行应该是这两条打印都会未定义的错误，但是现实是只有第二条打印报错，第一条打印出来是undefined，undefined意味着这个函数已经被定义但是没有被赋值。这是因为var有变量提升，这段代码实际上等于(function sh

2020-07-17 02:54:46 209 1

原创 react组件起步

react组件编程组件的基本定义和使用分两步：step1：定义组件定义组件两种方法：使用函数的形式定义组件，函数返回一个虚拟Dom对象使用ES6类组件step2：渲染组件标签例：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>07_component_state</title></head><body&gt

2020-07-17 02:54:04 109

原创 react起步

react小白起步（总结版）在<script type="text/babel">标签中，react分三个部分，数据声明、创建虚拟Dom对象，渲染虚拟Dom对象数据声明var a=1;这里的数据可以是var、let、const，数据类型可以是js中的任意数据类型创建虚拟Domvar vDom=<h1>hello React</h1>等于的后面可以使用纯html语句，在 type="text/babel"的script标签中是可以的，但是在默认的scrip

2020-07-17 02:53:40 168

原创 js中的变量

基本类型、引用类型、let、var、const1 基本类型：基本类型有：Number、String、BigInt（ES6新增的），还有一些空值NULL、NAN、undefine1.1 这几种空值的区别NULL:表示无值，例如var aconsole.log(a)//这里a打印的是nullundefine：表示未定义过的变量的类型，例如//之前没有定义过变量console.log(typeof a)//这里打印undefinedNAN：表示未定义的数字，例如var a=NANcon

2020-07-15 16:19:50 264 1

原创 CSS中的渐变，border画三角

渐变：Linear Gradients线性渐变 background-image: linear-gradient(to right, red , yellow);background-image: linear-gradient(-90deg, red, yellow);如果你想要在渐变的方向上做更多的控制，你可以定义一个角度，而不用预定义方向（to bottom、to top、to right、to left、to bottom right，等等）。background-image: lin

2020-07-09 01:56:25 1964 1

原创 css3选择器：后代、子代、组合、伪类

css的高级选择器后代：div a{ color:orange; }div中的a标签子代div>a{ color:orange; }>这个表示子代，后代是说不管是儿子孙子都算，但是子代只是自己的下一代，如果例子中的a标签为div的孙子，那这个样式就无法作用在a的身上组合多个标签或类设置共同的样式div,a{ color:orange; }伪类例子：a标签的选择状态/* 没有访问时 */ a:link{ colo

2020-07-09 01:55:18 2378

原创 localStorage、sessionStorage介绍和使用

localStorage、sessionStoragelocalStorage 和 sessionStorage 属性允许在浏览器中存储 key/value 对的数据。localStorage是有效期是永久有效，但是sessionStorage在当前浏览器关闭前有效这两个东西主要是为了解决原本cookie的两个问题：cookie数据量太小，只有4kcookie每次http请求都会进行cookie的传递，浪费了带宽localStorage保存数据：localStorage.setItem("

2020-07-09 01:54:36 159

原创 css中的float、position、BFC、布局

浮动：float当子盒子比父盒子大时会出现样式问题，下面介绍三种清除外部浮动的方式清除外部浮动的三种方法：憨憨法：给父盒子设置一个合适能容下子盒子的宽度，一般不这么做，因为麻烦使用clear:both<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .div

2020-07-09 01:53:31 148

原创 html中的文件读取

文件读取完整的文件读取过程<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <input id="m-file" type="file"> <script type="text/javascript"> // 1、获取元素 let fi

2020-07-09 01:52:32 3002

原创 h5中的音频、视频

音频：<audio><audio controls> <source src="horse.mp3" type="audio/mpeg"></audio>controls属性可以提供添加播放、暂停和音量控件，<audio>和</audio>之间添加当浏览器不支持audio标签时的提示文本audio标签中可以添加多个<source>，每个<source>可以连接不同的音频文件，浏览器会使用第一个支持的

2020-07-09 01:51:27 350

原创 html5新标签

html5新标签详解兼容问题IE8以下不支持，要想兼容IE8一下可以添加一个html5垫片包，网上大多是google的，但是google被墙所以推荐一个国内的垫片包这个放在html的头部中，当版本过低时会自动解释一、新标签

2020-07-08 21:56:59 328

原创 flex布局基础，附有例子代码

flex布局1、传统布局与flex布局传统布局兼容性好布局繁琐局限性，不能在移动端很好的布局flex弹性布局操作方便，布局简单，移动端应用很广泛pc端浏览器支持情况较差IE 11或更低版本不支持或仅部分支持2、flex初体验<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="

2020-06-26 00:17:15 543

原创 axios跨域问题

axios的跨域问题一、什么是跨域问题要在www.a.com的域下访问www.b.com域下的资源，出于安全考虑不能这样访问，因为比如说html中的<iframe>标签中访问银行的页面，用户在登录我的页面后会以为这是银行界面，然后输入账号密码，但是这样会导致我也可以从我自己的页面拿到这个用户的账号密码，然后我就进去吃牢饭了，所以要拦截这种访问，当真的要进行这种访问时要单独进行配置二、解决方法1，CORS本机的配置情况：静态资源服务器：http://localhost:8081Api资

2020-06-24 22:03:22 413

翻译正则表达式入门

英文原文：https://regexone.com/lesson/introduction_abcs第一课：绪论正则表达式在从程序、日志文件、电子表格甚至文本中提取信息时非常有用，虽然在形式语言的背后有很多立论，但是下面的课程和实例将探索正则表法师的更多实际应用，一边能够尽快地使用他们。使用正则表达式时首先要明白，所有的内容本质上都是字符。我们编写正则开匹配特定的字符序列（也称字符串），大多数模式使用普通的ASCII码。包括字母、数字、标点和键盘上的其他符号（如，%#$@!），但unico

2020-06-24 17:34:24 751

原创 axios的基本使用

网络模块封装axios几种网络模块选择一：传统的Ajax是基于XMLHttpRequest(XHR)为什么不用：配置和调用方式等混乱编码复杂真实开发很少用选择二：JQuery-ajax相对于传统Ajax非常好用为什么不用：vue的整个开发中不需要JQuery为了网络请求特意引用jQuery不方便vue的代码比jQuery的代码少选择三：Vue1.x中推出了Vue-resource体积小，是官方退出的为什么不用：在vue2.0以后不在更新维护对以后的项目开发和维护有

2020-06-24 00:26:25 319

原创 ES6中的异步操作

ES6中的异步操作–promise一、promiseES6异步编程的一种解决方案。原本的异步事件处理因为网络请求不能立即拿到结果，所以不能简单的像加法一样将结果返回，所以异步请求时，往往会传入一个函数，在请求成功时，将数据通过传入函数回调出去。但是，当网络请求非常复杂时，就会出现回调地狱，回调中又嵌套回调。二、promise 的基本语法Primise((resolve,reject)=>{}).then(()=>{})new Promise((resolve,rejext)=&g

2020-06-21 00:04:47 530

原创 vue-router动态路由

动态路由的使用、导航守卫在某一些情况下，一个页面的path可能是不确定的比如进入用户界面时，url可能是/user/jane这样，希望除了有/user外还有用户的id一、动态url首先我们按照原本的方式创造一个user.vue<template> <div> <h2>用户界面</h2> <p>hello world</p> </div></template><script&g

2020-06-19 01:30:30 419 1

原创 Vue-router：router-link

router-link标签的属性补充、页面跳转router-link除了to=""属性还有其他属性：tag属性：会按照我们想要的方式渲染成别的标签的样子<router-link to="/home" tag="button">首页</router-link>replace属性：在正常情况下vue使用history.pushState()来进行url的变更，但是有时我们不希望用户可以回退，所以要使用history.replace()来变更url，可以通过replace属性

2020-06-19 01:29:09 136

原创路由懒加载

vue-router懒加载的使用当打包构建应用是，jacascript包会非常大，印象页面加载，如果可以把不同路由对应的组件分割成不同的代码块，然后当路由被访问时才对组件进行加载，就可以更加高效了懒加载：用到时再加载懒加载主要作用是将路由对应的组件打包成一个个js代码块，只有在这个路由被访问到的时候才加载对应的组件懒加载的方式方式一：结合vue异步组件和webpack的代码分析const home =resolve=>{require.ensure{['../components/h

2020-06-19 01:27:51 143

原创嵌套路由

路由的嵌套使用实现嵌套的两个步骤1、创建对应的子组件，并且在路由映射中配置对应的子路由{ path:'/home', component:home, children:[ { path:'news', component:news }, { path:'message', component:message } ] },2、在组件内部使用<router-view>标签<template> <

2020-06-19 01:27:08 144

原创 Vue-router：router-link、页面跳转

2020-06-18 15:23:59 2017

原创 Vue路由：安装、配置、基本使用

Vue-Router路由中的映射关系一、路由路由是通过互联网把信息从源地址传输到目的地址的活动通过映射表进行路由和转发，这个映射表表示了数据包转向哪里1.1前端渲染、后端渲染阶段1：后端路由，后端渲染网页最早用的都是后端渲染，原本用的大多数都是jsp（java server page），php等服务器直接生产生成好url对应的html页面，返回给客户端展示一个页面有自己对应的url，url会发送到服务器，服务器通过正则对该url进行匹配，最后交给一个Controller进行处理，Contro

2020-06-18 15:07:32 483

原创 VueCLI：起步

VueCLI3的创建和起步一、创建CLI3项目vue create 项目名每个选项的含义如上图为什么CLI3比CLI2的文件结构和配置更简单：这个组件帮助我们管理了很多包的版本1.1 文件夹结构[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-QVkp10VE-1592450741681)(C:\Users\93221\AppData\Roaming\Typora\typora-user-images\image-20200618010128782.png)]

2020-06-18 11:29:37 127

原创 Slice、concat、reverse、箭头函数

JavaScript中的几个重要函数：一、ES6中的箭头函数使用：let a=()=>{}let a=(n)=>{}当返回值只有一句时，可以不写return，即：let add=(num1,num2)=>num1+num2箭头函数中的this：当把函数作为参数时，经常使用箭头函数，在这里使用this时会发生问题const odj={ aaa(){ setTimeout(function(){ console.log(this);//这里的this是wind

2020-06-18 11:13:58 237

原创 Vue笔记：Vue模块化

webpack中使用Vue的配置过程安装Vue的三种方式1、直接下载应用2、CDN引入3、npm配置1、用npm安装vuenpm install --save vue2、在main.js中引入vueimport Vue from 'vue'const app=new Vue({ el:'#app', data:{ message:'hello world' }})3、配置webpack.jsmodule.export={ resolve:{ a

2020-06-17 21:40:40 510

原创 Vue笔记：webpack模块化

模块化常见的模块化规范：commonJS,AMD,CMD,ES6的ModulesCommonJS模块化了解核心是导入、导出导出：module.exports={ flag:true, test(a,b){ return a+b }, demo(a,b){ return a*b }}导入：let{test,demo,flsg}=require('moduleA');一、Es6中的模块化在model.js文件中：var name="乔木"var age=18var

2020-06-17 11:30:54 216

原创 LeetCode1014笔记

1014、最佳观赏组合题目：给定正整数数组 A，A[i] 表示第 i 个观光景点的评分，并且两个景点 i 和 j 之间的距离为 j - i。一对景点（i < j）组成的观光组合的得分为（A[i] + A[j] + i - j）：景点的评分之和减去它们两者之间的距离。返回一对观光景点能取得的最高分。来源：力扣（LeetCode）链接：https://leetcode-cn.com/problems/best-sightseeing-pair著作权归领扣网络所有。商业转载请联系官方授权，非商

2020-06-17 10:00:56 118

原创 Vue笔记：slot插槽

solt插槽的基本使用一、为什么使用插槽组件的插槽是为了让封装的组件有更好的扩展性，让使用者决定要展示什么东西二、插槽的简单实现组件模板：<template id="cpn"> <div> <h2>我是cpn</h2>  <slot></slot&g

2020-06-15 23:42:21 221 2

原创 Vue笔记：组件化（一）

Vue组件化开发入门可以一个完整的页面分成很多个组件，每个组件实现一个功能模块，每一个组件又可以细分一、Vue的组件化思想Vue提供了一种抽象，可以开发复用的小组件来构造应用，每一个应用都可以被抽象成一颗组件树二、注册组件的步骤step 1：通过Vue.extend()创建组件构造器step2 ：注册组件Vue.component()注册组件step3 ：使用三、组件简单实现：<!DOCTYPE html><html> <head> <me

2020-06-15 15:54:07 274

原创 LeetCode14笔记

14. 最长公共前缀题目编写一个函数来查找字符串数组中的最长公共前缀。如果不存在公共前缀，返回空字符串 “”。示例 1:输入: [“flower”,“flow”,“flight”]输出: “fl”来源：力扣（LeetCode）链接：https://leetcode-cn.com/problems/longest-common-prefix著作权归领扣网络所有。商业转载请联系官方授权，非商业转载请注明出处。完整代码/** * @param {string[]} strs * @ret

2020-06-15 10:21:06 110

原创 Vue笔记：v-model

Vue中的双向绑定表单控件，用于用户信息的提交一、v-model实现原理v-model其实是v-bind:value="“和v-on:input=”"的两个操作，input是监听用户输入的事件<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&g

2020-06-13 22:25:21 153

原创 LeetCode70笔记

爬楼梯假设你正在爬楼梯。需要 n 阶你才能到达楼顶。每次你可以爬 1 或 2 个台阶。你有多少种不同的方法可以爬到楼顶呢？**注意：**给定 n 是一个正整数。示例：输入： 2输出： 2解释：有两种方法可以爬到楼顶。1. 1 阶 + 1 阶2. 2 阶解题方法这个问题可以想成当有若干1中的双数个1被替换成2，可以有多少种情况，再对每种情况进行排列组合step1：将1的个数减去2（得到剩余1的个数）step2：将原本1 的个数减去1（得到现在有多少个数字要进行排列）step

2020-06-13 12:56:37 96

原创二叉树遍历

JavaScript实现二叉树的遍历广度遍历const res=new Array(); const stack=new Array(root); let level=0 let bfs=()=>{ let node=stack[level]; if(node){ res.push(node.val); if(node.left) stack.push(node.left)

2020-06-12 23:48:18 147

原创 LeetCode100笔记

判断是否为相同的树（100）题目给定两个二叉树，编写一个函数来检验它们是否相同。如果两个树在结构上相同，并且节点具有相同的值，则认为它们是相同的。输入: 1 1/ \ / 2 3 2 3 [1,2,3], [1,2,3]输出: true来源：力扣（LeetCode）链接：https://leetcode-cn.com/problems/same-tree著作权归领扣网络所有。商业转载请联系官方授权，非商业转载请注明出处。

2020-06-12 18:59:57 85

原创 Vue笔记：JavaScript高阶函数

一些好用的循环方式1、for infor(let i in array){}这里 i是数组每一项的index2、for offor(let item of array){}这里的item取到的是数组中每一项3、js中的数组高阶函数filterarrayObject.filter(function(n){ //process})每从数组中取得一个元素，就会执行这个filter的回调函数这个回调函数的要求的返回值必须是 boolean，当返回为true时，函数内部会自动将这

2020-06-12 17:29:21 199

原创 Vue笔记：图书购物车案例

BookShop案例：一、搭建使用了semantic-ui框架，搭建整个页面<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="st

2020-06-12 16:44:15 1030

原创 Vue笔记：v-on

Vue、Vue.js笔记v-on的参数问题定义方法时省略了小括号，但方法本身是需要一个参数时，Vue会默认将浏览器自动生成的event时间对象作为参数传入。<div id="app"> <button @click="btnClick">按钮</button></div><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><s

2020-06-12 14:59:02 120

js.rar（react初学者简单测试用babel.js,react-development.js,react-dom.js）

2020-07-17

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人