
js
js学习
爱学习的小兰同学
学习总结记录(公众号:元气满满的大咸鱼。欢迎关注。)
展开
-
js中将字符串转为json对象的方法
1.eval()var str = '{ "firstName":"John" , "lastName":"Doe" }'let obj = eval("(" + str + ")")console.log(typeof obj);console.log(obj);2.JSON.parse()var str = '{ "firstName":"John" , "lastName":"Doe" }'let obj = JSON.parse(str)console.log(typeof obj原创 2021-08-26 18:32:14 · 454 阅读 · 0 评论 -
js中replace方法与match方法使用
replace()语法:string.replace(reg/substr,replacement)作用:使用replacement替换substr,或替换一个与正则表达式匹配的子串。返回一个字符串var str = "Visit Microsoft!"var s=str.replace(/Microsoft/, "W3School")console.log(s);//Visit W3School!var str = "Visit Microsoft!"console.log(str.r原创 2021-08-22 21:21:34 · 575 阅读 · 0 评论 -
时间戳与特定格式时间转换
1 获取时间戳1.获取系统当前时间的时间戳(单位:毫秒)方法1:var timestamp1= +new Date();方法2:var timestamp2 = new Date().valueOf();方法3:var timestamp3 = new Date().getTime();2.获取特定时间的时间戳var timestamp = new Date(‘2021-08-22 20:32:08’).getTime();2 将时间戳转为特定格式的日期如:YYYY-MM-DD HH:原创 2021-08-22 21:02:17 · 850 阅读 · 0 评论 -
== 和 ===
等于操作符(==)先进行类型转换,再确定操作数是否相等。遵循的规则:两个都为简单类型,字符串和布尔值都会转换成数值,再比较简单类型与引用类型比较,对象转化成其原始类型的值(调用对象的 valueOf()方法),再比较两个都为引用类型,则比较它们是否指向同一个对象null 和 undefined 相等存在 NaN 则返回 falseconsole.log(true == 1); //trueconsole.log("55" == 55); //truelet obj = { valu原创 2021-08-21 17:57:24 · 163 阅读 · 0 评论 -
JSON.parse()与JSON.stringify()
JSON.parse() // 将 json 字符串转换为json对象JSON.stringify() 将json对象转换为json字符串原创 2021-08-19 21:54:17 · 76 阅读 · 0 评论 -
js中的字符统计方法总结
方法1:普通方法let str = 'aaddccdc'var obj = {};for (let i = 0, len = str.length; i < len; i++) { if (obj[str[i]]) { obj[str[i]]++; } else { obj[str[i]] = 1; }}console.log(obj);方法2:数组方法reduce的技巧let str = 'aaddccdc'const obj原创 2021-08-19 16:03:17 · 561 阅读 · 0 评论 -
js中的排序(sort和冒泡)
1.sort()var points = [40, 100, 1, 5, 25, 10];points.sort(function(a, b) { return a - b; //升序});console.log(points); //[1, 5, 10, 25, 40, 100]points.sort(function(a, b) { return b - a; //降序});console.log(points); //[100, 40, 25, 10, 5, 1]2原创 2021-08-19 15:56:22 · 172 阅读 · 0 评论 -
js对对象按照值进行排序
比如:给定学生和成绩:‘小黑’: 80,‘小王’: 90,‘小杨’: 85,‘小白’: 80将其按照升序排列输出:小黑:80小白:80小杨:85小王:90实现:方法1:存到一个对象里,对对象的键利用sort排序let obj = { '小黑': 80, '小王': 90, '小杨': 85, '小白': 80}//得到按键值升序排列的键数组let keyArr = Obj原创 2021-08-19 14:34:44 · 5502 阅读 · 0 评论 -
拼接数组的办法
1.concat(不改变原数组)let arr1 = [1, 3, 4]let arr2 = [9, 0, 7, 2]let arr = arr1.concat(arr2)console.log(arr);2.利用ES6中的展开运算符let arr1 = [1, 3, 4]let arr2 = [9, 0, 7, 2]let arr = [...arr1, ...arr2]console.log(arr);原创 2021-08-17 20:25:02 · 712 阅读 · 0 评论 -
判断变量是否是数组
instanceofvar a = []console.log(a instanceof Array);//trueArray.isArray(variable)var a = []console.log(Array.isArray(a));原型prototype + isPrototypeOf()Array.prototype.isPrototypeOf(variable)判断Array对象 是否存在 variable的原型链中,存在返回true,反之返回false原.原创 2021-08-17 19:38:17 · 108 阅读 · 0 评论 -
运算符:typeof与instanceof
typeof:检测一个变量的类型,返回字符串instanceof:判断某个实例是否为某个对象的实例,返回布尔值使用:typeof(表达式)和typeof 变量名typeof 的返回值:‘undefined’‘boolean’‘string’‘number’‘object’‘function’注意:console.log(typeof a); //'undefined' console.log(typeof(true)); //'boolean'console.log.原创 2021-08-17 18:49:07 · 248 阅读 · 0 评论 -
数组记录(2)---方法分类:是否改变原数组
原创 2021-08-17 17:04:37 · 119 阅读 · 0 评论 -
js数据类型记录(2)
let a = 10;let b = a; // 赋值操作b = 20;console.log(a); // 10分析:a的值为一个基本类型,存储在栈中,将a的值赋给b,虽然两个变量的值相等,但是两个变量保存在两个不同的内存地址var obj1 = {}var obj2 = obj1;obj2.name = "xxx";console.log(obj1.name); // xxx分析:obj1是一个引用类型,在赋值操作过程汇总,实际是将堆内存对象在栈内存的引用地址复制了一份给了.原创 2021-08-17 16:12:40 · 129 阅读 · 0 评论 -
js删除数组的元素
删除数组中某个指定值的元素(已知值,考虑到这个指定值可能重复)删除数组中某一项(已知索引)删除某个指定值删除元素值为pear的元素思路:先对数组去重,再删除指定值。let fruits = ['apple', 'pear', 'peach', 'banana', 'pear'];let uniqArr = Array.from(new Set(fruits));//去重let index = uniqArr.indexOf('pear');//找到指定值的下标uniqArr.splice.原创 2021-08-17 11:59:36 · 245 阅读 · 0 评论 -
js实现括号匹配记录
let str = '[{{(}}]';let arr = [];let flag = 1;//0:不匹配 1:匹配if (str.length % 2 !== 0) {//长度为奇数 flag = 0;}else {//长度为偶数 for (let item of str) { switch (item) { case '[': arr.push(item); break;原创 2021-08-11 10:32:29 · 394 阅读 · 0 评论 -
js中的变量及变量作用域
变量及变量作用域局部作用域与局部变量局部作用域(函数作用域):作用于函数内的代码环境局部变量:在函数内部定义的变量全局作用域与全局变量全局作用域:作用于整个 script 标签内部或者一个独立的 js 文件全局变量:在全局作用域下声明的变量叫做全局变量(在函数外部定义的变量)小结:js没有块级作用域{}。在函数内部声明的变量是局部变量,作用于函数内部;在函数外部声明的变量是全局变量,作用于整个js文件<script> if (true) { var原创 2021-08-09 15:56:48 · 459 阅读 · 0 评论 -
setTimeout和setInterval: js中的定时器
1000 毫秒= 1 秒(切记)setInterval(code/function,milliseconds) 不停地调用setTimeout(code/function,milliseconds) 调用一次都返回一个ID(数字),传递给clearInterval()、clearTimeout()停止案例1:使用定时器实现进度条<!DOCTYPE html><html lang="en"><head> <meta charset=.原创 2021-08-09 15:27:23 · 104 阅读 · 0 评论 -
js处理数组元素map、filter、reduce(可以统计串中的字符)
使用方式:arr.map(function(el,index){ return deal(el);对数组arr中的元素el进行处理,不改变原数组arr,返回新数组})demo1:var numbers = [4, 9, 16, 25];var newNum2 = numbers.map(function(el, index) { return el * index;});console.log(numbers);//[ 4, 9, 16, 25 ]console.log(new原创 2021-08-07 16:37:32 · 383 阅读 · 0 评论 -
js求数组最大值
arr.sort()方法的使用记录var points = [40, 100, 1, 5, 25, 10];points.sort(function(a, b) { return a - b; //升序});console.log(points); //[1, 5, 10, 25, 40, 100]points.sort(function(a, b) { return b - a; //降序});console.log(points); //[100, 40, 25, 10,原创 2021-08-05 22:58:37 · 283 阅读 · 0 评论 -
js中判断开头或结尾字符
知识点:startsWithendsWith正则let str = 'abcde';console.log(str.startsWith('a')); //trueconsole.log(str.startsWith('adc')); //falselet reg = /^a/console.log(reg.test(str)); //trueconsole.log('----------------');console.log(str.endsWith('de')); //tr原创 2021-07-26 23:05:28 · 810 阅读 · 0 评论 -
js中对象遍历 与 数组或字符串遍历 总结
var obj = { name: 'yxx', age: 18, sex: 0}for (let key in obj) { console.log(key + '-----' + obj[key]); //name-----yxx // age-----18 // sex-----0}console.log(Object.keys(obj)); //[ 'name', 'age', 'sex' ]console.log(Object.原创 2021-07-21 23:46:13 · 388 阅读 · 0 评论 -
js基础---内置对象(Date)
var t = null;t = setTimeout(time, 1000); //開始运行function time() { clearTimeout(t); //清除定时器 dt = new Date(); var y = dt.getFullYear(); var mt = dt.getMonth() + 1; var day = dt.getDate(); var h = dt.getHours(); //获取时 var m = dt.g原创 2021-06-14 22:30:17 · 176 阅读 · 0 评论 -
回流与重绘总结
https://www.jianshu.com/p/e081f9aa03fb回流:情况:元素的规模尺寸,布局,隐藏等改变PS:每个页面至少需要一次回流,就是在页面第一次加载的时候完成回流后,浏览器会重新绘制受影响的部分到屏幕中,该过程成为重绘回流一定重绘重绘:情况:元素需要更新属性,而这些属性只是影响元素的外观,比如background-color。重绘不一定会引起回流...原创 2021-05-06 09:51:09 · 99 阅读 · 0 评论 -
js设置元素样式、获取元素属性(宽度)
1.找到页面元素obj2.设置obj.styleA. 直接写css属性,如:obj.style.height/width/colorB. 改大写(驼峰),如:obj.style.fontSize/marginLeftC. 浮动需要注意: obj.style['cssFloat' in obj.style?'cssFloat':'styleFloat']='left';...原创 2021-05-12 21:28:00 · 383 阅读 · 0 评论 -
js查找页面元素
getElementsByClassName(classname) 获取所有指定类名的元素,返回一个NodeListgetElementById(id) 返回指定ID的元素getElementsByTagName 通过标签名称获取根据选择器查找元素(id需要加#或者class需要加.)querySelector 匹配的第一个 HTMLElement对象querySelectorAll 匹配的所有 HTMLElement对象,返回一个NodeListvar y = document.g.原创 2021-05-12 21:15:27 · 903 阅读 · 0 评论 -
js实现删除页面元素
三种情况:删除元素自身 - xxx.remove() - xxx.parentNode.removeChild(xxx)删除子元素 - 父.removeChild(子)删除父元素 - xxx.parentNode.parentNode.removeChild(xxx的父元素);<div class="fatherBox" style="border:1px solid red"> 我是父盒子 <div class="原创 2021-05-03 21:24:00 · 31739 阅读 · 0 评论 -
js数组去重方法总结
1.数组去重(1)整个数组去重function uniq(array) { var temp = []; //一个新的临时数组 for (var i = 0; i < array.length; i++) { if (temp.indexOf(array[i]) == -1) { //在新数组中找不到旧数组元素 temp.push(array[i]); //将旧数组元素加入新数组 } } retur原创 2021-03-23 19:16:23 · 168 阅读 · 0 评论 -
js---字符串的slice与substring、数组的slice与splice
string.slice(start, end)-----end支持负数,也可不填(表示到末尾)string.substring(start, end)-----start和end都为正数var s = 'hello world!';console.log(s.slice(0)); //hello world!console.log(s.slice(3, 7)); //lo wconsole.log(s.slice(-3, -1)); //ldconsole.log(s.substring.原创 2021-03-02 18:35:42 · 1286 阅读 · 0 评论 -
js---正则表达式补充
预定义类说明\d匹配0-9之间的任一数字,相当于[0-9]\D匹配所有0-9以外的字符,相当于[^0-9]\w匹配任意的字母、数字、下划线,相当于[A-Za-z0-9]\W匹配所有字母、数字、下划线以外的字符,相当于[^A-Za-z0-9]注意:如果符号^在[ ]内,指的是匹配除…之外的字符;如果符号^在/ /内,指的是匹配开始字符;console.log(/[^A-Za-z0-9]/.test('&')); //trueconsol原创 2021-03-02 17:09:59 · 157 阅读 · 0 评论 -
转换相关:parseInt()、Number()、Boolean()、字符与ASCII码互转、number.toString(radix)、number.toFixed(count)、isNaN()
isNaN(x)如果 x 是特殊的非数字值 NaN(或者能被转换为这样的值),返回的值就是 true如果 x 是其他值,则返回 falseconsole.log(isNaN(0)); //falseconsole.log(isNaN(true)); //falseconsole.log(isNaN(false)); //falseconsole.log(isNaN(null)); //falseconsole.log(isNaN(undefined)); //trueconsole.lo原创 2021-03-02 11:14:06 · 242 阅读 · 0 评论 -
hasOwnProperty()与defineProperty()
Object.defineProperty()在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象。语法:Object.defineProperty(obj, prop, descriptor)const object1 = { name:'mobile'};Object.defineProperty(object1, 'price', { value: 4200, //属性对应的值不可改变 writable: false});object1.price =原创 2021-03-01 20:16:15 · 201 阅读 · 0 评论 -
js中的除法与求余
1.求余console.log(5 % 2);//12.除法console.log(5 / 2); //2.5console.log(Math.floor(5 / 2)); //2 向下取整console.log(Math.round(5 / 2)); //3 四舍五入原创 2021-02-23 19:26:01 · 7173 阅读 · 0 评论 -
js---ES6相关
1 解构赋值把数据结构分解,然后给变量进行赋值。//1.数组解构let [a, b, c, d] = [1, 2, 3];console.log(a); //1console.log(b); //2console.log(c); //3console.log(d); //undefined//2.对象解构let person = { name: 'zhangsan', age: 20 };let {name,age}原创 2021-02-20 23:53:06 · 110 阅读 · 0 评论 -
数组记录(1)---基本使用
1.arr.length2.arr1.concat(arr2)3.arr.forEach(function(Value, index, arr), thisValue)4.arr.some(function(Value,index,arr),thisValue)5.arr.every(function(currentValue,index,arr), thisValue)6.arr.find(function(currentValue, index, arr),thisValue)7.arr.f原创 2021-02-19 23:54:01 · 640 阅读 · 0 评论 -
js---字符串的使用总结
1.str.length2.str.charAt(index)3.str1.concat(str2)4.str.indexOf()5.str.includes()6.str.replace(searchvalue,newvalue)7.str.slice(start,end)8.str.substring(start,end)9.str.substr(start,length)10.str.toLowerCase()11.str.trim()12.str.split()str.len原创 2021-02-19 22:05:25 · 436 阅读 · 0 评论 -
js---switch语句的使用
作用:选择多个需被执行的代码块之一。switch(表达式) { case 值1: 代码块1 break; case 值2: 代码块2 break; case 值3: 代码块3 break; default: 默认代码块}使用案例:getDay() 方法返回 0 至 6 之间的星期数字。(Sunday=0, Monday=1, Tuesday=2 …)switch (new Date().getDay()).原创 2021-02-19 20:36:10 · 378 阅读 · 0 评论 -
js---正则表达式
1.创建正则表达式://1.通过调用RegExp对象的构造函数var regexp = new RegExp(/123/);console.log(regexp);//2.利用字面量var rg = /123/;// rg.test() 检测字符串是否符合该规则console.log(rg.test(123)); //trueconsole.log(rg.test('abc')); //false2.边界符边界符说明^匹配行首的文本$匹配行原创 2021-02-18 00:29:07 · 297 阅读 · 2 评论 -
js---浅拷贝与深拷贝
浅拷贝:只是拷贝一层, 更深层次对象级别的只拷贝引用(地址).深拷贝:拷贝多层, 每一级别的数据都会拷贝.1.浅拷贝<script> //将对象oldobj复制给对象newobj var oldobj = { name: '小新', bestSkills: { music: '枕边童话', sport: '羽毛球' } }; var newobj = {}; //1.利用for in for (var k in old.原创 2021-02-14 00:24:43 · 109 阅读 · 0 评论 -
js---点击li输出当前li的索引号
1.动态添加属性的方法<body> <ul> <li>星期1</li> <li>星期2</li> <li>星期3</li> <li>星期4</li> <li>星期5</li> </ul></body><script> v原创 2021-02-12 19:09:51 · 730 阅读 · 0 评论 -
js---改变函数内部this指向的方法(call、apply、bind)
1.call()fun.call(thisArg, arg1, arg2, ...) // thisArg:在 fun 函数运行时指定的 this 值 //arg1,arg2:传递的其他参数 (1)调用函数(2)改变函数内的this指向var xn= { name: '蜡笔小新'}function fn(a, b) { console.log(this); console.log(a + b);};fn(1,2)//3 普通函数调用:此时的this指向的原创 2021-02-11 23:32:28 · 254 阅读 · 2 评论