js清空数组的方法

方式1：splice函数 arrayObject.splice(index,howmany,element1,…..,elementX) index：必选，规定从何处添加/删除元素。 howmany：必选，规定应该删除多少元素。未规定此参数，则删除从 index 开始到原数组结尾的所有元素。 element1:可选，规定要添加到数组的新元素。

1
2
3
4
<script type ="text/javascript">  
　　var arr = [1,2,3,4];  
   arr.splice(0,arr.length);  
</script>

  方式2：给数组的length赋值为0

1
2
3
4
<script type ="text/javascript">  
　　var arr = [1,2,3,4];  
   arr.length = 0;
</script>

  赋予数组的长度小于本身的长度，数组中后面的元素将被截断。 赋予数组的长度大于本身的长度，将扩展数组长度，多的元素为undefined。 方式3：直接赋予新数组 []

1
2
3
4
<script type ="text/javascript">  
　　var arr = [1,2,3,4];  
   arr = [];
</script>

  这种方式为将arr重新复制为空数组，之前的数组如果没有被引用，将等待垃圾回收。 效率比较： 效率测试代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<script>
    var a = [];
    var b = [];
    var c = [];
    for(var i =0 ; i < 100000000;i++){
        a.push(i);
    }
    console.time('splice');
    a.splice(0,a.length);
    console.timeEnd('splice');
    
    for(var i =0 ; i < 100000000;i++){
        b.push(i);
    }
    console.time('length');
    b.length = 0;
    console.timeEnd('length');
    
    for(var i =0 ; i < 100000000;i++){
        c.push(i);
    }
    console.time('赋值[]');
    c = [];
    console.timeEnd('赋值[]');
</script>

  测试结果： splice: 0.010986328125ms length: 0.009033203125ms 赋值[]: 0.024169921875ms 多次测试发现第二种方式最快，第一种其次，大数据量下 第三种最慢。 测试结果可能不严谨。大家仅做参考。   from:https://www.cnblogs.com/jichi/p/10516576.html

龙生   06 Mar 2020
View Details

Git删除本地和远程分支

1. 切换到要操作的项目文件夹命令行 cd ProjectPath   2.查看项目分支（包括本地和远程）命令行 git branch -a   3.删除本地分支 git branch -d 分支名   4.删除远程分支 git push origin --delete 分支名   5.查看删除后的分支 git branch -a   引用：https://blog.csdn.net/qq_32452623/article/details/54340749 from:https://blog.csdn.net/u011280600/article/details/80744818

龙生   06 Mar 2020
View Details

Lodash之throttle（节流）与debounce（防抖）总结

先重点说一下可能遇到的坑：主要在原本默认参数的设置以及两个方法的选择上，看完这篇总结你就知道怎么回事了~   throttle API走起 _.throttle(func, [wait=0], [options={}]) func (Function): 要节流的函数。 [wait=0] (number): 需要节流的毫秒数。 [options={}] (Object): 选项对象。 [options.leading=true] (boolean): 指定调用在节流开始前，默认true。 [options.trailing=true] (boolean): 指定调用在节流结束后，默认true。   throttle Demo走起（Vue写法）

1
2
3
4
5
6
testThrottle: _.throttle(function() {
  console.log("throttle");
}, 5000, {
  leading: true,
  trailing: false
})

testThrottle方法被绑定在一个按钮上，demo最终的效果是 ： 1、按钮点击后控制台立马打印了throttle——19:39:00； 2、5秒内点击多次按钮，最终只打印一次throttle——19:39:05前； 3、5秒后再点击一次，会重新打印throttle——19:39:05后； PS：lodash默认trailing为true，那么最终的效果是在点击时会立即打印throttle，且5秒后又会再打印一次，即节流之前和之后都会执行该节流函数。   throttle 总结走起 预先设定一个执行周期，当调用动作的时刻大于等于执行周期则执行该动作，然后进入下一个新的时间周期。 简言之：结束时间点不会随点击改变     debounce API走起 _.debounce(func, [wait=0], [options={}]) func (Function): 要防抖动的函数。 [wait=0] (number): 需要延迟的毫秒数。 [options={}] (Object): 选项对象。 [options.leading=false] (boolean): 指定在延迟开始前调用，默认false。 [options.maxWait] (number): 设置 func 允许被延迟的最大值。 [options.trailing=true] (boolean): 指定在延迟结束后调用，默认true。   debounce Demo走起

