JS常用函数和常用技巧小结_javascript技巧

学习和工作的过程中总结的干货，包括常用函数、常用js技巧、常用正则表达式、git笔记等。为刚接触前端的童鞋们提供一个简单的查询的途径，也以此来缅怀我的前端学习之路。

Ajax请求

jquery ajax函数

我自己封装了一个ajax的函数，代码如下：

var Ajax = function(url, type success, error) {
$.ajax({
url: url,
type: type,
dataType: 'json',
timeout: 10000,
success: function(d) {
var data = d.data;
success && success(data);
},
error: function(e) {
error && error(e);
}
});
};
// 使用方法：
Ajax('/data.json', 'get', function(data) {
console.log(data);
});

jsonp方式

有时候我们为了跨域，要使用jsonp的方法，我也封装了一个函数：

function jsonp(config) {
var options = config || {}; // 需要配置url, success, time, fail四个属性
var callbackName = ('jsonp_' + Math.random()).replace(".", "");
var oHead = document.getElementsByTagName('head')[0];
var oScript = document.createElement('script');
oHead.appendChild(oScript);
window[callbackName] = function(json) { //创建jsonp回调函数
oHead.removeChild(oScript);
clearTimeout(oScript.timer);
window[callbackName] = null;
options.success && options.success(json); //先删除script标签，实际上执行的是success函数
};
oScript.src = options.url + '?' + callbackName; //发送请求
if (options.time) { //设置超时处理
oScript.timer = setTimeout(function () {
window[callbackName] = null;
oHead.removeChild(oScript);
options.fail && options.fail({ message: "超时" });
}, options.time);
}
};
// 使用方法：
jsonp({
url: '/b.com/b.json',
success: function(d){
//数据处理
},
time: 5000,
fail: function(){
//错误处理
}
});

常用正则验证表达式

手机号验证

var validate = function(num) {
var exp = /^1[3-9]\d{9}$/;
return exp.test(num);
};

身份证号验证

var exp = /^[1-9]{1}[0-9]{14}$|^[1-9]{1}[0-9]{16}([0-9]|[xX])$/;

ip验证

var exp = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;

常用js函数

$(window).scroll(function() {
var a = $(window).scrollTop();
if(a > 100) {
$('.go-top').fadeIn();
}else {
$('.go-top').fadeOut();
}
});
$(".go-top").click(function(){
$("html,body").animate({scrollTop:"0px"},'600');
});

阻止冒泡

function stopBubble(e){
e = e || window.event;
if(e.stopPropagation){
e.stopPropagation(); //W3C阻止冒泡方法
}else {
e.cancelBubble = true; //IE阻止冒泡方法
}
}

全部替换replaceAll

var replaceAll = function(bigStr, str1, str2) { //把bigStr中的所有str1替换为str2
var reg = new RegExp(str1, 'gm');
return bigStr.replace(reg, str2);
}

获取浏览器url中的参数值

var getURLParam = function(name) {
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)', "ig").exec(location.search) || [, ""])[1].replace(/\+/g, '%20')) || null;
};

深度拷贝对象

function cloneObj(obj) {
var o = obj.constructor == Object ? new obj.constructor() : new obj.constructor(obj.valueOf());
for(var key in obj){
if(o[key] != obj[key] ){
if(typeof(obj[key]) == 'object' ){
o[key] = mods.cloneObj(obj[key]);
}else{
o[key] = obj[key];
}
}
}
return o;
}

数组去重

var unique = function(arr) {
var result = [], json = {};
for (var i = 0, len = arr.length; i < len; i++){
if (!json[arr[i]]) {
json[arr[i]] = 1;
result.push(arr[i]); //返回没被删除的元素
}
}
return result;
};

判断数组元素是否重复

var isRepeat = function(arr) { //arr是否有重复元素
var hash = {};
for (var i in arr) {
if (hash[arr[i]]) return true;
hash[arr[i]] = true;
}
return false;
};

生成随机数

function randombetween(min, max){
return min + (Math.random() * (max-min +1));
}

操作cookie

