常用代码片段/方法库【持续更新】

code-labrary

存放常用的代码片段，随拿随用
Github地址

SASS

⬆ 返回顶部

多行文本超出打点

// 多行文本超出打点, 参数为行数
@mixin textOver($num) {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: $num; //行数
	-webkit-box-orient: vertical;
}

绝对定位水平居中

// 绝对定位 水平居中 参数为高度
@mixin absHorizontalCenter($top) {
	position: absolute;
	top: $top;
	left: 50%;
	transform: translateX(-50%);
}

文本水平垂直居中

// 文本水平垂直居中 参数为高度
@mixin textCenter($height) {
	height: $height;
	line-height: $height;
	text-align: center;
}

png小图标赋色

// png小图标赋色 参数依次为:图标地址,颜色,宽度,高度
@mixin changePngColor($url,$color,$width,$height) {
	height: $height;
	width: $width;
	overflow: hidden;
	display: inline-block;
	&:before {
		content: '';
		background: url($url) no-repeat;
		display: block;
		background-size:$width $height;
		height: $height;
		width: $width;
		position: relative;
		left: -$width;
		border-right: $width solid transparent;
		filter: drop-shadow($color $width 0px);
	}
}

// 示例
.icon {
	@include changePngColor('./icon.png',red,25px,25px);
}

JS

⬆ 返回顶部

数值与二进制字符串转换

// 根据数字获得二进制字符串
function getBitByNum(num) { 
    let str = '';
    while(num) {
        str = num % 2 + str;
        num = parseInt(num / 2);
    }
    return str;
}

// 根据二进制字符串获取数字
function getNumByBit(bit) {
    let len = bit.length;
    let num = 0;
    while(--len >= 0) {
        num += Number(bit[len]) * Math.pow(2,bit.length - 1 - len);
    }
    return num;
}

数据处理

// 将对象的表达式属性转换为实际对象 `a.b.c => {a:{b:c}}`， 注意返回对象为浅克隆
function parseObj(obj) {
 if(typeof obj !== 'object') return obj;

 let result = {};
 if(Array.isArray(obj)) {
   result = [];
   obj.forEach((ele,index) => {
     result[index] = parseObj(ele);
   })
   return result;
 }
 for (let prop in obj) {
   if (typeof obj[prop] == 'object') {
     result[prop] = parseObj(obj[prop]);
   } else {
     let arr = prop.split('.');
     if (arr.length > 1) {
       let pointer = result;
       while (arr.length > 1) {
         pointer[arr[0]] = pointer[arr[0]] || {};
         pointer = pointer[arr[0]];
         arr.shift();
       }
       pointer[arr[0]] = obj[prop];
     } else {
       result[prop] = result[prop] ? Object.assign(result[prop], obj[prop]) : obj[prop];
     }
   }
 }
 return result;
}

parseObj({
  data: [1,2,3,4],
  'title.text': 3,
  'title.position':4,
  'title.subTitle.text': 5,
}); 

// 输出
{data: [1, 2, 3, 4],
  title: {
    text: '标题',
    position: 'left',
    subTitle: {
      text: '副标题'
    }}}

cookie

// 设置cookie值
function setCookie(cname, cvalue, exdays) {
	var d = new Date();
	d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
	var expires = "expires=" + d.toGMTString();
	document.cookie = cname + "=" + cvalue + "; " + expires;
}

// 获取cookie值
function getCookie(cname) {
	
	var name = cname + "=";
	var ca = document.cookie.split(';');
	for (var i = 0; i < ca.length; i++) {
		var c = ca[i].trim();
		if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
	}
	return "";
}

// 检测cookie值
function checkCookie() {
	var username = getCookie("username");
	if (username != "") {
		alert("Welcome again " + username);
	} else {
		username = prompt("Please enter your name:", "");
		if (username != "" && username != null) {
			setCookie("username", username, 365);
		}
	}
}

ip排序

// ip排序
function ipsSort(ips) {
	// ips =  ["10.10.15.130", "10.10.16.40", "127.0.0.1", "192.168.1.123", "192.168.1.38", "192.168.1.39"];
	// 升序
	ips.sort(function(a, b) {
		a = a.trim(); // 空格会影响排序
		b = b.trim();
		var arr1 = a.split('.')
		var arr2 = b.split('.')
		for (var i = 0; i < 4; i++) {
			if (arr1[i] > arr2[i]) {
				return 1
			} else if (arr1[i] < arr2[i]) {
				return -1
			}
		}
	})
	return ips
}