1
2
3
4
5
6
testDebounce: _.debounce(function() {
  console.log("debounce");
}, 2000, {
  leading: true,
  trailing: false
})

  testDebounce方法被绑定在一个按钮上，demo最终的效果是 ： 1、按钮点击后控制台立马打印了debounce——19:39:00； 2、5秒内点击多次按钮，最终只打印一次debounce——19:39:05前，假设19:39:04完成了最后一次点击； 3、相对于最后一次点击的5秒后再点击一次，会重新打印debounce——19:39:09后； PS：lodash默认leading为false、trailing为true，那么最终的效果是在点击后等待5秒才会打印debounce，即延迟之前不执行函数，而是在延迟之后执行。   debounce 总结走起 当调用动作触发一段时间后，才会执行该动作，若在这段时间间隔内又调用此动作则将重新计算时间间隔。 简言之：结束时间点会随点击改变     综上所述，适用情况如下： throttle （1）对于键盘事件，当用户键入非常频繁，但我们又必须要在一定时间（阀值）内执行处理函数的时候。例如：一些网页游戏的键盘事件。 （2）对于鼠标移动和窗口滚动，鼠标的移动和窗口的滚动会带来大量的事件，但是在一段时间内又必须看到页面的效果。例如：对于可以拖动的div，如果使用debounce，那么div会在拖动停止后突然跳到目标位置；这时就需要使用throttle。   debounce （1）对于键盘事件，当用户输入比较频繁的时候，可以通过debounce合并键盘事件处理。例如：需要在用户输入完成时进行字符串校验。 （2）对于ajax请求的情况。例如：当页面下拉超过一定范围就通过ajax请求新的页面内容，这时候可以通过debounce合并ajax请求事件。 from:https://www.cnblogs.com/dreamsqin/p/11305028.html

龙生   05 Mar 2020
View Details

vue使用lodash

一、安装

1
cnpm i lodash -S

  二、方法一 1、引入

1
2
import _ from 'lodash'
Vue.prototype._ = _

  2、使用

1
this._.debounce(this.handleClick,1000,false)

  二、方法二 1、引入

1
let _ = require('lodash')

  2、使用

1
_.debounce(this.handleClick,1000,false)

  三、vue单文件组件中使用 里面分别有我自己写的debounce函数和lodash的debounce函数，效果一样！

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<template>
  <div>
    <el-button @click="myDebounce">我的debounce</el-button>
    <el-button @click="_debounce">lodash的debounce</el-button>
  </div>
</template>
 
<script>
import { debounce } from '@/utils/util'
let _ = require('lodash')
export default {
  methods: {
    handleClick1() {
      console.log(`真正执行的函数，次数比较少：handleClick1.....`)
    },
    handleClick2() {
      console.log(`真正执行的函数，次数比较少：handleClick2.....`)
    },
    myDebounce() {
      console.log(`myDebounce.....`)
      this.DB()
    },
    _debounce() {
      console.log(`_debounce.....`)
       this._DB()
    }
  },
  created() {
    this.DB = debounce(this.handleClick1, 1000, false)
    this._DB = this._.debounce(this.handleClick2,1000,false)
  }
}
</script>

debounce测试.png 注意：以前我是在data选项里面定义DB:null，然后再methods里面初始化函数，但是需要判断‘如果有了就不赋函数，如果为空就赋’，发现比较麻烦；后来直接在created钩子里面定义，就很方便了！   作者：斐鸽传书 链接：https://www.jianshu.com/p/907e8a0ee5d7 来源：简书 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

龙生   05 Mar 2020
View Details

心得

前端多次调用接口，想显示最近一次的请求结果，最靠谱的做法是加个请求版本。前端维护，后端原封不动的返回。

龙生   05 Mar 2020
View Details

SecureCRT的文件上传技巧

现在我们经常会习惯性的使用windows系统，但现在开发项目和维护中经常都在使用linux服务器，以为它的性能更强、更精简。
学习大数据的同志们和维护后端的同志们，推荐一下secureCRT软件，用起来也很高大尚，以为都是用命令来操作。