own.setCookie = function(cname, cvalue, exdays){
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = 'expires='+d.toUTCString();
document.cookie = cname + '=' + cvalue + '; ' + expires;
};
own.getCookie = function(cname) {
var name = cname + '=';
var ca = document.cookie.split(';');
for(var i=0; i< ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') c = c.substring(1);
if (c.indexOf(name) != -1) return c.substring(name.length, c.length);
}
return '';
};

知识技巧总结

数据类型

underfined、null、0、false、NaN、空字符串。他们的逻辑非结果均为true。

闭包格式

好处：避免命名冲突（全局变量污染）。

(function(a, b) {
console.log(a+b); //30
})(10, 20);

截取和清空数组

var arr = [12, 222, 44, 88];
arr.length = 2; //截取，arr = [12, 222];
arr.length = 0; //清空，arr will be equal to [].

获取数组的最大最小值

var numbers = [5, 45822, 120, -215];
var maxInNumbers = Math.max.apply(Math, numbers); //45822
var minInNumbers = Math.min.apply(Math, numbers); //-215

浮点数计算问题

0.1 + 0.2 == 0.3 //false

为什么呢？因为0.1+0.2等于0.30000000000000004。JavaScript的数字都遵循IEEE 754标准构建，在内部都是64位浮点小数表示。可以通过使用toFixed()来解决这个问题。

数组排序sort函数

var arr = [1, 5, 6, 3]; //数字数组
arr.sort(function(a, b) {
return a - b; //从小到大排
return b - a; //从大到小排
return Math.random() - 0.5; //数组洗牌
});
var arr = [{ //对象数组
num: 1,
text: 'num1'
}, {
num: 5,
text: 'num2'
}, {
num: 6,
text: 'num3'
}, {
num: 3,
text: 'num4'
}];
arr.sort(function(a, b) {
return a.num - b.num; //从小到大排
return b.num - a.num; //从大到小排
});

对象和字符串的转换

var obj = {a: 'aaa', b: 'bbb'};
var objStr = JSON.stringify(obj); // "{"a":"aaa","b":"bbb"}"
var newObj = JSON.parse(objStr); // {a: "aaa", b: "bbb"}

git笔记

git使用之前的配置

1.git config --global user.email xxx@163.com

2.git config --global user.name xxx

3.ssh-keygen -t rsa -C xxx@163.com(邮箱地址) // 生成ssh

4.找到.ssh文件夹打开，使用cat id_rsa.pub //打开公钥ssh串

5.登陆github，settings － SSH keys － add ssh keys （把上面的内容全部添加进去即可）

说明：然后这个邮箱（xxxxx@gmail.com）对应的账号在github上就有权限对仓库进行操作了。可以尽情的进行下面的git命令了。

git常用命令

1、git config user.name / user.email //查看当前git的用户名称、邮箱

2、git clone https://github.com/jarson7426/javascript.git project //clone仓库到本地。

3、修改本地代码，提交到分支: git add file / git commit -m “新增文件”

4、把本地库推送到远程库: git push origin master

5、查看提交日志：git log -5

6、返回某一个版本：git reset --hard 123

7、分支：git branch / git checkout name / git checkout -b dev

8、合并name分支到当前分支：git merge name / git pull origin

9、删除本地分支：git branch -D name

10、删除远程分支： git push origin :daily/x.x.x

11、git checkout -b mydev origin/daily/1.0.0 //把远程daily分支映射到本地mydev分支进行开发
12、合并远程分支到当前分支 git pull origin daily/1.1.1

13、发布到线上：

git tag publish/0.1.5
git push origin publish/0.1.5:publish/0.1.5

14、线上代码覆盖到本地：

git checkout --theirs build/scripts/ddos
git checkout --theirs src/app/ddos

以上所述是小编给大家介绍的JS常用函数和常用技巧小结，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的，在此也非常感谢大家对网站的支持！

以上是小编为您精心准备的的内容，在的博客、问答、公众号、人物、课程等栏目也有的相关内容，欢迎继续使用右上角搜索按钮进行搜索js
javascript常用函数、javascript常用函数库、常用函数公式及技巧、excel常用函数技巧、javascript课程小结，以便于您获取更多的相关知识。

