- 博客(37)
- 收藏
- 关注
RSS订阅
原创 前端超高频面试必问
vue、js、css1.vue双向数据绑定原定答：vue.js是采用`数据劫持`结合`发布者-订阅者模式`的方式，通过`object.defineProperty()`来劫持各个属性的`setter`，`getter`，在数据变动时发布消息给订阅者，触发相应的监听回调来渲染视图。具体步骤第一步：需要observer的数据对象进行递归遍历，包括子属性对象的属性，都j加上setter和getter这样的话，给这个对象的某个值赋值，就会触发setter，那么就能监听到了数据变化第二步2.v
2021-01-06 22:03:22
231
原创 猿友:收藏的项目开发基本流程（不收藏就找不到啦~）
1.首先 在项目开发前季 我们要可行性分析：从市场、政策、经济、技术、人员等各方面因为来分析这个软甲项目开发的可实行性。2.我们需要考虑分析判断该类型的项目是否有发展前景或者分析市场同类型的产品可以请教行业专家分析同类产品避免浪费人力资源。3.确定好类型设计确定软件APP的体系结构、数据结构、算法、模块功能、以及用户界面设计等等…如果在开发前这些事情没有设计好，接下来的设计就可能变得一团糟。4.确定好项目根据程序需求确定好编码，将软件设计转换为计算机能够识别的编程语言 让用户得到更好的体验。5.
2021-01-04 22:00:16
405
原创 原型与原型链
原型概念：javascript都包含了一个proto的内部属性，这个属性对应的是自身除了原型proto之外，还有prototype属性，当函数对象作为构造函数创建实例时，prototype属性值将作为实例对象的原型proto原型链:当一个对象调用自身不存在的对象或者方法就会去自己proto关联的前辈prototype对象上去找，如果没有找到，就会去prototype原型proto关联的前辈prototype，依次类推到undefined，这就是原型链总结javascript中的对象都有一
2021-03-11 11:29:59
112
原创 vue-router路由原理，路由守卫，路由模式
良好的代码编写习惯也是非常重要的，它不但有助于代码的移植和纠错，也有助于不同技术人员之间的协作。我们要使我们的程序具有易读性，易扩展性，容错性。路由守卫&传参，请点击我了解详情第一步呢，我们要明白前端路由的概念它是通过改变URL在不重新请求页面的情况下，更新页面视图。vue-router有两种模式：hash、history更新视图但不重复请求页面，是前端路由原理的核心之一，目前在浏览器环境中，这一功能的实现主要有2种模式1.Hash：默认值，利用URL中的hash。在浏览器中.
2021-03-11 11:03:43
245
原创 css3/H5新特性
css3新特性1.选择器2.背景和边框3.文本效果4.2D/3D转换----->变形(transform)、过度(transtion)、动画(animation)1.选择器常规选择器有：:last-child //选择元素最后一个孩子:first-child //选择元素第一个孩子:nth-child(1) //按照第几个孩子给它设置样式:nth-child(even) //按照偶数:nth-child(odd) //按照奇数:disabled //选择每个禁用的dom元素:
2021-01-31 22:06:05
194
原创 link与@import区别
应用场景：<head> <!-- link是标签，引入外部样式表 --> <link rel="stylesheet" href="./a.css"> <style> /* @import 在css环境中 导入外部css */ @import url('./b.css'); .box{ width: 100px; height: 100px;
2021-01-30 15:31:27
158
原创 src和href的区别
首先我们先简述一下src与href的区别src<img src="图像URL" /> URL（Uniform Resource Locator,统一资源定位符）src是指向外部资源的位置，指向的内容将会嵌入到文档中当前标签所在位置；在请求src资源时会将其指向的资源下载并应用到文档内，例如js脚本，img图片和frame等元素。当浏览器解析到该元素时，会暂停其他资源的下载和处理，直到将该资源加载、编译、执行完毕，图片和框架等元素也如此，类似于将所指向资源嵌入当前标签内。这也是为什么将j
2021-01-30 15:25:00
1191
原创 CSS Hack
首先我们要先了解一下什么是css什么是Hackcss通常称为css样式表或层叠样式表又称级联样式表，主要用于设置HTML页面中的文本内容（比如:字体、大小、对齐方式）、图片的外形(宽高、边框样式、边距等)以及版面的布局等外观显示样式css给我们提供了丰富的功能，如字体、颜色、背景图的控制及整体排版css的优点(必须要熟悉)1.内容与分离；2.网页的表现统一，容易修改；3.丰富的样式，使得页面布局更加灵活；4.减少页面的代码量，增加网页的浏览速度；5.运用独立于页面的css，有利于页面被搜索
2021-01-30 15:12:54
80
原创 常见的块级/行内/空元素
行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？1.行内样式（行内样式表）行内样式表，我们又称内联样式、行间样式；都是通过标签的style属性来设置元素的样式，它的基本语法是：<标签名 style=“属性1:属性值1;属性2:属性2;”>内容</标签名>未完待定……...
2021-01-28 20:58:33
138
原创 Flex布局
前言：首先布局的传统解决方案，基于盒状模型，依赖display 属性+ position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。所以，W3C 提出了一种新的方案----Flex 布局，可以简便、完整、响应式地实现各种页面布局。目前，它已经得到了所有浏览器的支持，这意味着，现在就能很安全地使用这项功能。我们可以通过[下一篇文章]给出常见布局的 Flex 写法(http://www.ruanyifeng.com/blog/2015/07/flex-example
2021-01-28 17:05:46
59
原创 两/三栏布局(圣杯双飞翼)
常用的页面布局（两栏布局、三栏【圣杯、双飞翼】布局）1.两栏布局，左边定宽高，右边自适应左边左浮动，右边加oveflow:hidden;变成BFC清除左侧浮动元素的影响2.三栏布局，圣杯布局，双飞翼布局原来我做的主要是后台管理和一些移动端的项目，这两种布局呢是我原来查阅资料时看到的，所以就做了个简单的理解。圣杯布局和双飞翼布局是前端工程师需要日常掌握的重要布局方式。两者的功能相同，都是为了实现一个两侧宽度固定，中间宽度自适应的三栏布局。（中间先加载渲染）圣杯布局来源于一篇文章，而双飞翼布局来源
2021-01-28 16:54:59
113
原创 水平/垂直居中
元素居中的三种方式1.父相子绝后 子部分使用transform：translate(-50%,-50%) 2.给父盒子设置成一个弹性盒子，让子元素横向居中 纵向居中 3.父相子绝后给所有定位都为0，margin设置自适应auto一般我们最常用的就是第一种这是一道面试题假如 如何让一个元素在父元素中上下左右居中我们可以使用一下几种方式：方法一：父相子绝 这是一个最常用的父相子绝，子部分向左左向上移动本身宽度和高度的一半(也可以用transform:translate(-50%，-50%))
2021-01-28 10:08:08
76
原创 清除浮动的4种方式
前言:首先我们要清楚 为什么要清除浮动？清除浮动主要为了解决父元素因为子元素浮动引起内部高度为0的问题清除浮动的方法(最常用的4种)**1.额外标签法：**给谁清除浮动，就在某个元素后面添加一个空白的空标签**优点：**通俗易懂，书写方便但是不推荐使用**缺点：**添加许多无意义的标签，让结构复杂化用法：我们给small清除浮动（在small后面添加一个空白的标签clear 类名可以随意写），然后设置clear:both;代码展示:<div> <div class=
2021-01-26 18:04:03
838
原创 js的数据类型、堆&栈存储、多数据类型计算
js数据类型有哪些基本数据类型(值类型)：Number、String、Boolean、Undefined、NullSymboles6新增独一无二的值BigIntes10新增注：基本数据类型、又称值类型.堆&栈存储**值类型栈存储：**主要针对(number、string、boolean) 这三种数据类型。直接存储在栈(stack)中，占据空间小、大小固定，属于被频繁使用数据，所以放入栈中存储。例如：//当我们执行下方代码时栈内存中的变化:var a = 100;var b
2021-01-22 15:28:42
61
原创 常见浏览器兼容性问题及解决方案(面试题)
前言：不同的浏览器的内核不尽相同，所以各个浏览器对网页的解析存在一定的差异。浏览器内核主要分为两种：第一种：渲染引擎第二种：js引擎所以浏览器主要兼容性问题我一般分为两大部分：css兼容、js兼容五大浏览器内核Chrome谷歌之前Webkit，已改Blink内核FireFox火狐GeckoSsfari苹果WebkitIETridentOpera欧朋现已改用Google Chrome的Blink内核一、css兼容1.不同浏览器的标签
2021-01-19 20:13:49
11049
原创 JS操作DOM
首先，在原生js中我们要操作对象 从中我们要 获取、创建、删除、修改、节点之间的关系获取：通过id：getElementById2.通过name：getElementByName3.通过标签名：getElementByTagName4.通过类名：getElementByClassName5.通过选择器获取一个元素：querySelector6.通过选择器获取多个元素：querySelectorAll7.获取html标签：document.documentElement8.获取bod.
2021-01-19 14:10:09
192
原创 盒模型与BFC
1.什么是盒子模型？1.首先什么是盒模型？盒模型就是我们在html页面中每一个元素都可以被看作一个盒子，而盒子部分由四部分：内容区(constent)、填充区(padding)、边框区(border)、外边界区(margin)。2.盒模型有哪几种？两种模式：**标准模式下：**一个块的总宽度(页面中占的宽度)=width+margin(左右)+padding(左右)+border(左右)**怪异模式下:**一个块的总宽度=width+margin(左右)即width已经包含了padding和bo
2021-01-18 21:56:51
153
原创 项目开始时webpack配置（你肯定能用到！不收藏就找不到啦~）
项目开始时webpack配置vue-cli3以后，我们修改webpack配置，需要自己在项目根路径下创建vue.config.js文件.一、配置proxy跨域使用vue-cli开发项目，在本地开发 环境中，如果遇到跨域的问题，可以通过配置proxy的方式解决跨域问题.代码展示module.exports = { devServer: { open: false, // 自动启动浏览器 host: '0.0.0.0', // localhost port: 6060,
2021-01-18 19:48:52
167
1
原创 自定义组件 && 路由守卫
首先自定义组件我们可以用来 封装组件我先说一下我的组件封装和在项目中的封装.答：我用的是最新的vue脚手架开发的 项目，其中我都是采用的组件化开发的思想。一般我在搭建项目的时候，会创建一个views目录和commen目录和一个feature目录，在views目录中存放页面级的组件，在commen中存放公共组件（如：head公共头组件、foot公共的底部组件……），feature目录中存放功能组件（如：swiper轮播组件、tabbar底部切换功能组件、list上拉下拉组件）。在这里组件可以提升
2021-01-14 08:00:04
120
原创 自定义过滤器filter
首先：过滤器就是一个数据经过了这个过滤之后出来的另一样东西vue中的过滤器分为两种：全局过滤器和局部过滤器全局过滤器// global-filter是过滤器名称// 函数第一个参数是需要过滤的数据.// 函数第二个参数是给过滤器传递的值. Vue.filter('global-filter',(val,...args)=>{ console.log(`需要过滤的数据是:${val}`) return val + ' 过滤器追加的数据' })var app =
2021-01-13 08:01:27
190
原创 vue中如何自定义指令
首先它有全局指令（vue.directive())和局部指令（vue.directives());全局指令是用来全局注册指令，局部指令是组件或vue构造函数中接受一个directives的选项。**钩子函数：**指令含义函数提供了几个钩子函数(可选)bind:绑定元素的时候调用只调用一次，指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置。*inserted:绑定的元素插入父节点的时候调用被绑定元素插入父节点时调用 (仅保证父节点存在，但不一定已被插入文档中)。updat
2021-01-13 07:53:47
628
原创 vue中图片头像上传操作流程
前言：首先我采用的是vant-ui中Uploader 文件上传，然后在按需引入我们用到的组件，之后找到自定义上传样式 通过默认插槽可以自定义上传区域的样式。把它写入到我们的html里 <!-- 头像 --> <van-popup v-model="show" position="bottom"> <div class="img"> <div>拍照</div> <div>
2021-01-06 11:12:28
839
原创 Vuex 是什么？
前言:Vuex 是一个专门为 Vue.js应用程序开发的状态管理模式。它采用的是集中存储管理应用的所有组件的状态，vuex也是vue的官方调试工具。在数据量打的时候使用vuex它是由五种状态 分别是：state:存储状态getters:可以理解为state的计算属性。对数据获取之前的再次编译，我们在组件中使用 通过$sotre.getters.fun(方法)mutations:修改状态this.$store.commit({方法}) 再到vuex中 mutations里写自定义方法名，它是同
2021-01-04 21:37:49
133
原创 跨世纪-小程序总结-*冬季*
双向绑定小程序中普通的属性的绑定是单向的，要实现双向绑定的话就在对应属性前加入model:前缀，与vue相比，暂不支持表达式形式，双向绑定同意可以使用在自定义组件上父子传参父传子、在自定义组件的js文件中通过properties属性来接收参数，在父组件的子组件标签中双向绑定挂载自定义属性，然后在父组件中修改值同时子组件值也会修改。子传父、在子组件js文件中修改通过properties属性接收到的参数同时父组件中的值也会变化。小程序组件封装1.在根目录下创建一个components目录，用来存
2021-01-04 15:23:55
105
原创 作用域&闭包
作用域作用域定义变量作用域：就是一个变量可以使用的范围块级作用域内部定义的变量只在当前作用域有效，作用于之外就会报错。自由变量就是，当当前作用域使用的变量如果没有定义就会去他的父级作用域找，一直找到全局作用域，如果还没有找到的话就会报错，变量是undefined。 全局作用域 函数作用域 会计作用域（ES6新增）js中首先有一个最外层的作用域，全局作用域；js中可以通过函数来创建一个独立作用域称为函数作用域，函数可以嵌套，所以作用域也可以嵌套；es6中新增块级
2021-01-04 15:09:16
97
原创 原型与原型链
原型与原型链是jsjs是基于原型继承的语言如何准确判断一个变量是不是数组？手写一个简易的jQuery，考虑插件和扩展性class的原型本质，怎么理解？知识点 class和继承 类型判断instanceof 原型和原型链1.class构建：construction 有属性、方法//类class Student{ //属性 constructor(name,number){ this.name=name this.number=number } sayHi(){ /
2020-12-28 08:08:59
135
3
原创 天使童装微信小程序支付流程：
（商城余额支付，优惠支付，积分抵消，微信支付）前台后台 系统后台 微信后台 ：三部分流程：点击下单按钮，请求下单支付，后端返回支付参数，收到5个参数之后输入密码确认用户支付 输入密码是跟小程序 小程序是跟微信 然后返回给我们核心：5个参数传给微信后台，微信小程序支付流程：登录微信公众平台, 首先开通微信支付功能 这是准备工作的第一步，确保小程序对应的支付功能已经开启2.登录微信商户平台需要获取两个参数，一个是商户号 一个是支付秘钥，要注意待定……...
2020-12-27 23:56:34
555
原创 小程序生命周期钩子函数&vue生命周期04
生命周期：生命周期是指一个小程序从创建到销毁的一系列过程。小程序的两种生命周期在小程序中 ，通过App（）来注册一个小程序 ，通过Page()来注册一个页面。#1. 小程序应用的生命周期App()函数用来注册一个小程序。接受一个 Object参数，其指定小程序的生命周期回调等。App() 必须在 app.js 中调用，必须调用且只能调用一次。App({ onLaunch: function(options) { // 监听小程序初始化。小程序初始化完成时（全局只触发一次）
2020-12-27 23:55:59
573
原创 微信小程序授权登陆03
我们在项目中，登录，授权页面，都必须要传递token值。一般商品详情页面的商品收藏，加入购物车。购物车页面都需要传递token。token是前端鉴权的一种方式，token由后端生成， 是有时效性的。微信小程序登录授权，拿到token需要三步第一步：登录流程 ：前端—>后端—>腾讯服务器 wx.login—>wx.request—>后端—>小程序(腾讯)服务器第二步：`登录---->检测是否注册—>没有注册先获取用户信息进行注册（写入公司数据库）—>
2020-12-27 23:48:53
302
原创 小程序页面跳转方式，小程序存储02
有以下五种方式实现：首先从home页面跳转到detail页面可以使用1.js中的navigateTo 实现（它有返回键，不可以跳转到tabBar页面）2.也可以使用switchTab （它也是没有返回键，只能跳转到tabBar页面，不可以携带参数）3.reLaunch (有 首页 按钮可以 跳转任意页面， 但是没有返回)4.redirectTo ( 只可以跳转tabBar 页面， 没有返回，但有首页按钮)5.navigateBack (应用在目标页面， delta值为1 ，表示跳转上一页，2表示
2020-12-27 23:47:11
131
原创 小程序上拉加载更多如何实现01
上拉加载和下拉加载其实简单的来说就是一种懒加载原理，我们需要理清楚什么时候请求数据，请求返回的几种情况，那么做这个懒加载就很简单啦。1.首先固定一个包含列表数据的view高度，让它里面列表的数据溢出可以滚动首先给他设置y轴绑定一下设置滑动高度，循环view列表设置style高度和行高然后设置全局变量的loading，告诉大家我已经发起请求了2.列表数据请求分别分为两种情况：第一种是初始化加载的第一页的数据第二种是滚动到底部请求的下一页的数据如果最后一页的数据都请求完了，设置一个全局变量noMo
2020-12-27 23:44:35
284
原创 promise,小程序目录结构&封装wx.request()思路：
`图片加载promise封装原生ajax微信小程序auto-focus 自动获焦bindtap 按钮点击触摸事件bindblur 失去焦点view相当于divtext相当于span如何设置data数据：this.setDate({ txt:e.detail.value })获取data数据： this.data.txt循环默认有item和index小程序常用得组件 input button textPromise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作
2020-12-27 23:42:30
247
原创 哪些前端JS type&类型转换&深拷贝
一、tepeof能判断哪些类型：1.识别所有值类型2.识别函数3.判断是否是引用类型二、什么时候使用==:什么时候使用：存在隐士类型转换 可以判断一个对象的属性的时候使用其他情况使用===值类型和引用类型的区别const obj1 = {x:100,y:200} //"面试笔试的时候会考察"const obj2 = obj1let x1 = obj1.xobj2.x=101x1=102console.log(obj1)//{x:101}手写深拷贝注意点：1.注意判断.
2020-12-27 23:13:57
148
原创 前端面试：es6&class继承&解构赋值
es6解构赋值定义：语法：var a, b, rest;[a, b] = [10, 20];console.log(a); // 10console.log(b); // 20//对象解构({ a, b } = { a: 10, b: 20 });console.log(a); // 10console.log(b); // 20// ...rest 解构数组[a, b, ...rest] = [10, 20, 30, 40, 50];console.log(a); // 1
2020-12-16 23:05:47
545
原创 箭头函数&普通函数&var、let、const
1.箭头函数与普通函数的区别？1、箭头函数是匿名函数，不能作为构造函数，不能使用new2、箭头函数没有arguments，可以用展开运算符…解决3、箭头函数的this，始终指向父级的上下文4、箭头函数不能通过all() apply() bind() 方法直接修改它的this指向5、箭头函数没有原型属性2.Linux 命令：1. ls 查看文件/目录2. pwd 显示当前的工作目录 3. cd 进入目录 [例子]： cd 回到注册进入时的目录 cd /tm
2020-12-16 20:48:10
152
原创 Git&Github常用指令以及方法
1.Git基础1.什么是版本管理版本管理是一种文件变化的方式，以便将来查阅特定版本的文件内容。1.2人为维护文档版本的问题1.文档数量多且命名不清晰导致文档版本混乱2.每次编辑文档需要复制，不方便3.多人同时编辑同一个文档容易产生覆盖2.git是什么git是一个版本管理控制系统（缩写VCS），它可以在任何时间点将文档的状态作为更新记录保存起来，也可以在任何时间点将更新记录恢复回来。2.Git基本工作流程git仓库暂存区用于存放提交记录临时存放被修改文件工作目录
2020-12-16 20:12:55
120
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人