自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(61)
  • 问答 (3)
  • 收藏
  • 关注

原创 JS-小红书前端笔试题--笔记草稿

题目:薯队长写了一篇笔记草稿,请你帮忙输出最后内容。1.输入字符包括,"(" , “)” 和 "<“和其他字符。2.其他字符表示笔记内容。3.()之间表示注释内容,任何字符都无效。 括号保证成对出现。4.”<“表示退格, 删去前面一个笔记内容字符。括号不受”<"影响解题:function aa(str){ var stack=[];//定义一个栈 先进后出 用来放()内的内容 str = str.split("");

2021-08-11 11:01:36 723 1

原创 Promise

Promise1.基本了解在执行异步操作时,需要promise对这个异步操作进行封装。new Promise((resolve,reject)=>{}) ,其中resolve和reject是函数,比如要执行setTimeout这个异步函数时,将要打印的代码的这个步骤放到.then()方法内执行,setTimeout函数内部需要调用resolve函数new Promise((resolve,reject)=>{ setTimeout( ()=> {

2021-07-08 16:54:16 588

原创 TabBar实例练习

TabBar实例练习1.新建一个vuecli2-tabbar实例2.先搭建最基本的框架主页文字包括:首页、分类、购物车、我的。这几个持水平分布在App.vue文件中导入基本的组件:<template> <div id="app"> <div id="tab-bar"> <div class="tab-bar-item">首页</div> <div class="tab-bar-item">

2021-07-08 11:33:11 359

原创 vue-router全局导航守卫

1.vue-router全局导航守卫目的:导航守卫是控制用户能够进入哪些路由和不能进入哪些路由的控制器,也就是管理路由的。利用router对象的beforeEach() 实现导航守卫在index.js文件中://导航守卫router.beforeEach((to, from, next) =>{ document.title = to.meta.title next()})to:跳转到的路由 from:从哪个路由离开 next:显示函数next(’/’)或者next({

2021-07-07 15:33:36 430

原创 vue-router 打包文件,路由懒加载、路由嵌套

1.vue-router 打包文件运行 npm run build打包文件,可生成dist文件夹其中app文件 是当前应用程序开发的所有代码,都在这个文件里面,(业务代码,自己手动写的代码)vendor(提供商,第三方)在项目中引用第三方的内容,如vuemanifest:是为我们打包的代码(相互依赖)做低层支撑2.vue-router 路由懒加载当打包构建应用时,js包会变得非常大,影响页面加载。可以将不同路由对应的组件分割成不同的代码块,当路由被访问的时候才加载对应的组件。就是将不同的路

2021-07-06 17:54:53 958

原创 vue-router 动态路由

vue-router 动态路由实现:切换到user路由时在页面显示用户名信息,在url网页中显示用户名信息在components文件夹中新建一个user.vue文件如下图所示:user.vue代码如下:<template><div> <h2>我是用户</h2> <h3>{{userId}}</h3></div></template><script>export d

2021-07-06 15:04:01 131

原创 router-link属性+通过代码跳转路由

router-link属性to:跳转路径tag:渲染成一个组件,如<router-link to="About" tag="button">关于 </router-link>会渲染成一个标签。replace:阻止网页有返回效果,不会留下history记录active-class: 当对应的路由匹配不成功时,会自动给当前元素设置一个router-link-active 通常不会修改这个属性。通过代码跳转路由App.vue代码如下: <button @click="h

2021-07-06 14:45:37 295

原创 router-默认配置

router-默认配置在默认的情况下,进入网站的首页,希望渲染首页的内容,此时需要多配置一个路由映射。const routes =[ { //重定向 多配置的一个路由映射 path:'', redirect:'/home' }, { path:'/home', component:Home }, { path:'/about', component:About }]改变网页hash模式在index文件中,Rout

2021-07-06 11:23:56 275

原创 vue-router入门及简单配置

vue-router路由是决定数据包从来源到目的地的路径,并且转送将输入端的数据转移到合适的输出端前端渲染 后端渲染后端渲染早期用jsp/php开发,后端服务器渲染完直接给前端,后端路由:后端处理URL和页面之间的映射关系前后端分离后端只负责提供数据,不负责任任何阶段的内容输入URL后,首先去静态资源服务器拿到:html、css、js(js代码由浏览器执行,$ajax(url:api接口 success:function)),再去API接口,拿到大量数据后,其他的js代码创建div,再渲染到

2021-07-01 12:56:57 231

原创 vue-cli3/es6箭头函数

vue-cli3新建脚手架3项目:vue create testvuecli3。可视化运行管理:vue ui如果需要改一些配置,在最上层的文件夹下创建vue.config.jses6箭头函数1.基本使用<script> //箭头函数也是定义函数的一种方式 //1.定义函数的方式 const aaa = function(){ } //2.对象字面量定义函数 const obj = {

2021-06-30 21:44:56 404

原创 Vue-cli2

Vue CLI搭建两个cli2项目,一个使用runtimecompiler 一个是runtimeonly如果直接打包文件,执行:npm run dev 会运行项目中package.json文件中的scripts下的dev如下图所示:关闭eslint在config文件夹下的index.js文件中,useEslint: true,, 把原来的true改为falseruntime+compiler 和 runtime-only主要区别在src文件夹下的main.js文件中:template转成抽

2021-06-30 20:08:13 139

原创 Vue脚手架-安装和介绍

Vue脚手架-安装和介绍开发大型项目时,需要使用Vue CLI,CLI是Command-Line Interface 翻译为命令行界面,俗称脚手架使用前提:Node Webpack安装NodeJS,环境要求8.9以上的版本使用 Vue CLI安装Vue脚手架在电脑终端中打开cmdcli3版本:npm install -g @vue/clicli2版本:vue install -g @vue/cli-initvue cli2脚手架2初始化项目 :vue init webpack my

2021-06-30 16:22:34 91

原创 webpack-配置文件的分离

webpack-配置文件的分离1.新建一个文件夹命名为build在该文件夹下创建三个js文件:2.将原来webpack.config.js文件中的内容全部复制到三个文件中再对已经复制的内容进行选择性删除。首先,安装npm install webpack-merge --save-dev再对文件中内容进行内容修改。例如,三个文件内容结果如下:注意:base中放的代码应该是公共(生产和开发)的东西。base.config.js内容如下:const path = require('path'

2021-06-30 11:23:27 240 1

原创 webpack-搭建本地服务器

webpack-搭建本地服务器webpack提供了一个可选的本地开发服务器,这个本地服务器基于node.js搭建,内部使用express框架,可以实现让浏览器自动刷新显示我们修改后的结果。1.安装webpack-dev-servernpm install --save-dev webpack-dev-server@2.9.32.修改config.js里面的配置:devSever:{ contentBase:'./dist', inline:true }3.在p

2021-06-30 10:34:35 185

原创 webpack-js压缩-plugin

webpack-js压缩-plugin1.对打包的js文件进行压缩,使用第三方插件uglifyjs-webpack-plugin 指定版本号1.1.1npm install uglifyjs-webpack-plugin@1.1.1 --save-dev2.修改config.js文件添加:(1)const UglifyJsPlugin = require('uglifyjs-webpack-plugin')(2)修改module.exports:(最后一行为新添加)plugins:[

2021-06-30 09:23:43 212

原创 webpack-plugin

pluginplugin是插件的意思,loader主要用于转换某些类型的模块,它是一个转换器,plugin是插件,它是webpack本身的扩展,是一个扩展器。安装plugin:(1)通过npm安装需要使用plugins(2)在webpack.config.js中的plugins中配置插件示例:在config.js文件中:(1)添加const webpack = require('webpack')(2)在module.exports中添加:plugins:[ new w

2021-06-29 18:27:57 126

原创 webpack-创建Vue时el和template的关系

webpack-创建Vue时el和template的关系之前写vue的html代码,都是在html代码写挂载的样式, <div id="app"> <h2>{{message}}</h2> </div>但是真正开发时不会这么写,html代码就不要随便加东西。如果在实例vue中,在template下写的样式会直接复制到html挂载的根盒子里,HTML: <div id="app"> </div&gt

2021-06-28 21:37:24 140

原创 webpack-Vue配置过程

webpack-Vue配置过程希望在项目中使用Vuejs,原来引用的方式比较古老,不是模块化的思想。安装vue:(1)直接下载应用,(2)引入(3)npm下载 --可以直接import Vue from 'vue'安装->依赖1.安装vuenpm insatll vue --save2.导入vue1.在main.js文件中导入vue:import Vue from 'vue'2.在index.html文件中写入挂载div版本不正确:如果直接打包会报错,报错信息显示使用runtim

2021-06-26 17:11:00 230 2

原创 webpack-es6转es5

webpack-es6转es5需要babel1.安装npm install --save-dev babel-loader@7 babel-core babel-preset-es20152.配置config.js文件在rule下配置(具体配置找webpack官网) { test: /\.js$/, //exclude:排除 //include:包含 exclude: /(node

2021-06-26 15:37:04 359

原创 webpack-图片配置

webpack图片配置file-loader@0.9.0先往文件夹中放入图片修改css文件中的背景路径安装url-loader选择合适的版本,不然会报错npm install --save-dev url-loader@1.1.2修改module配置在config.js文件中修改module配置(具体配置去webpack中找)注意!!!:此时放入的test.jpg图片是大概15kb,在module中有options下的limit,设置为17000是大于test图片的大小,(tes

2021-06-26 12:27:23 984

原创 webpack-less配置

webpack-less的配置 笔记安装less是用于将less文件转换为css文件主要还是分两步:1.安装对应版本的less-loader 2.在webpack.config.js中的module关键字下进行配置先在css文件夹下创建less文件安装less-loader 和less注意版本配置module去webpack官网里面找配置打包到dist文件夹里运行成功!报错说明:没安装,或安装版本不对。。。...

2021-06-25 22:19:49 1593

原创 webpack配置

webpack配置-基础笔记1.首先创建一个js文件,webpack.config.js //这个名字不能随便改path是从path包里面找2.paht包在更新一个路径时注意最好先初始化npm init然后就开始配置,起一个包的名字,重新起一个(不能起webpack)现在写的没有用上。就会生成一个json文件然后将入口和出口配置到一个文件夹中(就是webpack.config.js)但是一般开发中不会直接在终端输入webpack,此时就需要:映射webpack和 npm run bu

2021-06-25 20:55:59 156 1

原创 webpack-1

webpack笔记-1定义webpack是一个现代的JavaScript应用的静态模块打包工具核心:模块和打包AMD CMD CommonJS 需要低层支持webpack可以处理模块化开发,CSS、图片、json文件都可以被当作模块来使用。grunt/gulp更强调的前端流程的自动化,木块话不是它的核心webpack更加强调模块化开发管理,而文件压缩合并,预处理等功能,都是它的附带功能,依赖node环境。node环境为了可以正正常执行很多代码,必须其中包含各种依赖的包(npm)最终打包在d

2021-06-24 22:53:23 75

原创 ES6 模块化实现-导入导出

es6模块化实现核心:导入 导出首先,在HTML代码中引入两个js文件,而且类型type需要设置为module <script src="aaa.js" type="module"></script> <script src="bbb.js" type="module"></script> <script src="aam.js" type="module"></script>import指令用于导入模

2021-06-24 21:28:38 288

原创 vue-组件化开发

父子组件的访问方式父组件可以直接访问子组件:使用$children (用的很少) 或 $refs<div id="app"> <cpn ref="aaa"></cpn> <cpn></cpn> <button @click = 'btnClick'>按钮</button> </div> <template id="cpn">

2021-06-23 15:39:42 68

原创 Vue-笔记

父子组件之间的通信(1)props向子组件传递数据(2)通过自定义事件向父组件发送消息(3)在真实开发中,vue实例和子组件的通信和父组件和子组件的通信过程是一样的父组件向子组件通信,只需要添加 props<div id="app"> <cpn v-bind:cmovies="movies" :cmessage="message"></cpn> </div> <template id="cpn">

2021-06-22 22:30:38 66

原创 Vue-笔记

vue笔记1.父组件和子组件<div id="app"> <!-- 使用组件 --> <cpn2></cpn2> </div> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> //1.创建第一个组件构造器 (子

2021-06-22 20:24:26 98

原创 vue笔记

vue 笔记v-model 结合radio类型<body> <div id="app"> <label for="male"> <input type="radio" id="male" value="男" v-model="sex">男 <input type="radio" id="female" value="女" v-model="sex">女 &l

2021-06-17 10:32:48 71

原创 JS-最长公共前缀

JS 算法题-最长公共前缀编写一个函数来查找字符串数组中的最长公共前缀。输入:[“abca”,“abc”,“abca”,“abc”,“abcc”]输出:“abc”想法:横向去比较,先假设字符串数组中第一个是最长前缀,然后分别和后面的字符串去比较,如果最长前缀不同则更新用到的 方法 : substring() 用于提取字符串中介于两个指标下标之间的字符语法: obj.substring(start,stop)方法2 :indexOf() 可以返回某个指定的字符串值在字符串中首次出现的位置,如果

2021-06-11 09:06:30 2033

原创 vue笔记

Vue笔记es6高阶函数filter/map/reduce例如 对一个数组进行一些操作以前的做法:filter的回调函数有一个要求:必须返回一个Boolean值,当返回true时,函数内部会自动将这次回调的n加入到这个新的数组中,返回为false时,函数内部会过滤掉这次的n.reduce作用对数组中所有的内容进行汇总,必须要传两个值,一个是一个回调函数,还有一个是一个初始化值 reduce( function(preValue,n){},0) preValue是函数上一个返回的值

2021-06-10 14:37:07 59

原创 JS 单链表的排序

JS 单链表的排序题目:给定一个无序单链表,实现单链表的排序(按升序排序)。输入:[1,3,2,4,5]输出:{1,2,3,4,5}把链表拿出来放到一个数组里排好序后再放回链表里。时间复杂度比较大function sortInList( head ) { // write code here //出口 if(!head || !head.next){ return head; } //定义一个新数组 let arr =

2021-06-09 18:17:46 821

原创 JS买股票的最好时机

JS 编写 买股票的最好时机假设你有一个数组,其中第\ i i 个元素是股票在第\ i i 天的价格。你有一次买入和卖出的机会。(只有买入了股票以后才能卖出)。请你设计一个算法来计算可以获得的最大收益。[1,4,2] 返回3分析:遍历这个数组,在遍历的同时维护一个变量minPrice来记录当前为止最小的价格(作为买入价格),之后用当前的价格减去这个买入价格,就可以得到赚的价格,用一个dis来记录最高可能赚的钱,遍历完后dis就是最终的结果。代码:function maxProfit( pric

2021-06-09 15:54:12 174

原创 vue 笔记

vue 学习笔记响应式并不是所有方法都是响应式,pop(),shift(),unshift(),splice(),sort(),reverse()是响应式的shift():删除数组的最前面一个元素unshift():在数组最前面添加元素splice():可以删除元素,插入元素,替换元素删除元素:第二个参数传入你要删除几个元素(如果没有传,就删除后面的所有元素)替换元素:第二个参数,表示我们要替换几个元素,后面是用于替换前面的元素。插入元素,第二个参数传入0,后面跟上要插入的元素通过索引来修

2021-06-08 22:48:13 282

原创 JS 子数组的最大累加和问题

JS 子数组的最大累加和问题给定一个数组arr,返回子数组的最大累加和例如,arr = [1, -2, 3, 5, -2, 6, -1],所有子数组中,[3, 5, -2, 6]可以累加出最大的和12,所以返回12.题目保证没有全为负数的数据function maxsumofSubarray( arr ) { // write code here //设置一个变量max储存全局最大值 var max = 0; //value用来储存当前的和 var value

2021-06-08 16:38:20 335

原创 JS 算法

JS 求平方根实现函数 int sqrt(int x).计算并返回x的平方根(向下取整)用二分法function sqrt( x ) { // write code here //二分查找 var left = 0; var right = x; var res = -1; while(left<=right){ var mid = Math.floor(left+(right-left)/2); if(mid*

2021-06-08 15:59:34 100

原创 2021-06-05 Vue 笔记

v-once数据是响应式的,当给定v-once的属性时,如果修改数据,页面中显示不会跟着被修改。(不咋用)后面不用跟任何表达式。v-html解析a标签<h2 v-html="url"></h2>v-cloak在vue解析之前,div中有一个属性v-cloak,解析之后,div中没有一个属性v-cloak(不咋用)计算属性computed:{}计算属性一般是没有set方法的,只读属性computed:{ fullName:{ get:function(){

2021-06-08 15:55:46 69

原创 JS 合并两个有序的数组

合并两个有序的数组题目:给出两个有序的整数数组A 和 B,请将数组B 合并到数组 A中,变成一个有序的数组注意:可以假设 A数组有足够的空间存放B 数组的元素, A和B 中初始的元素数目分别为 m和n。function merge( A, m, B, n ) { // write code here var a = m-1;//A的最后一位 var b = n-1;//B的最后一位 //从A的最后一位开始循环 A有足够的位置放B for(var i=(m+n)

2021-06-04 16:09:12 371

原创 2021-06-04 JS 跳台阶

JS 实现跳台阶算法题一只青蛙一次可以跳上1级台阶,也可以跳上2级。求该青蛙跳上一个n级的台阶总共有多少种跳法(先后次序不同算不同的结果)。核心:递归function jumpFloor(number){ // write code here //递归最先想到的就是写出口 if(number===1) return 1; if(number===2) return 2; if(number===3) return 3; return jumpFloor

2021-06-04 11:54:54 188

原创 2021-06-03JS-两个栈实现队列

js代码 算法题用两个栈来实现一个队列,完成队列的Push和Pop操作。 队列中的元素为int类型。队列:FIFO 先进先出栈:FILO 先进后出先弄清楚栈和队列的区别,其实就是用两个栈实现先进先出。栈1负责压栈,把元素压到栈里。栈2负责弹出元素,如何把先压入栈1中的元素先弹出呢?把栈1的已压的元素弹出再压入栈2中,比如,栈1中压入元素1、2、3, 3为栈顶,这时弹出栈1的元素,再压到栈2中,此时栈2 的元素就为3、2、1,1是栈顶,最后将栈2弹出,此时最先弹出的是1,然后是2、3,这样就做到

2021-06-04 11:31:31 185

原创 JS 二分查找

二分查找请实现有重复数字的升序数组的二分查找给定一个 元素有序的(升序)整型数组 nums 和一个目标值 target ,写一个函数搜索 nums 中的第一个出现的target,如果目标值存在返回下标,否则返回 -1身为菜鸡的我,现在记住提到有序数组查找就要用到二分查找。错误:一直在用for循环。。。。应该用while。看到比较好的方法:定义一个找到的目标值,给这个值赋值,而不是在while循环中返回找到的mid或-1.function search( nums , target ) {

2021-06-03 16:38:06 161

空空如也

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

TA关注的人

提示
确定要删除当前文章?
取消 删除