龙生   04 Mar 2020
View Details

SecureCRT把本地电脑上的文件传输到Linux系统上

SecureCRT的下载地址(拿来可以直接用) 链接：https://pan.baidu.com/s/1cnopPF7f48mD1CYq6VPSuQ 密码：hjbo 首先我们先进去我们的Linu系统查看自己的ip地址如下:   我们第一次打开SecureCRT文件是这个样子 如下图: 注意:用户名不是随便填写的,需要跟你linux系统用户名一致,不然会连接不上 下面是在Linux系统下配置zookeeper  大家不感兴趣可以忽略 接下来Linux把这个压缩包解压: 运行如下 from:https://blog.csdn.net/qq_40646143/article/details/80904114

龙生   04 Mar 2020
View Details

mysql权限说明

Select_priv：用户可以通过SELECT命令选择数据。 Insert_priv：用户可以通过INSERT命令插入数据; Update_priv：用户可以通过UPDATE命令修改现有数据; Delete_priv：用户可以通过DELETE命令删除现有数据; Create_priv：用户可以创建新的数据库和表; Drop_priv：用户可以删除现有数据库和表; Reload_priv：用户可以执行刷新和重新加载MySQL所用各种内部缓存的特定命令,包括日志、权限、主机、查询和表;重新加载权限表; Shutdown_priv：用户可以关闭MySQL服务器;在将此权限提供给root账户之外的任何用户时,都应当非常谨慎; Process_priv：用户可以通过SHOW PROCESSLIST命令查看其他用户的进程;服务器管理; File_priv：用户可以执行SELECT INTO OUTFILE和LOAD DATA INFILE命令;加载服务器上的文件; Grant_priv：用户可以将已经授予给该用户自己的权限再授予其他用户(任何用户赋予全部已有权限); References_priv;目前只是某些未来功能的占位符；现在没有作用; Index_priv：用户可以创建和删除表索引;用索引查询表; Alter_priv：用户可以重命名和修改表结构; Show_db_priv：用户可以查看服务器上所有数据库的名字,包括用户拥有足够访问权限的数据库;可以考虑对所有用户禁用这个权限,除非有特别不可抗拒的原因; Super_priv：用户可以执行某些强大的管理功能,例如通过KILL命令删除用户进程,使用SET GLOBAL修改全局MySQL变量,执行关于复制和日志的各种命令;超级权限; Create_tmp_table_priv：用户可以创建临时表; Lock_tables_priv：用户可以使用LOCK TABLES命令阻止对表的访问/修改; Execute_priv：用户可以执行存储过程;此权限只在MySQL 5.0及更高版本中有意义; Repl_slave_priv：用户可以读取用于维护复制数据库环境的二进制日志文件;此用户位于主系统中,有利于主机和客户机之间的通信;主服务器管理; Repl_client_priv：用户可以确定复制从服务器和主服务器的位置;从服务器管理; Create_view_priv：用户可以创建视图;此权限只在MySQL 5.0及更高版本中有意义; Show_view_priv：用户可以查看视图或了解视图如何执行;此权限只在MySQL 5.0及更高版本中有意义; Create_routine_priv：用户可以更改或放弃存储过程和函数;此权限是在MySQL 5.0中引入的; Alter_routine_priv：用户可以修改或删除存储函数及函数;此权限是在MySQL 5.0中引入的; Create_user_priv：用户可以执行CREATE USER命令,这个命令用于创建新的MySQL账户; Event_priv：用户能否创建、修改和删除事件;这个权限是MySQL 5.1.6新增的; Trigger_priv：用户能否创建和删除触发器,这个权限是MySQL 5.1.6新增的; Create_tablespace_priv：创建表空间 ssl_type：支持ssl标准加密安全字段 ssl_cipher：支持ssl标准加密安全字段 x509_issuer：支持x509标准字段 x509_subject：支持x509标准字段 max_questions：0 每小时允许执行多少次查询 max_updates：0 每小时可以执行多少次更新  ：0表示无限制 max_connections：0 每小时可以建立的多少次连接：0表示无限制 max_user_connections：0 单用户可以同时具有的连接数：0表示无限制 plugin：5.5.7开始,mysql引入plugins以进行用户连接时的密码验证,plugin创建外部/代理用户 authentication_string：通过authentication_string可以控制两者的映射关系,(PAM plugin等,PAM可以支持多个服务名)尤其是在使用代理用户时，并须声明这一点 password_expired：密码过期 Y,说明该用户密码已过期 N相反   from:https://blog.csdn.net/jcmcom/article/details/86701048