时间： 2024-02-19 09:35:56

JS常用函数和常用技巧小结_javascript技巧的相关文章

JS匿名函数类生成方式实例分析_javascript技巧

本文实例讲述了JS匿名函数类生成方式.分享给大家供大家参考,具体如下: <script type="text/javascript"> var Book = (function() { // 私有静态属性 var numOfBooks = 0; // 私有静态方法 function checkIsbn(isbn) { if(isbn == undefined || typeof isbn != 'string') { return false; } return true;

js实现创建删除html元素小结_javascript技巧

如果我要创建一个div元素. 1.使用DOM对象创建: 使用document.createElement('div')方法创建元素.  2.使用JQuery创建: 使用$('<div>通过JQuery创建的新元素</div>')的方法直接创建元素. 如果需要将id是'div2js'的div元素删除. 1.使用DOM对象 首先需要找到被删元素的父元素,通过父元素将其需要删除的子元素删除. var el = document.getElementById('div2js'); el.p

js获取IP地址的方法小结_javascript技巧

1,js取得IP地址的方法一 <script src="http://pv.sohu.com/cityjson?ie=utf-8"></script> <script type="text/<A class=infotextkey href="http://www.jb51.net/" target=_blank>javascript</A>"> document.write(retur

不同js异步函数同步的实现方法_javascript技巧

不同函数达到同步的函数模拟 funcList是函数执行函数的队列,其中回调函数中flag=true是同步标记量 <script> var flag = false; function funcTest(t,func){ setTimeout(function(){ (function(param){ console.log(param); func(); }(t)); },t*1000); } var funcList = []; funcList.push(function(){funcTe

用javascript关闭本窗口技巧小结_javascript技巧

大家都知道window.close()是用来关闭窗口的,而且ie和firefox都是支持的. 为了实现用户对浏览器的绝对控制,ie中用close关闭非open打开的窗口时回弹出一个对话框询问用户,怎么去掉这个框呢,请看下面的代码. function winClose(){ window.top.opener = null; window.close(); } 在window.close之前加上window.top.opener = null就可以了. 有人说firefox不支持close,其实这

js 变量类型转换常用函数与代码[比较全]_javascript技巧

1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把值转换成浮点数.只有对String类型调用这些方法,这两个函数才能正确运行:对其他类型返回的都是NaN(Not a Number). 在判断字符串是否是数字值前,parseInt()和parseFloat()都会仔细分析该字符串.parseInt()方法首先查看位置0处的 字符,判断它是否是个有效数字:如果不是,该方法将返回NaN,不再继续执行其他操作.但如果该字符是有效数字,该方法

最常用的12种设计模式小结_javascript技巧

1.策略模式(Strategy): 定义了算法家族, 分别封装起来, 让它们之间可以互相替换. 比如Collections.sort(List list, Comparator c); 可以通过实现多个Comparator接口来达到多种排序的目的. 2.装饰着模式(Decorator): 动态的给一个对象添加一些额外的职责. 比如java.io包. BufferedInputStream封装了FileInputStream, 它们都实现了InputStream接口, 但前者实现了readLine

JS随机打乱数组的方法小结_javascript技巧

本文实例总结了JS随机打乱数组的方法.分享给大家供大家参考,具体如下: JS中,要打乱数组有很多方法,网上流传一个国外人写的方法,我认为是最精简的了: function randomsort(a, b) { return Math.random()>.5 ? -1 : 1; //用Math.random()函数生成0~1之间的随机数与0.5比较,返回-1或1 } var arr = [1, 2, 3, 4, 5]; arr.sort(randomsort); 这里介绍下sort()函数,在JS中

Javascript获取当前时间函数和时间操作小结_javascript技巧

在项目需要一个计时器,效果如下: js代码: 复制代码 代码如下:     /*获取当前时间*/     function getCurrentDate()     {       var timeStr = '';       var curDate = new Date();       var curMonth = curDate.getMonth()+1;  //获取当前月份(0-11,0代表1月)       var curDay = curDate.getDate();