分类学习下的文章 - 浮川的小窝

2023-10-18

上古技术也还是很能打的闲来无事搭了个门户网站的demo架子因为seo的缘故不能使用框架(因为追求简单的几个业务面感觉搭个架子太沉了) 所以用了挺老的技术 :@(害羞) :@(害羞) :@(害羞)gulp + art-template + web-template + js原生感觉比较符合我的需求因为咩去找现成的门户网站参照做案例就随便写写画画封装了一些基础组件(我肖某人今生最爱的事情之一就是封装封装封装组件!!)下面偷懒做的适配(就根本没做骗谁呢? :@(中指):@(中指):@(中指) )移动端兼容我贼垃圾就没做过阵子好好学学 :@(脸红) :@(脸红) .box{ position: relative; overflow: auto; margin-bottom: 30px; } .box > div{ background: url(https://snowlove.synology.me:5106/usr/uploads/2023/10/2416764179.jpg); width: 768px; height: 1024px; background-size: cover; background-repeat: no-repeat; position: relative; z-index: 1; } .box > iframe{ position: absolute; top: 210px; left: 185px; z-index: 2; border-radius: 16px; } @media screen and (max-width: 1000px) { .box{ position: relative; overflow: hidden; margin-bottom: 30px; } .box > div{ background: url(https://snowlove.synology.me:5106/usr/uploads/2023/10/2416764179.jpg); width: 85vw; height: 50vh; transform: scale3d(1.6, 1.3, 1.8); background-size: 100% 100%; background-repeat: no-repeat; position: relative; z-index: 1; top: -5vw; } .box > iframe{ position: absolute; top: 6vw; left: 5vw; z-index: 2; border-radius: 16px; width: 75vw; } } let Agents = ['Android', 'iPhone', 'SymbianOS', 'Windows Phone', 'iPad', 'iPod']; let getArr = Agents.filter(i => window.navigator.userAgent.includes(i)) let iframe = document.querySelector('.box>iframe') if(getArr[0]){ iframe.style.height = `$px` } iframe.onload = function(){ //iframe加载完立即发送一条消息 iframe.contentWindow.postMessage(,'*'); }

2023年10月18日
15
0
0

2023-10-17

2023年10月17日
68
0
0

2023-09-21

子网掩码作用及其使用作用子网掩码不能单独存在，它必须结合IP地址一起使用。IP地址我们都知道是计算机在网络内的唯一标识，而子网掩码顾名思义是用于划分子网的子网掩码只有一个作用，就是将某个IP地址划分成网络地址和主机地址两部分。子网掩码是一个32位地址，用于屏蔽IP地址的一部分以区别网络标识和主机标识，并说明该IP地址是在局域网上，还是在远程网上。例子1、255.255.255.0子网掩码由连续的1和0组成，连续的1表示网络地址，连续的0表示主机地址，通过0的个数可以计算出子网的容量（子网中主机的IP地址范围）。首先来看看默认的子网掩码255.255.255.0是怎么划分子网的，将该子网掩码的二进制由24个1和8个0组成，8个0表示该子网掩码划分出的子网容量为256（2的8次方），也就是说192.168.1.0-255都在同一个子网中，这256个地址中可用地址只有254个，因为规定每个子网的第一个IP地址为网段地址，最后一个IP地址为广播地址，都不可用。举例说明：对于网段192.168.1.0，如果子网掩码设置255.255.255.0，192.168.1.1-192.168.1.254为可用IP地址，设置这个范围内的IP地址，计算机之间能正常联网。2、255.255.255.252当然上面是默认的情况，也是最简单的情况。下面我们分析子网掩码255.255.255.252是怎么划分子网的。将该子网掩码转换成二进制为30个1和2个0，表示每个子网中只有4个IP地址（2的2次方），192.168.1.0-255的地址段共可划分64个子网，第一个子网的地址范围是192.168.1.0-192.168.1.3，第二个子网的地址范围是192.168.1.4-192.168.1.7，依次类推。其中每个子网第一个和最后一个IP地址不可用，可用的只有2个IP地址。也就是说：如果子网掩码设置为255.255.255.252，那么该子网只能容纳两台电脑，而且这两台电脑的IP必须在一个子网内才能正常联网，例如一台电脑的IP设为192.168.1.10，另外一台电脑的IP必须设置为192.168.1.9。子网划分实战通过以上两个例子读者应该明白子网掩码的作用了，下面通过一个实际的例子检验刚才的学习成果。某个小型公司有四个部门：行政、研发、营销、售后，每个部门各40台计算机接入公司局域网交换机，如果要在192.168.1.0网段为每个部门划分子网，子网掩码应该怎么设置，每个子网的地址范围分别是什么？192.168.1.0网段共256个地址，划分4个子网，每个子网需要64个地址；64是2的6次方，子网掩码应该以6个0结尾，剩下的用1补齐，由26个1和6个0组成，转换成十进制是255.255.255.192；每个子网共64个IP地址，掐头去尾后可用地址只有62个，第1个子网的可用IP地址范围是：192.168.1.1-62，第2个子网可用IP地址范围是192.168.1.65-126，第3个子网的可用IP地址范围是：192.168.1.129-190，第4个子网可用IP地址范围是192.168.1.193-254；该公司各部门计算机按照3中的IP地址范围进行设置，所有计算机的子网掩码都必须设置为255.255.255.192，设置完毕后各部门内的计算机能正常联网，不同部门间的计算机无法直接联通。划分数量: function returnArr(lastSubStr) { return `$,${lastSubStr .slice(4) .join('')}` } function subnet(subnetMask = 0) { if (subnetMask === 0) return `255.255.255.0` const section = parseInt(256 / subnetMask) const oneSubNum = Math.log2(section) if (Number.isInteger(oneSubNum)) { let lastSubStr = new Array(8).fill(1) lastSubStr.splice(8 - oneSubNum, 8, ...new Array(oneSubNum).fill(0)) const lastSub = returnArr(lastSubStr) let decimalism = 0 for (let i = 8; i--; i > 0) { if (i >= oneSubNum) decimalism += Math.pow(2, i) else break } return `子网掩码最后一段二进制:(${returnArr( new Array(8).fill(1), )}) . ($) . (${returnArr( new Array(8).fill(1), )}) . ($)\n此ip会分为$段:\n开头的ip为xxx.xxx.xxx.1-${ section - 2 }\n最后的ip为xxx.xxx.xxx.${ 256 - section }-254\n您最终的子网掩码:255.255.255.$ ` } else alert('您填入的分区数并不是2的次方数') } window.onload = () => { const subEle = document.getElementById('sub-show') document.getElementById('sub-num').onchange = (e) => { console.log(e.target.value) const value = e.target.value Number.isInteger(+value) ? (subEle.innerHTML = subnet(+value)) : alert('请输入整数') } } 文章来源，感谢原作者的无私分享:https://zhuanlan.zhihu.com/p/371400090

2023年09月21日
16
0
0

2023-09-21

javascript位运算&、|、~、^、>>的应用及原码、反码、补码的理解 | 位或运算符：这个运算符用于对两个二进制数字的对应位执行或操作，只要两个数字的对应位中至少有一个是 1，结果位就是 1。const a = 5; // 二进制: 101 const b = 3; // 二进制: 011 const result = a | b; // 位或操作 console.log(result); // 输出: 7 (二进制: 111) 按位或 | ，对二进制的每一个比特位进行或操作如果是0和1会返回1，0和0会返回0 举个例子　当我们计算 2 | 4 的时候。里面的原理是先将2转为二进制之后把4也转为二进制进行比较我们可以通过toString进行转换　2 === 0010　4 === 0100　结果是：0110 将结果转为10进制返回的是6 那么也就是说 2 | 4 会返回6 应用场景　当我们进行取整的时候可以使用比如 1.2 | 0 返回1 ，2.2 | 0会返回2& 位与运算符：这个运算符用于对两个二进制数字的对应位执行与操作，只有在两个数字的对应位都是 1 时，结果位才是 1，否则为 0。const a = 5; // 二进制: 101 const b = 3; // 二进制: 011 const result = a & b; // 位与操作 console.log(result); // 输出: 1 (二进制: 001) 按位与 & ，对二进制的每一个比特位进行与操作如果是0和1会返回0，0和0会返回0，只有是1和1的时候才会返回1 举个例子　比如一个系统的权限是 1 2 4 8 分别对应的 0001 0010 0100 1000 那么 A用户权限是 1|2|4|8 = 15 ，B用户权限是4|8=12　那么条件就可以这样：　　15 & 1 === 1　　15 & 2 === 2　　15 & 4 === 4　　15 & 8 === 8　　12 & 4 === 4　　12 & 8 === 8 应用场景　我们可以使用按位与来判断一个数的奇偶数，因为二进制最后一位如果为1那么一定是个奇数，所以我们可以这样　奇数 & 1 返回1 ,Number & 1 === 1^ 位异或运算符：这个运算符用于对两个二进制数字的对应位执行异或操作，只有在两个数字的对应位不相同时，结果位才是 1，否则为 0。const a = 5; // 二进制: 101 const b = 3; // 二进制: 011 const result = a ^ b; // 位异或操作 console.log(result); // 输出: 6 (二进制: 110) 按位异或 ^ ，对二进制的每一个比特位进行异或操作如果是0和1会返回1，0和0会返回0，1和1返回0 应用场景　1.可以通过一些条件来切换一个值为0或1 比如 1 ^ 1 = 0 ,0 ^ 1 = 1　2.交换两个变量的值 es6可以有结构赋值的方式[a,b] = [b,a] ，使用位运算可以不用第三个变量　　let a = 1,b = 2;　　a = a ^ b　　b = a ^ b　　a = a ^ b　3.还可以做一些简单的字符串加密算法这里就不演示了~ 位非运算符：这个运算符用于对一个二进制数字的每一位执行非操作，将 0 变为 1，将 1 变为 0。const a = 5; // 二进制: 101 const result = ~a; // 位非操作 console.log(result); // 输出: -6 (二进制: 11111111111111111111111111111010，注意这是有符号整数表示) 按位非 ~ ，对二进制的每一个比特位执行非操作如果是0变成1，1变成0 有几个点需要知道一下：　源码(true form)是一种计算机中对数字的二进制定点表示方法。原码表示法在数值前面增加了一位符号位（即最高位为符号位）：正数该位为0，负数该位为1（0有两种表示：+0和-0），其余位表示数值的大小在计算机系统中，数值一律用补码来表示和存储。原因在于，使用补码，可以将符号位和数值域统一处理；同时，加法和减法也可以统一处理　　1.对数值进行按位非操作的结果为-(x+1)比如~1返回-2，计算公式 ~(x) = -(x+1)　　2.我们读取的十进制是根据源码进行读取的，在内存中，数值都是二进制补码的方式保存的举个例子　十进制2的二进制结构：0000,0010 进行按位非取反结果为1111,1101，正数的补码和源码一样，负数源码转补码或者补码转源码则有其他规则　　1.符号位不变，将剩余位取反，得到反码，在反码的基础上最后一位加一得到负数的补码　1111,1101转10进制:　　1.符号位不变，剩余位取反结果为1000,0010　　2.最后一位加1，结果为 1000,0011　　3.得到的结果1000,0011就是-3的源码　~(1) = -2　~(2) = -3>> 右移运算符 << 左移运算符：这个运算符将一个二进制数字向右移动指定的位数，丢弃最右边的位，同时在最左边添加相同数量的符号位（正数为 0，负数为 1），以保持符号不变。const a = 16; // 二进制: 10000 const result = a >> 2; // 右移 2 位 console.log(result); // 输出: 4 (二进制: 0010)按位移动左移 << ，该操作符会将第一个操作数向左移动指定的位数。向左被移出的位被丢弃，右侧用 0 补充按位移动右移 >> ，该操作符会将第一个操作数向右移动指定的位数。向右被移出的位被丢弃，拷贝最左侧的位以填充左侧应用场景　可以在rgb颜色和16进制颜色之间转换原码是最简单的机器数表示法，用最高位表示符号位，其他位存放该数的二进制的绝对值　以带符号位的四位二进制数为例：1010，最高位为1表示这是一个负数，其它三位010，即02^2+12^1+0*2^0=2，所以1010表示十进制数-2。原码的表示法很简单，虽然出现了+0和-0，但是直观易懂。于是开始运算—— 0001+0010=0011，1+2=3； 0000+1000=1000，+0+(-0)=-0； 0001+1001=1010，1+(-1)=-2。于是可以看到其实正数之间的加法通常是不会出错的，因为它就是一个很简单的二进制加法，而正数与负数相加，或负数与负数相加，就要引起莫名其妙的结果，这都是符号位引起的。0分为+0和-0也是因它而起。原码的特点：原码表示直观、易懂，与真值转换容易。原码中0有两种不同的表示形式，给使用带来了不便。通常0的原码用+0表示，若在计算过程中出现了-0，则需要用硬件将-0变成+0。原码表示加减运算复杂。利用原码进行两数相加运算时，首先要判别两数符号，若同号则做加法，若异号则做减法。在利用原码进行两数相减运算时，不仅要判别两数符号，使得同号相减，异号相加；还要判别两数绝对值的大小，用绝对值大的数减去绝对值小的数，取绝对值大的数的符号为结果的符号。可见，原码表示不便于实现加减运算。反码正数的反码还是等于原码；负数的反码就是它的原码除符号位外，按位取反。　原码最大的问题就在于一个数加上它的相反数不等于0，于是反码的设计思想就是冲着解决这一点，既然一个负数是一个正数的相反数，那干脆用一个正数按位取反来表示负数。以带符号位的四位二进制数为例：3是正数，反码与原码相同，则可以表示为0011；-3的原码是1011，符号位保持不变，低三位按位取反，所以-3的反码为1100。再试着用反码的方式解决一下原码的问题—— 0001+1110=1111，1+(-1)=-0； 1110+1100=1010，(-1)+(-3)=-5。互为相反数相加等于0，虽然的到的结果是1111也就是-0。但是两个负数相加的出错了。反码的特点：在反码表示中，用符号位表示数值的正负，形式与原码表示相同，即0为正；1为负。在反码表示中，数值0有两种表示方法。反码的表示范围与原码的表示范围相同。反码表示在计算机中往往作为数码变换的中间环节。补码正数的补码等于它的原码；负数的补码等于反码+1（这只是一种算补码的方式，多数书对于补码就是这句话）。其实负数的补码等于反码+1只是补码的求法，而不是补码的定义，很多人以为求补码就要先求反码，其实并不是，那些计算机学家并不会心血来潮的把反码+1就定义为补码，只不过补码正好就等于反码+1而已。如果有兴趣了解补码的严格说法，建议可以看一下《计算机组成原理》，它会用“模”和“同余”的概念，严谨地解释补码。补码的思想补码的思想，第一次见可能会觉得很绕，但是如果肯停下来仔细想想，绝对会觉得非常美妙。补码的思想其实就是来自于生活，只是我们没注意到而已，如时钟、经纬度、《易经》里的八卦等。补码的思想其实就类似于生活中的时钟。如果说现在时针现在停在10点钟，那么什么时候会停在八点钟呢？简单，过去隔两个小时的时候是八点钟，未来过十个小时的时候也是八点钟。也就是说时间倒拨2小时，或正拨10小时都是八点钟。也就是10-2=8，而且10+10=8。这个时候满12，说明时针在走第二圈，又走了8小时，所以时针正好又停在八点钟。　所以12在时钟运算中，称之为模，超过了12就会重新从1开始算了。　也就是说，10-2和10+10从另一个角度来看是等效的，它都使时针指向了八点钟。　既然是等效的，那么在时钟运算中，减去一个数，其实就相当于加上另外一个数（这个数与减数相加正好等于12，也称为同余数），这就是补码所谓运算思想的生活例子。　在这里，再次强调原码、反码、补码的引入是为了解决做减法的问题。在原码、反码表示法中，我们把减法化为加法的思维是减去一个数等于加上这个数的相反数，结果发现引入符号位，却因为符号位造成了各种意想不到的问题。　但是从上面的例子中，可以看到其实减去一个数，对于数值有限制、有溢出的运算（模运算）来说，其实也相当于加上这个数的同余数。也就是说，不引入负数的概念，就可以把减法当成加法来算。　补码的实例接下来就做一做四位二进制数的减法（先不引入符号位）。0110-0010，6-2=4，但是由于计算机中没有减法器，没法算。这时候，想想时钟运算中，减去一个数，是可以等同于加上另外一个正数（同余数），这个数与减数相加正好等于模。也就是四位二进制数最大容量是多少？其实就是2^4=16（10000）。那么-2的同余数，就等于10000-0010=1110，16-2=14。既然如此，0110-0010=0110+1110=10100，6-2=6+14=20。按照这种算法得出的结果是10100，但是对于四位二进制数最大只能存放4位，如果低四位正好是0100，正好是想要的结果，至于最高位的1，计算机会把它放入psw寄存器进位位中，8位机会放在cy中，x86会放在cf中，这里不做讨论。这个时候，再想想在四位二进制数中，减去2就相当于加上它的同余数（至于它们为什么同余，还是建议看《计算机组成原理》）。但是减去2，从另一个角度来说，也是加上-2，即加上-2和加上14得到的二进制结果除了进位位，结果是一样的。如果我们把1110的最高位看作符号位后就是-2的补码，这可能也是为什么负数的符号位是1，而不是0。到这里，原码、反码的问题，补码基本解决了。在补码中也不存在-0了，因为1000表示-8。补码的特点：在补码表示中，用符号位表示数值的正负，形式与原码的表示相同，即0为正，1为负。但补码的符号可以看做是数值的一部分参加运算。正数的补码表示就是其本身，负数的补码表示的实质是把负数映像到正值区域，因此加上一个负数或减去一个正数可以用加上另一个数（负数或减数对应的补码）来代替。从补码表示的符号看，补码中符号位的值代表了数的正确符号，0表示正数，1表示负数；而从映像值来看，符号位的值是映像值的一个数位，因此在补码运算中，符号位可以与数值位一起参加运算。在补码表示中，数值0只有一种表示方法。负数补码的表示范围比负数原码的表示范围略宽。纯小数的补码可以表示到-1，纯整数的补码可以表示到-2^n。由于补码表示中的符号位可以与数值位一起参加运算，并且可以将减法转换为加法进行运算，简化了运算过程，因此计算机中均采用补码进行加减运算。为什么负数的补码的求法是反码+1拿-2举例:【正整数2的原码】 (0010) 【正整数2的反码】(1101) 【-2的原码】 (1010) 【-2的反码】 (1101) 【-2的补码】 (1110) 【-2的绝对值】=【正整数2的原码】 (0010)因为负数的反码(1101)加上这个负数的绝对值(0010)正好等于1111(1101+0010=1111)，在加1，就是10000，也就是四位二进数的模，而负数的补码(1110)是它的绝对值(0010)的同余数(10000-0010=1110)，可以通过模减去负数的绝对值(10000-0010=1110)得到它的补码(1110)，所以负数的补码就是它的反码+1(1101+1=1110)。【-2的补码】 + 【-2的绝对值】 = 【-2的反码】 + 【-2的绝对值】 + 1 = 模(10000) -> 【-2的补码】 = 【-2的反码】 + 1文章来源，感谢原作者的无私分享:https://zhuanlan.zhihu.com/p/99082236https://juejin.cn/post/6967233795623747614https://www.php.cn/faq/489781.html

2023年09月21日
28
0
0

2023-09-19

nas定时任务监测端口状态家里有个黑群不稳定总是跑着跑着就挂了日志暂时性没有定位到问题 :@(小怒) 所以现阶段只能用最low的方式解决问题直接重启虚拟机 :@(无语) :@(无语) :@(无语) 所以改改抄抄写了个测试连通性的脚本每30分钟执行一次正好用白群定时任务内网调用黑群ip地址没有响应调用server酱推送消息完美！！ :@(赞一个) :@(赞一个) :@(赞一个)# #! /bin/bash ip="XXX.XXX.XXX.XXX" port=XXXX SENDKEY="XXXXXXX" # SERVER酱密钥 # # 发送消息 function sc_send() { local text=$1 local desp=$2 local key=$3 postdata="text=$text&desp=$desp" opts=( "--header" "Content-type: application/x-www-form-urlencoded" "--data" "$postdata" ) result=$(curl -X POST -s -o /dev/null -w "%" "https://sctapi.ftqq.com/$key.send" "$") echo "$result" } # # 记录调用日志 function log() { # sh脚本同级目录 local log_path="$(cd $(dirname $0);pwd)/sc_send.log" local now=$(date "+%Y-%m-%d %H:%M:%s") echo $(cd $(dirname $0);pwd) echo "$now $1" >> "$log_path" } # 主函数 function main() { arrFlag=(0 0 0) flag=false for i in do responseText=$(curl -I $ip:$port) echo $responseText sleep 2 if [[ $responseText =~ "Failed" ]]; then arrFlag[$i-1]=1 fi done for i in $; do if [ $i -eq 1 ]; then flag=true break fi done if [ $flag = true ]; then msg="$ip:$port -异常" ret=$(sc_send '主人DS918服务器宕机了' "$msg" "$SENDKEY") log "$msg" else log "$ip:$port -正常" fi } main没有通过的话会调用server消息推送算是能第一时间知道黑群挂了好重启

2023年09月19日
32
0
0

分类 学习 下的文章 - 浮川的小窝

分类学习下的文章 - 浮川的小窝