JavaScript基础
DangR-Jisoo
Web Sport Cook Music History
展开
-
JavaScript map(),forEach(),reduce(),filter()的使用
map()使用场景1:对数组进行遍历,并对原数组进行一些操作,返回一个新的数组,但不影响原来的数组const arr=[1,3,5,7,9]const newArr=arr.map((item)=>{ return item+1})console.log(arr)//打印原数组[1, 3, 5, 7, 9]console.log(newArr)//打印新数组[2, 4, 6, 8, 10]由上述代码可以看出,map()不会影响原数组使用场景2:在React中利用map()来渲染.原创 2021-10-08 22:28:26 · 180 阅读 · 0 评论 -
JavaScript如何将一个对象里的某些属性抽离出来
JavaScript如何将一个对象里的某些属性抽离出来需求:如图所示,此数据是一个个很规范的键值对,属性有value和name如下图所示:另外一组数据有很多很多属性,现在要将该数组里面的属性删至两个,只保留下图的’yjms’和’yl’,但是要将这两个属性名分别改为上图所示的value和name,即value=yl,name=yjms实现步骤:创建一个新的空数组使用for循环遍历如图一所示的数组给创建的空数组设置属性值const newArr = [];//创建空数组for (let原创 2021-04-08 17:16:33 · 1733 阅读 · 0 评论 -
JavaScript之递归及其相关案例
JavaScript之递归及其相关案例什么是递归?递归:一个函数在内部可以调用其本身var num = 1;function fn() { console.log('我爱写代码'); if (num == 6) { return; } else { num++; } fn();}fn(); //'我爱写代码'*6由于递归很容易发生栈溢出错误,所以必须要加退出条件return原创 2020-11-29 20:44:16 · 160 阅读 · 0 评论 -
JavaScript闭包详解及案例
JavaScript闭包详解及案例一. 变量作用域函数内部可以使用全局变量函数外部不可以使用局部变量当函数执行完毕时,本作用域内的局部变量会被销毁二. 闭包闭包:有权访问另一个函数作用域中变量的函数(变量所在的函数就是闭包函数,闭包就是典型的高阶函数)闭包的作用:延申了变量的作用范围//方法一function fn() { var num = 10; return function() { consol原创 2020-11-29 15:16:57 · 185 阅读 · 0 评论 -
JavaScript注册事件的两种方式
JavaScript注册事件的两种方式传统注册方式(具有唯一性,后面注册事件的处理函数会覆盖掉前面的处理函数)var btn=document.querySelectorAll('button'); btn[0].onclick=function(){ alert('你好'); //不会弹出 } btn[0].onclick=function(){ alert('我不好'); //会弹出}原创 2020-11-29 12:50:58 · 709 阅读 · 0 评论 -
JavaScriptDOM事件流
JavaScriptDOM事件流DOM事件流分为三个阶段: 1.捕获阶段 2.当前目标阶段 3.冒泡阶段JS代码只能得到捕获阶段或冒泡阶段的一个onclick和attachEvent只能得到冒泡阶段捕获阶段:如果addEventListener的第三个参数是true,则处于捕获阶段document–>html–>body–>father–>son冒泡阶段:如果addEventListener的第三个参数是false或者省略,则处于冒泡阶段son–>father–>原创 2020-11-29 12:46:34 · 156 阅读 · 0 评论 -
JavaScript偏移量offset,可视区client,滚动scroll系列
JavaScript偏移量offset,可视区client,滚动scroll系列一.element.offsetTop element.offsetLeft以上两种方法获得元素距离其父元素的上距离与左距离,但是父元素得设置定位,若没有设置定位,则以body为主<style> * { margin: 0; padding: 0; } .box1 { p原创 2020-11-29 12:40:48 · 183 阅读 · 0 评论 -
JavaScript定时器及案例
JavaScript定时器及案例两种好用的定时方法window.setTimeout(调用函数,[延迟的毫秒数]);window在调用的时候可以省略延迟的毫秒数可以省略,默认值是0毫秒后调用调用函数可以写在外面页面中通常有很多定时器,我们会将定时器赋给变量window.addEventListener('load', function() { var time = setTimeout(fn, 1000); function fn() {原创 2020-11-29 12:31:14 · 347 阅读 · 0 评论 -
JavaScript基本包装类型String(字符串对象)
JavaScript基本包装类型String(字符串对象)只有对象,复杂数据类型才有属性和方法,为什么string这个简单数据类型会有length属性呢?基本包装类型:把简单数据类型包装成复杂数据类型有哪些基本包装类型呢?var str='pink';console.log(str.length); //4以上代码等同于var str=new String('pink');console.log(str.length); //4根据字符返回位置str.indexOf(‘要查找的字原创 2020-11-29 12:11:53 · 174 阅读 · 0 评论 -
JavaScript内置对象Math详解
JavaScript内置对象Math一. JavaScript对象共有三种:自定义对象(前面所学,基础),浏览器对象(API所学),内置对象(基础)二. 内置对象:JavaScript语言自带的一些对象,供开发者使用,并提供了最常用,最基本的属性和方法(Math,Array,Date,String等)三. Math对象:是一个内置对象,具有数学常数和函数的属性和方法,不是一个函数对象四. 有关Math的相关方法Math.max() 是一个方法,返回一组数据里的最大值console.log(原创 2020-11-28 23:25:55 · 263 阅读 · 0 评论 -
JavaScript之Date()——倒计时案例
JavaScript之Date()——倒计时案例案例:距2021年1月1日还有多少天?思路:活动开始的时间减去当前的时间function countDown(time) { var nowTime = +new Date(); //获得当前时间的时间戳 var inputTime = +new Date(time); //获得你要输入时间的时间戳 var times = (inputTime - nowTime) / 1000; //获得两个时间差的秒数 var d = parseIn原创 2020-11-27 23:34:41 · 287 阅读 · 0 评论 -
JavaScript内置对象Date(日期)
JavaScript内置对象Date(日期)Date()日期对象,是一个构造函数,所以必须使用new来创建和调用日期对象var date_ = new Date(); //若括号里没有任何参数,则返回系统当前时间console.log(date_); //Fri Nov 27 2020 23:04:45 GMT+0800 (中国标准时间)Date()里面参数常见的写法1. 数字型:2020,05,06(此方法返回的月份比写入的月份大一月)var date1 = new Date(2020, 0原创 2020-11-27 23:29:07 · 216 阅读 · 0 评论 -
详解JavaScript内置对象Array(数组)
JavaScript内置对象Array(数组)一. 创建数组的两种方式方法一:数组字面量var arr=[1,2,3,4,5,6];方法二:new Array()var arr1=new Array(); //创建一个空数组var arr2=new Array(2); //创建一个长度为2的数组var arr3=new Array(2,3,4); //创建一个[2,3,4]的数组二. 检测是否为数组的两种方法方法一:instanceof运算符var arr4=[1,2,3,原创 2020-11-27 23:00:47 · 191 阅读 · 0 评论 -
Javascript对象详解(创建和使用对象)
Javascript对象详解什么是对象?对象是一组无序的相关属性和方法的集合(字符串,数值,数组,函数等),由属性和方法构成创建对象的三种方式:方式1:使用字面量创建对象//创建对象var obj={ name: 'jisoo', //属性 age: 25, //属性 gender: '女', //属性 sayHi: function(){原创 2020-11-27 17:22:08 · 197 阅读 · 0 评论