编辑代码

// <!DOCTYPE html>
// <html>
// 	<head>
// 		<meta charset="utf-8">
// 		<title>test</title>
// 		<style>
// 			#list{
// 				width: 80%;
// 				height: 150px;
// 				overflow: auto;
// 				box-shadow: 0 0 5px #ccc;
// 			}
// 			#box{
// 				padding: 30px;
// 			}
// 			li{
// 				list-style: none;
// 				float: left;
// 				border: 1px solid #ccc;
// 				margin-left: 4px;
// 				padding: 4px;
// 				margin-bottom: 2px;
// 			}
// 		</style>
// 	</head>
// 	<body>
// 		<div class="test">welcome hello wolrd</div>
// 		<ul id="list"></ul>
// 		<ul id="box"></ul>
// 	</body>
	// <script type="text/javascript">
		// 小数四舍五入
		const round = (n, decimals = 0) => Number(`${Math.round(`${n}e${decimals}`)}e-${decimals}`);
		const sleep = ms => new Promise(resolve => setTimeout(resolve, ms));
		const yesterday = () => {
		  let d = new Date();
		  d.setDate(d.getDate() - 1);
		  return d.toISOString().split('T')[0];
		}
		var txtplace = (str, _str) => str.replace(/\$/g, _str);
		console.log(txtplace('nihao $ hah', 'replace'))
		// const toFixed = (n, fixed) => ~~(Math.pow(10, fixed) * n)/Math.pow(10, fixed);
		console.log(round(2.116, 2))
		var elem = document.querySelector('.test')
		var h = getComputedStyle(elem,null).getPropertyValue('height')
		console.log(h)
		// documentFragment
		// const list = document.querySelector('#list');
		// const fruits = ['Apple', 'Orange', 'Banana', 'Melon'];

		// const fragment = document.createDocumentFragment();

		// fruits.forEach(fruit => {
		// 	const li = document.createElement('li');
		// 	li.innerHTML = fruit;
		// 	fragment.appendChild(li);
		// });

		// list.appendChild(fragment);
		let t = null
		clearTimeout(t)
		t = setTimeout(e => {}, 10)
		function Foo(){
    // 有趣的js
		getName= function(){console.log(1);};

		return this;

		}

		Foo.getName = function(){console.log(2);};

		Foo.prototype.getName = function(){console.log(3);};

		var getName = function(){console.log(4);}; // 最后

		function getName(){console.log(5);} // 提升最前面

		//请写出以下输出结果:

		Foo.getName();

		getName();

		Foo().getName();

		getName();

		new Foo.getName();

		new Foo().getName();

		new new Foo().getName();
	// </script>
	// <script type="text/javascript">
	  const list = document.querySelector('#list');
		const fruits = ['Apple', 'Orange', 'Banana', 'Melon', 'bear', 'fish', 'cat', 'dog', 'monkey'];

		const fragment = document.createDocumentFragment();

		fruits.forEach(fruit => {
			const li = document.createElement('li');
			li.innerHTML = fruit;
			fragment.appendChild(li);
		});

		list.appendChild(fragment);
		list.onmousewheel = function(e) {
			console.log(e.wheelDelta, e.detail)
			const tag = document.createElement('li');
		  tag.textContent = 'bababnan'
			if (e.wheelDelta < 0) {
				list.appendChild(tag);
			}
		}
		function filterJs(cb, context) {
			if (typeof cb !== 'function') {
				throw new TypeError(`${cb} is not a function`)
			}
			const arr = this
			const temp = []
			for(let i=0;i<arr.length;i++){
				let res = fn.call(context, arr[i], i, arr)
				if (res) temp.push(arr[i]) 
			}
			return temp
		}
	// </script>
	// <script>
		const box = document.getElementById('box');
		const fragment1 = document.createDocumentFragment();
		function sp() {
			let sum = 0;
			box.innerHTML = ''
			for(let i=0;i<1000;i++){
				const lis = document.createElement('li');
				const val = parseFloat(1 * Math.random()).toFixed(2)
				lis.textContent = val;
				if (val >= 0.5) {
					lis.style.color = 'red'
					sum += 1
				}
				fragment.appendChild(lis);
			}
			console.log(sum)
			box.appendChild(fragment)
			this.id = window.requestAnimationFrame(sp)
			window.cancelAnimationFrame(this.id)
		}
		sp()
		for(let i=0;i<1000;i++){
		}
		function dg(n) { // 阶乘
			if (!n || n <= 1) return n
			let sum = 1
			for (let i=1;i<=n;i++){
				sum *= i
			}
			return sum
		}
		// 数列
		function shulie(a) {
			if (a <= 2) { // 临界值设置
				return 1;
			} else {
				return shulie(a - 1) + shulie(a - 2); // 调用自身
			}
		}
		function SL(n) { // 裴波数列
			let [a, b] = [1, 1]
			let sum = 0
			for (let i=2;i<n;i++) {
			  sum = a + b
        a = b
				b = sum
				console.log('index: '+i, a, b)
			}
			return sum
		}
		function numberTwoSum(){ // 假设n 从给定数组找到两个加起来等于n的元素
			const targetArr = [1,2,3,4,5,6,12]
			const target = 24
			for (let i=0;i<targetArr.length;i++) {
				let cur = targetArr[i]
				let y = target - cur
				if (y !== cur && targetArr.includes(y)) return [i, targetArr.indexOf(y)]
			}
			return null
		}
		function countChar() {
			const str = 'abasbasbababababababuauhaha'
			if (str.length<=1) return 1
			const obj = {}
			let max = 0
			let aStr = ''
			for (let i=0;i<str.length;i++){
				const prop = str.charAt(i)
				if (!obj[prop]) {
					obj[prop] = 1
				} else {
				  obj[prop] += 1
				}
			}
			Object.keys(obj).forEach(k => {
				if (obj[k] > max) {
					max = obj[k]
					aStr = k
				}
			})
			console.log(max, aStr)
		}
		function swap(a , b) {  
			b = b - a;
			a = a + b;
			b = a - b;
			return [a,b];
		}
		function swap1() {
			let [a, b] = [2, 3]
			a = a ^ b; // 计算结果:a = 0011, b = 0010
			b = a ^ b; // 计算结果:a = 0011, b = 0001
			a = a ^ b; // 计算结果:a = 0010, b = 0001
			console.log(a, b)
		}
		function swap2() {
			let a = 2, b =3;
			[b, a] = [a, b]
			console.log(a, b)
		}
		// var a = 1, 利用数组
    // b = 2;

		// a = [a, b];
		// b = a[0];
		// a = a[1];
		// 找出给定正数组的最大差值
		function numberTwoVal() {
			const a = [1,2,3,32,31,231,33]
			// const max = Math.max.apply(null, a)
			// const min = Math.min.apply(null, a)
			const max = Math.max(...a)
			const min = Math.min(...a)
			console.log(max-min)
		}
		function randomString() {
			let str = 'abcdefghijklmnopqrstuvwxyz9876543210';
			const n = 18
			let temp = ''
			for(var i = 0; i < n; i++) {
				const pos = Math.floor(Math.random() * str.length)
				temp += str.charAt(pos)
			}
			console.log(temp)
		}
		function createUid() {
			return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxx'.replace(/[xy]/g, c => {
				let r = Math.random() * 16 | 0;
				let v = c === 'x' ? r : (r & 0x3 | 0x8)
				return v.toString(16)
			})
		}
		console.log(createUid())
// 	</script>
// </html>