- 博客(99)
- 收藏
- 关注
RSS订阅原创 ES6-ES12常用语法汇总（下篇）
includes传入元素，如果数组中能找到此元素，则返回true，否则返回falseconst includeArr = [1,2,3,'小明','科比']const isKobe = includeArr.includes('科比')console.log(iskobe) // true跟indexOf很像，但还是有区别的const arr = [1,2,NaN]console.log(arr.indexOf(NaN)) // -1 indexOf找不到NaNconsole.lo.
2021-09-02 21:42:23
480
原创 ES6-ES12常用语法汇总（上篇）
let和constlet,const和var的区别. var有变量提升，有初始化提升，值可变. let有变量提升，没有初始化提升，值可变. const有变量提升，没有初始化提升，值不可变。但如果是定义对象，则属性可变，属性值也可修改。. 暂时性死区问题说明：其实let和const是有变量提升的，但是没有初始化提升var name = "林心如"function fn () { console.log(name) let name = 'sunshin_lin'}fn () //.
2021-08-16 21:33:29
647
原创 推荐团队与博客
汤姆大叔博客 张鑫旭博客 w3school 前端观察 w3cplus 腾讯Web前端 Alloy 团队 Blog 牧云云博客 ...
2021-07-04 22:42:39
49
原创 前端常用工具
阿里图标库 box-shadow生成工具 渐变生成器 CSS3 生成器 json格式化 奥森图标（中） 奥森图标（英） 图片压缩 ...
2021-07-04 22:31:21
66
原创 初中级前端面试复习总结（浏览器、HTTP、前端安全）
浏览器页面渲染流程1）字节流解码。浏览器获得字节数据，根据字节编码将字节流解码，转换为代码。2）输入流预处理。字符数据进行统一格式化。3）令牌化。从输入流中提取可识别的子串和标记符号。可以理解为对HTML解析， 进行词法分析，匹配标签生成令牌结构。4）构建DOM树、构建CSSOM树。DOM树和CSSOM树的构建过程是同时进行的， 在 HTML 解析过程中如果遇到 script 标签，解析会暂停并将执行权限交给 JavaScript 引擎， 等到 JavaScript 脚本执行
2020-09-11 09:11:03
438
原创 初中级前端面试复习总结（Vue篇）
对MVVM模式的理解MVVM 对应 3个组成部分，Model（模型）、View（视图） 和 ViewModel（视图模型）。1）View 是用户在屏幕上看到的结构、布局和外观，也称UI。2）ViewModel 是一个绑定器，能和 View 层和 Model 层进行通信。3）Model 是数据和逻辑。View 不能和 Model 直接通信，它们只能通过 ViewModel 通信。Model 和 ViewModel 之间的交互是双向的，ViewModel 通过双向数据绑定把 View 层和 .
2020-09-10 11:07:13
942
原创 初中级前端面试复习总结 （javascript篇）
数据类型String、Number、Boolean、Null、Undefined、Symbol、BigInt、Object堆、栈两者都是存放数据的地方。栈（stack）是自动分配的内存空间，它存放基本类型的值和引用类型的内存地址。堆（heap）是动态分配的内存空间，它存放引用类型的值。JavaScript 不允许直接操作堆空间的对象，在操作对象时，实际操作是对象的引用，而存放在栈空间中的内存地址就起到指向的作用，通过内存地址找到堆空间中的对应引用类型的值。隐式类型转换Java.
2020-09-09 16:51:05
201
原创 vue 开发中的技巧
1. Modal框的控制一个页面种通常会存在很多个不同功能的弹框，若是每一个弹框都设置一个对应的变量来控制其显示，则会导致变量数量比较冗余和命名困难，可以使用一个变量来控制同一页面中的所有Modal弹框的展示，比如某个页面中存在三个Modal弹框// bad// 每一个数据控制对应的Modal展示与隐藏new Vue({ data() { return { modal1: false, modal2: false,
2020-06-04 15:30:46
336
原创 前端工具方法总结
/** * 邮箱 * @param {*} s */export const isEmail = (s) => { return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s)}/** * 手机号码 * @param {*} s */export const isMobile = (s) => { return /^1[0-9]{10}$/.test(s)}
2020-05-26 16:23:33
789
原创 img 图片 下边距 解决办法
在不同浏览器下图片下面会出现莫名的下边距，经测算在FF中 下边距大概是多出了3像素左右，而IE6更多，在IE8中展示却是完好的，以往的做法只需要将img定义为块状级就解决了问题；但其原理是：图片底部的空隙实际上涉及行内元素的布局模型，图片默认的垂直对齐方式是基线，而基线的位置是与字体相关 的。所以在某些时候，图片底部的空隙可能是 2px，而有时可能是 4px 或更多。不同的 font-size ...
2020-03-09 10:41:20
702
原创 vue-cli打包 vendor文件 或app.js文件 过大
使用vue-cli脚手架打包后（UI使用的是Element-UI），发现vendor.js 文件很大，将近5M之多。文件过大会导致浏览器加载过慢，及其影响用户的体验。下面提供几种方式来解决此问题把不常改变的库放到index.html中，通过cdn引入比如中间会发现bootcss提供的cdn并不稳定，老是访问不了导致项目崩溃，这里推荐两个比较稳定的CDN jsdelivr 和 unpk...
2019-10-15 14:38:55
1533
原创 vue ali-oss 视频播放、下载封装组件
上面文章 https://blog.csdn.net/cxz792116/article/details/96906166 讲到了 ali-oss 视频上传组件的封装单如果想播放或者利用浏览器下载，还需要进一步的调用ali-oss 的接口文档，下面就开始这方面的介绍。1、获取 oss-ali , client 对象参数import OSS from "ali-oss" // 说明，直...
2019-07-27 10:30:56
1430
1
原创 vue ali-oss 视频上传封装组件
注册阿里云oss 账号 地址（https://www.aliyun.com/）创建Bucket3.设置Bucket （允许跨域）4. 生产accessKeyId 和 accessKeySecret5. 创建vue项目，并安装ali-ossnpm install ali-oss --save 或者 cnpm install ali-oss --save 6.单文件上传...
2019-07-22 22:01:48
3948
3
原创 forEach、filter、map、some、every、find、findIndex、reduce间的区别
forEach、filter、map、some、every、find、findIndex、reduce间的区别前言 从最开始学的for循环遍历方法，到后来层出不穷的各种遍历方法，其实最大的区别就是应用场景的不同。 我们最需要记住的就是，什么情况下用哪一种方法比较合适。从挑土豆开始 这里有一堆土豆，如果换成代码，可以表示如下 var potatos = [ {id:'1...
2019-06-19 11:15:57
342
原创 echarts 在vue中随窗口自适应
vue中使用echarts，随着浏览器窗口改变，自动响应。代码如下：// html<div ref="_chart" class="chart-style" /> // echarts盒子// js var app = new Vue({ el: '#app', data: { options: { tooltip: { ...
2019-03-06 13:27:33
1581
1
原创 vue-router路由 重定向
1、main.js 判断跳转import Vue from 'vue'import App from './App'import router from './router/common'import Dialog from 'hsy-vue-dialog'import store from './store/'import './config/style'import HappyS...
2019-02-26 15:37:29
7552
原创 vue 相关面试题总结
伴随着互联网的寒冬，2019年的金三银四随之到来。相信vue技术栈的小伙伴们，有的已经开始踏上找工作的征程中，结合自己的所学和理解，想把有关vue的面试题做下汇总，以此来记录自己的成长并且希望能给需要的小伙们一些帮助。谈谈你对MVVM开发模式的理解MVVM分为Model、View、ViewModel三者；Model代表数据模式，数据和业务逻辑都在Model层中定义；View代表UI...
2019-02-22 18:07:18
4101
原创 css 使用小技巧
1、混合模式不久之前Firefox和Safari浏览器已经开始支持类似Photoshop的混合模式，但是在Chrome和Opera浏览器中需要添加前缀。举个栗子：// 你也可以尝试不同的样式.blend { background: #fff;}.blend img { mix-blend-mode: darken; }2、渐变边框现在，你甚至可以在边框中使用渐...
2018-12-13 14:06:21
149
转载 ES6 完全使用手册
let和const 默认使用cont ，只有当确实需要改变变量的值的时候才使用let// eg：var foo = 'bar' // bad let foo = 'bar' // good const foo = 'bar' // better 模板字符串1> 模板字符串// eg:const foo = 'this is a'+ exa...
2018-11-28 16:13:44
816
原创 利用ES6 编写更好的条件语句
使用 Array.includes 来处理多个条件 请看下面的列子： // condition function test(fruit) { if (fruit == 'apple' || fruit == 'strawberry') { console.log('red'); } } 上面的列子看起来似乎没有什么问题。但是，如果我们还有更多的红色水果呢？是否要...
2018-11-02 15:05:05
1277
1
原创 echarts 在 vue 随浏览器窗口改变响应
代码基于element-ui框架<template> <el-row :gutter="40"> <el-col :span="9"> <el-card class="box-card"> <div slot="header" class="cle
2018-09-07 17:30:24
1540
原创 分享下载
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name=&qu
2018-08-31 15:37:47
272
原创 常用 javascript 方法 总结
1、深拷贝方式2，利用json对象转化为字符串的方法var clone2 = function(v) { return ( JSON.parse(JSON.stringify(v)) );}2、深拷贝方式一： 递归拷贝var clone = function(obj) { var newObj = obj.constructor === Array ? [...
2018-08-17 14:17:06
224
原创 vue 中 axios 的全局封装
import axios from 'axios';import qs from 'qs';import { Message } from 'element-ui';const proxyserver = 'proxyserver';// axios 配置proxy// axios.defaults.timeout = 10000;axios.defaults.headers.pos...
2018-08-17 13:47:21
170
原创 javascript 基础总结(一)
一、Javascript ECMAScript(ES)：规定了js的一些基础核心的知识（变量、数据类型、语法规范、操作语句等）。DOM： doucument object model 文档对象模型，里面提供了一些属性和方法，可以让我们操作页面中的元素。BOM： browser object model 浏览器对象模型，里面提供了一些属性和方法，可以让我们操作浏览器。二、变量和常量变...
2018-07-26 16:39:14
475
原创 js 面试总结（一）
1、window.onload 和 $(document).ready()的区别window.onload是在页面中包含图片在内的所有元素全部加载完成再执行；$(document).ready()是DOM树加载完成之后执行，不包含图片，其他媒体文件；因此$(document).ready()快于window.onload执行；2、数组去重方法const arr = ['a','b...
2018-07-20 10:15:32
159
原创 vue 资料合集
UI组件element ★11612 - 饿了么出品的Vue2的web UI工具套件Vux ★7503 - 基于Vue和WeUI的组件库iview ★5801 - 基于 Vuejs 的开源 UI 组件库mint-ui ★5517 - Vue 2的移动UI元素vue-material ★2790 - 通过Vue Material和Vue 2建立精美的app应用muse...
2018-07-03 10:35:16
564
原创 pc 图片上传
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>文件上传</title> <style type="text/css"> label{ di
2018-07-03 10:23:53
1124
原创 vue 学习笔记（七）
1、初始渲染的过渡 // 可以通过appear 特性设置节点在初始渲染的过渡。和进入/离开过渡一样，同样也可以自定义css类名，自定义钩子函数<style> .slide-fade-enter-active { transition: all .3s ease; } .sli...
2018-07-02 14:49:21
313
转载 前端收藏夹
前端工具自动化： Gulp 、 Grunt 、百度Fis 、Ant、Yeoman、Codekit、Koala、Webpack预编译： Slim、Haml、Coffeescript、Sass、BabelJs、Jade、Less、Stylus、Pleeease、PostCSS、查找工具：CssTriggers、screensiz.es、友盟指数、javascripting、builtw...
2018-06-30 15:06:42
548
原创 vue 学习总结笔记（六）
vue在插入、更新或者移除DOM时，提供多种不同方式的应用过渡效果。包括以下工具：a、在css过渡和动画中自动应用classb、可以配合使用第三方css动画库，如 Animate.cssc、在过渡钩子函数中使用javascript直接操作DOMd、可以配合使用第三方javascript动画库，如 velocity.jsvue提供了transition的封装组件，下列情形中，可以给任...
2018-06-30 14:22:10
270
1
原创 vue 学习总结笔记（五）
一、编写可复用的组件对于需要复用的组件，应当定义一个清晰的公开接口，同时也不需要对其外层数据做出任何假设。vue组件的api来自三个部分----prop、事件、插槽:a.prop 允许外部环境传递数据给组件。b.事件 允许从组件内部触发外部环境的副作用。c.插槽 允许外部环境将额外的内容组合在组件中。使用v-bind和v-on的简洁语法，模板的意图会更清晰。<...
2018-06-22 15:38:55
271
原创 vue 学习总结笔记（四）
一、自定义事件 父组件通过prop给子组件传递数据，子组件则通过自定义事件和父组件通信。1.使用v-on绑定自定义事件 每个vue实例都实现了事件接口，即 a.使用$on(eventName) 监听事件 b.使用$emit(eventName,optionalPayload)触发事件父组件可以在使用子组件的地方直接使用v-on来监听子组件出触发的事件，不能使用$...
2018-06-22 14:05:55
337
原创 vue 学习总结笔记（三）
一、如何使用组件 1.全局注册一个组件Vue.component('my-component',{ template:'<div>这是一个组件</div>'});// 注： 全局组件在任何实例中都可以使用。要在实例中使用全局组件，必须在初始化根实例之前注册组件，否则会报错。2.注册一个局部组件/**html**/<div id='a...
2018-06-21 14:44:36
243
原创 vue 学习总结笔记（二）
一、事件处理1.监听事件： v-on指令监听DOM事件2.事件处理方法 a.在触发时运行一些简单的javascript代码 <button v-on:click="counter += 1">Add 1</button> b.接收一个需要调用的方法名称 <button v-on:click="greet...
2018-06-21 10:43:19
206
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人