前端
Junior Tacoo
欢迎一起探讨前端知识
展开
-
const that = this -----------------------------work 5.26
const that = this(保证你的作用域能传递到里边)出现这个情况就类似,一个大房间(this),然后你手里拿着个扳手(resetForm),然后大房间内还有个封闭的小房间(闭包函数),小房间里的人喊着要扳手(resetForm)但是根本找不到扳手,那么只能喊大房间外边的你递扳手,所以小房间和大房间要拉根联系的电话线,传递消息(let 变量名 = this),拉通了,才能喊你递扳手进小房间(变量名.resetForm)去使用MessageBox 组件相关<scr...原创 2021-05-26 17:22:39 · 583 阅读 · 0 评论 -
2021-05-24 BUG修改
在相应的input上加word-wrap:break-word;word-break:break-all;给框里文字加个强制换行~原创 2021-05-24 09:45:42 · 143 阅读 · 0 评论 -
前端工作日志 5.20 ————flatMap 与 map 方法
昨晚老大发了一个这个:同学们今天看到一段代码 :差不多是这个意思有啥更简单的写法吗答案是flat和flatMap:flatMap能用于在map期间增删项目(也就是修改items的数量)。换句话说,它允许你遍历很多项使之成为另一些项(靠分别把它们放进去来处理),而不是总是一对一。从这个意义上讲,它的作用类似于filter的对立面。只需返回一个1项元素数组以保留该项,返回一个多元素数组以添加项,或返回一个0项元素数组以删除该项。例子:把下面数组里的数,解析成,如果...原创 2021-05-20 11:13:08 · 376 阅读 · 1 评论 -
4.13 Work Day5 ——React学习
版本:16.x引入好相应的js文件(babel.min.js 是jsx 编译转换为js的)①创建虚拟DOM:在script外 —————— <div id="test"> “这里是容器”</div>const VDOM= <h1>HELLOW!</h1>②渲染虚拟DOM到页面:ReactDOM.render(x,y) ————ReactDOM.render(VDOM,document.getElementById(...原创 2021-04-13 18:02:53 · 112 阅读 · 0 评论 -
入职第四天 2021-04-12
1.流式布局&calc函数【流式布局(Liquid Layout)流式布局的特点是页面元素的宽度按照屏幕分辨率进行适配调整,但整体布局不变。(栅格布局)。】CSS3中的calc属性 就是流式布局的经典呈现:表示父盒的高度100%的下面减少60px (就不会有多余出来的东西和滚动条了...(100%是 子盒子以父元素为基准之后再 -60px)以使用calc()给【几何属性】元素 ————border、margin、pading、font-size和width设置动态值...原创 2021-04-12 17:52:18 · 64 阅读 · 0 评论 -
2021-04-09 入职第三天工作总结
1.公司用的scss与 less sass的区别1.>>> 这个是权重MAX符2.宏定义 @mixin①比如垂直居中@mixin t-center{position: absolute;left: 50%;top: 50%;transform:translate(-50%,-50%)}②带参数的 mixin——假设封装一个flex样式:@mixin df($fd,$jc,$ai,$as){ display:flex; flex-...原创 2021-04-09 18:00:37 · 314 阅读 · 1 评论 -
MVC与MVVM的区别
MVC与MVVM的区别区别:MVVM将“数据模型数据双向绑定”的思想作为核心(所以view和model之间没联系)。而Model和ViewModel之间的交互是双向的,因此视图的数据的变化会同时修改数据源,而数据源数据的变化也会立即反应到View上。它实现了View和Model的自动同步,也就是当Model的属性改变时,我们不用再自己手动操作Dom元素,来改变View的显示,而是改变属性后该属性对应View层显示会自动改变。MVVM:MVC:...原创 2021-03-23 00:52:39 · 98 阅读 · 0 评论 -
构造函数、原型、实例 三者的关系
构造函数、原型、实例 三者的关系 <script> // 构造函数来创建对象: function Star(uname,age){ this.uname=uname; this.age=age; // this.sing=function(){ // console.log('唱的歌'); // } }原创 2021-03-19 01:46:06 · 90 阅读 · 1 评论 -
面试题——请讲讲JavaScript的作用域
JavaScript的作用域在ES6之前,js的作用域只有两种:1.全局作用域定义在所有函数{}之外的变量,其作用范围是在整个脚本中2.局部作用域(函数作用域)使用var定义在函数内部的变量,其作用范围是整个函数结构,超出函数的 {} 花括号的范围则不能使用。3、块级作用域(ES6中):在一个{}中使用了let关键字声明的变量具有块级作用域 只能在{}内调用(用var关键字声明是没有块级作用域的)PS:补充知识:块级作用域的三大特点1.无变量提升——在ES6中 let只能先声明再使用,也就是原创 2021-03-12 00:50:03 · 192 阅读 · 0 评论 -
递归的简单理解
1、递归是什么?五个字——’我调我自己‘!递归指的是函数在其内部再次调用自己本身,完成一些(诸如循环遍历等)操作。2、如何实现简单的递归?下面我封装了一个 通过传参输入id就可以查询并返回相应商品的ID值,只不过 图一只能返回一级商品,商品的下一级并不能被查询返回到:(如果此处传参输入(data,11) 返回的是undefined) <script> var data = [{ id: 1, name: '彩电原创 2021-03-09 23:58:40 · 150 阅读 · 0 评论 -
css的z-index权重问题 个人理解
css的z-index权重问题首先z-index这个属性需要在当前盒子内加上position:xxx;才能用如果父盒子A、父盒子B都加了定位,那么谁的z-index:x 这里谁的x值谁在谁上面如果父盒子A有子盒子a、父盒子B有子盒子b都加了定位。如果B的z-index:x 值大于A的z-index:x ,那么即使a的z-index:x值再大,a也同A一起压在B下面小总结:定位的元素在没定位的元素上面 同样没定位的两个盒子,其中一个盒子的子元素定位了,子元素所在的盒子在未定位的元素.原创 2021-03-06 15:29:28 · 300 阅读 · 0 评论 -
JS迭代的方法有哪些?有什么区别?
JS迭代的方法有哪些?有什么区别?1、every()every()返回的是布尔值,every的意思是'全都要满足',将一个数组中的每一项都return后的条件进行比较,如果每一项都符合条件,返回true,否则返回false;(功能如其名,每一项都要满足 everything enough2.some()some的意思是'部分满足',将一个数组中的每一项都return后的条件进行比较,只要有一个满足条件,就返回true。(some one enough3、filter()filter.原创 2021-03-05 00:42:40 · 273 阅读 · 1 评论 -
面试题
<script> var name = 'world!'; (function() { var name; if (typeof name === 'undefined') { name = 'J' console.log('Good' + name); } else { console.log(.原创 2021-03-03 23:27:34 · 107 阅读 · 1 评论 -
数组去重两种方法
1.核心:indexOf()是查询数组索引的方法,当他返回为-1时 代表没有找到符合条件的元素。function unquire(arr){var newArr = [];for(var i=0;i<arr.length;i++){ if(newArr.indexOf(arr[i])===-1){ //核心 newArr.push(arr[i]) //核心}}return newArr ;}var f1=unquire([a,b,c,d,e]);2....原创 2021-03-03 17:41:10 · 377 阅读 · 0 评论 -
浅谈JS的闭包
1.什么是闭包?当一个函数可以访问另一个函数的局部变量,此时就会有必报的产生。这个被访问的函数就称为闭包函数 (例下面的fun就是闭包函数)2.生成闭包的条件是什么?闭包的生成有三个必要条件(缺一不可)①. 在函数 A 内部直接或者间接返回一个函数 B②. B 函数内部使用着 A 函数的局部变量③. A 函数外部有一个变量接受着函数 Bfunction fn(){var num = 10; function fun(){console log(num);} ..原创 2021-03-02 21:46:36 · 112 阅读 · 1 评论 -
浅谈javaScript的深拷贝与浅拷贝
1.浅拷贝: 将原对象或原数组的引用直接赋给新对象,新数组,新对象/数组只是原对象的一个引用2.深拷贝: 创建一个新的对象和数组,将原对象的各项属性的“值”(数组的所有元素)拷贝过来,是“值”而不是“引用”通俗点说 就是假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明是浅拷贝,如果B没变,那就是深拷贝。往深了说,就是B复制了A,如果B复制的是A的引用,那就是浅拷贝,如果B复制的是A的本体,那就是深拷贝。我们在什么情况下会用到深拷贝?我们希望在改变新的数组(对象)的时候,不改原创 2021-03-02 21:38:19 · 82 阅读 · 1 评论 -
null和undifind的区别?
null和undifind的区别?null表示这里没有对象,不应该有值 数值为空 ——转化为数值为0undifind表示此处可以有值,只是这个值未定义 ——转化为数值为NaN原创 2021-02-27 23:03:48 · 704 阅读 · 0 评论 -
==与===有什么区别
==与===有什么区别?==是相等运算符 只要求左右两边数值相等 就可以返回true===是严格运算符 要求左右两边数值、类型都相等 才可以返回true原创 2021-02-27 23:01:15 · 500 阅读 · 1 评论 -
如何用css实现正三角、倒三角?
如何用css实现正三角?如何用css实现倒三角?原创 2021-02-26 13:47:22 · 612 阅读 · 0 评论 -
CSS如何实现水平垂直居中?4种工作中非常常用的方法
*CSS如何实现水平垂直居中?**1.用定位中的 “子绝父相” 来做 [核心代码是给子盒子添加的margin-top、margin-left 分别等于自身的高度、宽度的负的 一半]PS:缺点:需要提前知道元素的尺寸。如果不知道元素尺寸,这个时候就需要JS获取了。2. 用定位中的 margin: auto 来做 当然也是要在绝对定位下3.绝对定位————位偏移4.CSS3.0弹性布局弹性布局① 给body(父盒子)加弹性元素display: flex;align-items: c...原创 2021-02-26 11:58:40 · 18044 阅读 · 14 评论 -
CSS3有哪些新特性?
CSS3有哪些新特性? 圆角(border-radius:8px)多列布局(multi-columnlayout)阴影和反射(Shadow\Reflect)文字特效(text-shadow、)文字渲染(Text-decoration)线性渐变(gradient)旋转(transform)缩放,定位,倾斜,动画,多背景...原创 2021-02-25 23:15:17 · 168 阅读 · 0 评论 -
行内元素有哪些?块级元素有哪些? 空(void)元素有那些?
首先:CSS规范规定,每个元素都有display属性,确定该元素的类型,每个元素都有默认的display值,如div的display默认值为“block”,则为“块级”元素;span默认display属性值为“inline”,是“行内”元素。(1)行内元素有:abspanimginputselectstrong(强调的语气)(2)块级元素有:divulollidldtddh1h2h3h4…p(3)常见的空元素:<br><hr>...原创 2021-02-25 23:11:57 · 6830 阅读 · 0 评论 -
如何区分 HTML 和HTML5?
如何区分 HTML 和HTML5?面试中经常问道——如何区分 HTML 和HTML5?核心是:DOCTYPE声明的方式是区分HTML和HTML5标志的一个重要因素。(长这个样子的是HTML :html:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 S原创 2021-02-25 00:38:03 · 2196 阅读 · 0 评论 -
bind,apply,call的区别
面试问题——bind,apply,call的区别bind,apply,call三者都是改变this的指向的,当一个 Object 没有某个方法,但是呢,其它的对象有,我们可以借助 call 或 apply 用其它对象的方法来操作。不同之处在于,①call 方法传递给调用函数的参数是逐个列出的,而 apply 则是要写在数组中。②bind是返回对应函数,延迟调用,call与apply是立即调bind是返回对应函数call:apply:...原创 2021-02-25 00:30:57 · 88 阅读 · 1 评论 -
每次保存代码时弹出build failed报错
项目场景:新手刚开始基于vue-ui做项目时 可能会遇到每次保存代码时右下角弹出build failed报错 严重影响我们的项目编码体验有人通过lint自动检测修改命令 然而只能解决皮毛,且很繁琐问题描述:刚创建完项目,每次保存代码时弹出build failed报错解决方案:通过vue-ui的主页中的配置 关闭ESlint (如下图)右下角别忘记点下保存 基本上就能解决了ps:原因——[ESlint是自动检测&纠错代码的工具,默认是开启的,所以要手动去关闭]...原创 2021-01-29 00:10:02 · 2909 阅读 · 0 评论 -
当我们在创建项目 初始化App.vue后报错问题
当我们在创建项目 初始化App.vue(删光app.vue的template等内容)时 右下角报错:右下角会有error报错 此时我们打开Vue的可视化面板——左侧第五个任务——serve后会有1-2个错误 红色叹号解决:我们打开Vue的可视化面板——任务——init 自动检查错误结束后重新运行serve 即可以重新启动app...原创 2021-01-27 20:34:15 · 909 阅读 · 1 评论 -
如何安装 3.X版本的Vue脚手架
如何安装 3.X版本的Vue脚手架首先打开命令行工具Node.js 执行 npm install -g @vue/cli我们耐心等待一段时间之后通过 vue -V 来查看是否安装成功原创 2021-01-27 11:57:48 · 378 阅读 · 0 评论