获取浏览器信息

// 获取浏览器信息
function getBrowserInfo() {
	var inBrowser = typeof window !== 'undefined';
	var inWeex = typeof WXEnvironment !== 'undefined' && !!WXEnvironment.platform;
	var weexPlatform = inWeex && WXEnvironment.platform.toLowerCase();
	var UA = inBrowser && window.navigator.userAgent.toLowerCase();
	var isIE = UA && /msie|trident/.test(UA);
	var isIE9 = UA && UA.indexOf('msie 9.0') > 0;
	var isEdge = UA && UA.indexOf('edge/') > 0;
	var isAndroid = (UA && UA.indexOf('android') > 0) || (weexPlatform === 'android');
	var isIOS = (UA && /iphone|ipad|ipod|ios/.test(UA)) || (weexPlatform === 'ios');
	var isChrome = UA && /chrome\/\d+/.test(UA) && !isEdge;
	var isPhantomJS = UA && /phantomjs/.test(UA);
	var isFF = UA && UA.match(/firefox\/(\d+)/);
	return {
		inBrowser,
		inWeex,
		weexPlatform,
		UA,
		isIE,
		isIE9,
		isEdge,
		isAndroid,
		isIOS,
		isChrome,
		isPhantomJS,
		isFF
	}
}

生成范围内随机数

// 生成范围内的随机数
function getRandom(left, right) {
	if (right < left) return 0;
	if (left >= 0) {
		return Math.random() * (right - left) + left;
	}
}

获取图片原始宽高

// 获取图片原始宽高
function loadImageAsync(url) {
	return new Promise(function(resolve, reject) {
		var image = new Image();

		image.onload = function() {
			var obj = {
				w: image.naturalWidth,
				h: image.naturalHeight
			}
			resolve(obj);
		};

		image.onerror = function() {
			reject(new Error('Could not load image at ' + url));
		};
		image.src = url;
	});
}

数字前补零

/*
*功能: {在数字前以0补全指定位数}	
*输入: {number}    (原数据,指定位数)
*输出: {string}	"04"
*/
function supNumber(num, x) {
	if ((num + "").length < x) {
		return "0" + num;
	} else {
		return num
	}
}

复制到剪贴板

function copyToClipboard(text) {
    var input = document.createElement('input');
    input.setAttribute('readonly', 'readonly');
    input.setAttribute('value', text);
    document.body.appendChild(input);
    input.select();
    input.setSelectionRange(0, 9999);
    let result = document.execCommand('Copy');
    input.remove();
    return result;
}

下载文件

function downloadFile(name, url) {
    let arr = url.split('.');
    var a = document.createElement("a");
    a.download = (name || arr[0]) + '.' + arr[arr.length - 1];
    a.href = url;
    document.body.appendChild(a); // 修复firefox中无法触发click
    a.click();
    a.remove();
}

NodeJS

⬆ 返回顶部

遍历文件夹

const path = require('path')
const fs = require('fs')

const basePath = 'D:/work/ruite/src/views/print/report' // 目标目录

function mapDir(dir, callback, finish) {
  fs.readdir(dir, function(err, files) {
    if (err) {
      console.error(err)
      return
    }
    files.forEach((filename, index) => {
      let pathname = path.join(dir, filename)
      fs.stat(pathname, (err, stats) => { // 读取文件信息
        if (err) {
          console.log('获取文件stats失败')
          return
        }
        if (stats.isDirectory()) {
          mapDir(pathname, callback, finish)
        } else if (stats.isFile()) {
          if (['.json', '.less'].includes(path.extname(pathname))) {  // 排除 目录下的 json less 文件
            return
          }
          callback && callback(filename)

          // 读取文件内容
          // fs.readFile(pathname, (err, data) => {
          //   if (err) {
          //     console.error(err)
          //     return
          //   }
          //   callback && callback(data)
          // })
        }
      })
      if (index === files.length - 1) {
        finish && finish()
      }
    })
  })
}

mapDir(
  basePath,
  function(file) {
    console.log(file.split('.')[0])
    // 读取文件后的处理
  },
  function() {
    // console.log('xxx文件目录遍历完了')
  }
)