龙生   04 Mar 2020
View Details

setTimeout在vue中的正确使用

笔者最近因为公司需求开发使用vue和jquery开发抓娃娃H5极简小游戏，使用到setTimeout函数。遇到了1个坑  

1
2
3
在vue的某个方法(点击后执行)
 
setTimeout(this.end(),4000);//娃娃消失

  这里奇怪的是,end方法的确被执行了。但是没有执行4s后执行的效果。那我要你合用呢！其实，问题还是出在笔者身上，大家请看下图 setTimeout的定义和用法。问题出在我的格式上面 其实是支持两种调用方式：1 字符 2 函数体（文章解决方式） 解决方法如下： 1、定义一个_this暂存this 2、再改变变量的值，则生效啦 3、方法中将this存在变量_this中，此时执行setTimeout函数时，setTimeout函数内的_this就会访问到这个变量，就会得到当前对象。

1
 

 

1
 

注意⚠️: 当在vue中使用定时器在function里直接使用this，发现没有效果，这是由于setTimeout函数调用的代码运行在与所在函数完全分离的执行环境上，这会使得this指向的是window对象。拓展知识：解决vue在setTimeout内修改this失效的问题 要想setTimeout指向正确的值，可以使用如下方法： 1、使用箭头函数

1
2
3
4
5
6
7
8
9
export default {
 methods: {
  start: function () {
   setTimeout(() => {
    this.end()//娃娃消失
   }, 4000);
  }
 }
}

此时函数的this指向的是定义它的时候的对象，也就是this指向了data内中对应的变量。 码字不易，对大家有用最佳 from:https://blog.csdn.net/qq_27295403/article/details/83375574

龙生   03 Mar 2020
View Details

http协议的Request Payload 和 Form Data 的区别

概述 我正在开发的项目前端和后端是完全独立的，通过配置 webpack 的 proxy 将前端请求跨域代理到后台服务。昨天发现，我前端执行 post 请求，后台 springmvc 的 @RequestMapping 接收不到对应的请求参数。开始我以为是我 proxy 配置有问题，导致 post 参数不能传到后台。然而，并不是这样… proxy 配置如下： 前端代码： java 后台代码： Request Payload VS Form Data 前端请求 我看了前端发起的请求，请求正文并不是我熟悉的 Form Data，而是 Request Payload。如图注意下面两个请求的 Content-Type 的区别。 Request Payload 请求 Form Data 请求 了解这两个的区别之前，我们先回顾下 HTTP 请求报文格式： Request Payload 大概格式如下，请求头部的 Content-Type: application/json，并且请求正文是一个 json 格式的字符串 Form Data 大概格式如下，请求头部的 Content-Type: application/x-www-form-urlencoded，并且请求正文是类似 get 请求 url 的请求参数 后台处理 对于 Request Payload 请求， 必须加 @RequestBody 才能将请求正文解析到对应的 bean 中，且只能通过 request.getReader() 来获取请求正文内容 对于 Form Data 请求，无需任何注解，springmvc 会自动使用 MessageConverter 将请求参数解析到对应的 bean，且通过 request.getParameter(…) 能获取请求参数   解决方案 综上，我在前端选择使用 Form Data 的方式来发起请求，使用 qs 库将 json 对象转化为字符串 (如 {name:’dahuang',age: 11} 转化为 name=dahuang&age=11)。 之前我以为 axios 会自动根据你的请求正文格式来选择发起 Form Data 还是 Request Payload 请求，但是执行 delete 操作时，如图的 Content-Type 却是 text/plain […]

龙生   03 Mar 2020
View Details
1 … 133 134 135 … 414

Copyright © 2025 Longsheng All rights reserved