我也要用- 博客(129)
- 资源 (1)
- 收藏
- 关注
RSS订阅
原创 前端自己平时总结
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
2019-02-24 23:06:42
469
原创 vue中引入sass全局函数
sass或者less都提供变量设置，在需求切换主题的项目中使用less或者sass变量，只要修改变量值，编译后所有用到该变量的样式都会被修改为你想要的效果，但是在vue-cli搭建的项目中，在main.js中全局引入一个scss文件，在其中定义变量在其他组件或者页面中引用报变量未定义错误，其他的样式可以正常显示，显然是编译的问题。傻瓜式引用在每个用到全局变量的组件都引入该全局样式文件@import 'path/fileName.scss'但是组件或者页面不在统一层目录下，引入...
2021-11-10 13:03:47
17
原创 adb安装
Mac安装adb，最简单的办法是用homebrewhomebrew是macOS的一个包管理工具1、安装homebrewruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"2、安装adbbrew cask install android-platform-tools3、运行adbadb devices4.配置环境变量打开终端，入当前用户的home目录
2021-11-09 10:56:02
1657
原创 Vue3的优势
一、Vue 3.0 性能提升主要是通过哪几方面体现的？1、源码体积的优化重写了虚拟 dom2、响应式系统的升级用 Proxy 和 Reflect 来代替 vue2 中的 Object.definepeoperty()方法来重写响应式 vue3 中可以监听动态新增的属性 vue3 中可以监听删除的属性 vue3 中可以监听数组的索引和 length 属性3、代码编译优化使用了 组合 API 来代替 vue2 中的 Options API 组件内不需要根节点了，使用 fragment
2021-08-14 08:04:20
36
原创 自己写工具包发布到npm流程
把通用的功能开发成npm包，便用使用和维护，更重要的是可以分享给广大的开发者，是不是很激动人心！那么，步骤如下：1.创建项目创建项目目录，npm init ，根据需要输入配置信息（建完后也可以在package.json中自行修改）npm init控制台如图:生成一个package.json文件 如图:配置项name: 说明了npm包的名称，也就是publish后可以在npmjs中通过该名称搜索到version：版本号main：入口文件2.创建ind.
2021-07-28 19:42:16
23
原创 后台返回的数据有回车换行符号，前端也要进行相应的换行显示
解决方法：使用<pre>或<code>标签，它们会自动识别和处理后台返回的换行符号。此外，超出容器外的内容需要进行换行处理的话，可以使用样式：white-space:pre-wrap;
2021-07-05 18:55:41
26
原创 vue3学习
下载脚手架:npm install -g @vue/clivue create 搭建新项目:vue create <Project Name> //文件名 不支持驼峰（含大写字母）
2021-07-04 22:17:29
11
1
原创 Vue中使用swiper插件实现轮播图
Vue中集成使用swiper插件实现轮播图 集成vue-awesome-swiper组件支持vue的写法:终端输入如下命令下载vue-awesome-swiper和swiper
2021-06-23 14:36:25
416
原创 iOS 模拟器设置输入中文
在IOS 模拟器中 输入中文模拟器默认的配置种没有“小地球”，只能输入英文。加入中文方法如下：找到模拟器的Settings--->General-->Keyboard-->International KeyBoards-->Add New Keyboard-->Chinese Simplified(PinYin) 即我们一般用的简体中文拼音输入法，配置好后，再输入文字时，点击弹出键盘上的“小地球”就可以输入中文了。...
2021-04-02 15:29:55
55
原创 vscode保存文档自动格式化配置
editor.formatOnSave上图片 一个图片胜过千言万语:在设置中搜索editor.formatOnSave之后勾线成对号就行了 每次保存文档都会自动格式化了
2021-03-28 16:20:43
263
原创 js 平级树变成树形结构
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body></body>.
2021-01-01 23:10:46
277
1
原创 postMessage实现iframe和父页面之间的通信
postMessage的使用一、简介1、postMessage()方法允许来自不同源的脚本采用异步方式进行有限的通信，可以实现跨文本档、多窗口、跨域消息传递2、postMessage(data,origin)方法接受两个参数：（1）data:要传递的数据，html5规范中提到该参数可以是JavaScript的任意基本类型或可复制的对象，然而并不是所有浏览器都做到了这点儿，部分浏览器只能处理字符串参数，所以我们在传递参数的时候需要使用JSON.stringify()方法对对象参数序列化，在低版
2020-12-26 22:06:19
816
原创 在vue项目中css或者less的定义全局的变量方法
1.首页在css中写入base.css：/* root选择器用匹配文档的根元素。在HTML中根元素始终是HTML元素。在根元素下自定义一些变量的样式 */:root{ border:1px solid blue;/* 设置样式 */ --bg-color:red;/* 设置自定义的样式 */ --font-size:30px; --height-min:100px;}2.在最外层的组件入口引入即可: @import './assets/css/base.css'
2020-12-26 21:42:26
906
原创 vue响应式原理
//响应式原理 let obj = { name: 'yangedong', age: 12 } Object.keys(obj).forEach((key) => { let value = obj[key]; Object.defineProperty(obj, key, { set(newVal) { console.log('监听' + key + "的改变") value = newVal .
2020-12-21 23:08:40
26
原创 个人总结：回文字符串判断的三种方式总结
/* 方法1： * 判断是不是回文字符串 * 方法一思路旋转之后看两个字符串是否相等 */function hw(str){ let newStr=''; let len=str.length-1; for(let i=len;i>=0;i--){ newStr+=str[i]; } console.log(str,newStr,str==newStr); return str==newStr...
2020-12-19 09:08:59
189
1
原创 webpack压缩大图片之项目资源优化
webpack打包时，会根据webpack.config.js中url-loader中设置的limit大小来对图片进行处理，小于limit的图片转化成base64格式，其余的不做操作。对于比较大的图片我们可以用image-webpack-loader来压缩图片。在webpack.config.js中配置：image-webpack-loader 可能npm 下载不下来 改成淘宝镜像$ npm install -g cnpm --registry=https://registry....
2020-11-16 13:43:23
159
原创 webpack学习记录
下载webpack:npm install webpack webpack -D终端使用：webpack ./src/entry.js -o ./dist/bulid.js --mode=development 开发环境开发 webpack ./src/entry.js -o ./dist/bulid.js --mode=production 生产环境开发...
2020-11-14 23:24:34
35
原创 普通函数和箭头函数的区别
详解箭头函数和普通函数的区别以及箭头函数的注意事项、不适用场景箭头函数是ES6的API，相信很多人都知道，因为其语法上相对于普通函数更简洁，深受大家的喜爱。就是这种我们日常开发中一直在使用的API，大部分同学却对它的了解程度还是不够深…普通函数和箭头函数的区别：箭头函数的this指向规则：箭头函数没有prototype(原型)，所以箭头函数本身没有thislet a = () =>{};console.log(a.prototype); // undefined1 2箭
2020-11-07 16:45:13
93
原创 ts学习-4
ts中的类和类的继承//ts中的类定义class Person{ name:string;//属性 前面省略了public关键字 constructor(name:string){ this.name=name; } getName():void{ console.log("类中的获取name的值："+this.name) } setName(name:string):void{ this.nam..
2020-11-05 09:08:30
67
原创 ts学习-3
/* typescript中的数据类型typescript中为了代码的书写规范 有利于维护增加了类型校验布尔类型（boolean)数字类型（number)字符串类型（string)数组类型（array)元组类型（tuple枚举类型（enum)任意类型（any)null和undefinedvoid 类型never 类型*//* 布尔类型*/var flag:boolean=true;flag=false;/* 数字类型 number*/var a:number=1.
2020-11-03 23:00:31
41
原创 ts学习笔记-2
/* typescript中的数据类型typescript中为了代码的书写规范 有利于维护增加了类型校验布尔类型（boolean)数字类型（number)字符串类型（string)数组类型（array)元组类型（tuple枚举类型（enum)任意类型（any)null和undefinedvoid 类型never 类型*//* 布尔类型*/var flag:boolean=true;flag=false;/* 数字类型 number*/var a:number=1.
2020-11-01 16:27:20
33
原创 typeScript开始学习记录的笔记
第一章安装typeScript:npm install -g typescript检查是否安装成功：tsc -v //查看本版号使用：新建文件index.ts里面内容是：varstr:string='sss';如何生成index.js文件呢在对应的终端 使用命令：tsc index.ts 就会生成对应的index.js文件D://typeScript tsc index.tsts文件开发工具其实有更好的方式去执行开发和编译js文件的配置...
2020-10-31 23:18:18
163
原创 js数组扁平化的方法（flat）汇总
js数组扁平化的方法（flat)方法的总结：/** js数组扁平化的方法（flat)方法的总结*//**方法1：*/let arr=[1,[2,34,[4,5]]];let str=JSON.stringify(arr);// [1,[2,34,[4,5]]]// 方式1：flat()console.log(arr.flat(Infinity));//[1, 2, 34, 4, 5]// 方式2：字符串替换拼接序列化str=str.replace(/(\[|\])/g,''...
2020-10-29 19:46:29
393
原创 高阶函数的一个特殊用法-函数柯里化
第一次看到柯里化这个词的时候，还是在看一篇算法相关的博客提到把函数柯里化，那时一看这个词就感觉很高端，实际上当你了解了后才发现其实就是高阶函数的一个特殊用法。果然是不管作用怎么样都要有个高端的名字才有用。首先看看柯里化到底是什么？维基百科上说道：柯里化，英语：Currying(果然是满满的英译中的既视感)，是把接受多个参数的函数变换成接受一个单一参数（最初函数的第一个参数）的函数，并且返回接受余下的参数而且返回结果的新函数的技术。看这个解释有一点抽象，我们就拿被做了无数次示例的add函数
2020-10-29 16:40:03
48
原创 GET和POST两种基本请求方法的区别(面试用)
get参数通过url传递，post放在request body中。 get请求在url中传递的参数是有长度限制的，而post没有。 get比post更不安全，因为参数直接暴露在url中，所以不能用来传递敏感信息。 get请求只能进行url编码，而post支持多种编码方式 get请求会浏览器主动cache，而post支持多种编码方式。 get请求参数会被完整保留在浏览历史记录里，而post中的参数不会被保留。 GET和...
2020-10-21 19:46:33
385
原创 nginx window使用
1.下载之后配置杀死nginx进程:taskkill /im nginx.exe /f启动：start nginx或者nginx.exe.启动nginx有很多种方法启动nginx(1)直接双击nginx.exe，双击后一个黑色的弹窗一闪而过(2)打开cmd命令窗口，切换到nginx解压目录下，输入命令 nginx.exe 或者 start nginx ，回车即可...
2020-10-19 19:46:32
50
1
原创 js编程实现功能
1.编写一个JavsScript函数 fn，该函数有一个参数 n（数字类型, n <=31），其返回值是一个数组，该数组内是 n 个随机且不重复的整数，且整数取值范围是 [2, 32]。（可以使用伪代码） function fn(n,min,max){ //n最大是31 if(n>31){ n=31; } let allArr=[];//区间内的所有整数..
2020-10-16 14:00:44
155
原创 view-name
1.不使用原有的数组方法遍历数组 ：递归 定时器 计时器2.生命周期除了八种之外的 keep-alive中的active deactive3.函数柯里化
2020-10-14 19:56:15
160
原创 JavaScript之冒泡排序
我们去大厂面试前端的时候，最容易被问及的一个内容就是排序，而其中，冒泡排序作为最基础的排序算法，很多时候是被要求进行手写代码的，面试官通过对手写代码的考察，可以看出求职者的算法基础功底、JavaScript语言功底以及在开发时，对变量的语义化水平。下面，将对冒泡排序的原理进行讲解。01冒泡排序原理假设数组中有n个数，比较相邻两个数的大小，若前者大于后者，则两数交换位置。这样，第一轮结束的时候，就可以选出最大的一个数放在最后面，那么，经过n-1轮之后，所有的数就完成了排序。02代码演示
2020-10-12 20:03:03
65
原创 数组方法汇总js
1.concat定义和用法concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。语法arrayObject.concat(arrayX,arrayX,......,arrayX)参数 描述 arrayX 必需。该参数可以是具体的值，也可以是数组对象。可以是任意多个。 返回值返回一个新的数组。该数组是通过把所有 arrayX 参数添加到 arrayObject 中生成的。如果要进行 concat().
2020-10-12 10:11:57
61
2
原创 js中原型和原型链
1.创建一个没有原型的对象：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .e.
2020-09-20 10:51:02
60
原创 JSON序列化与自定义toJSON
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .error{ bor.
2020-09-16 22:16:46
121
原创 使用代理完成自定义验证组件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .error{ bor.
2020-09-16 21:47:32
42
原创 使用new Proxy实现vue数据双向绑定原理
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <input .
2020-09-15 21:54:15
473
原创 js对象的一些用法
1.使用展示语法完成对象合并属性相同后面覆盖前面的属性： //使用展示语法完成对象合并 属性相同后面覆盖前面的属性 let obj={ name:'yang', height:200 } let nameObj={ name:'zhang' } let newObj={...obj,...nameObj}; console.log(newObj)/* {name: "zhang", height: 200} */...
2020-09-06 19:30:50
62
原创 call和apply区别/bind的使用
构造函数：//构造函数function User(name){ this.name=name}// let obj=new user('yang');// console.log(obj);let UnameObj={ age:12, height:150}User.call(UnameObj,'赵四_刘能——多行不义必自毙');User.apply(UnameObj,['赵四_刘能——多行不义必自毙']);console.log(UnameObj);/* {age: 1
2020-09-05 22:30:25
69
原创 2020-09-01- ES6 Map对象使用
1.基本的操作：增删改查 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> </bo.
2020-09-01 23:00:14
61
原创 es6 WeakSet使用
//new WeakSet()声明 let weakObj=new WeakSet(); let obj={a:'jspang',b:'技术胖'} let obj1=obj; //添加元素 不允许重复 weakObj.add(obj); weakObj.add(obj1); console.log(weakObj);// console.log(weakObj.size);// /* WeakSet {{…}} [[Entries]] 0: value: .
2020-08-26 15:17:47
109
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人 TA的粉丝