WebJavaScript训练篇

1.【2021-3-1】作用域

 var n = 10;
  function fn() {
    console.log(n);
  }
  function en(f) {
    var n = 20;
    f();
  }
  en(fn);

解答：全局作用域及函数调用，函数的形参实参运用，首先全局定义了n为10，那么至此以下所有的n均为10是毋庸置疑的，所以fn函数内部的结果是10，其次en函数调用的实参也是fn函数的运行结果，那么结果依旧是10。

2.【2021-3-2】作用域，if判断，运算符

        var x = 10;
        var xl = function(x){
            x=5
            var e = 5;
            console.log(x)
            el(x+e);
        }
        var el = function(c){
            var a = 5;
            if(a>c){
             c=5
            }else{
             a+=c
            }             
            console.log(x+a+c)
        }
        xl(10)

解答： 五个变量，两大函数体，一个回调函数 ，一个函数最终被挂起执行。最终执行函数xl(),且xl内部调用了el(),可知会打印两个值;
外部定义全局变量x=10,xl()设置更改为局部变量，就近原则，故x:5;即打印第一个值为5;可计算出x+e=10;接着代入参数到el()，即c:10;
判断语句为false,则直接走到第二步，算术运算符a=a+c=15,故x+a+c=10+15+10,即打印第二个值为35。

3.【2021-3-3】for循环，逻辑运算，数组求和

 计算Lee具体法定退休日期和个人养老存储额及每月可领养老金额
     以下是Lee个人信息:
     姓名:Lee
     性别:男
     职业:前端开发工程师
     出生日期:1998年6月6日
     企业意愿缴费基数:20%
     个人意愿缴费基数:30%
     全省年度在岗职工月平均工资:3500元
     工作信息:2020.1-2021.1(资本科技,月薪12K,)
             2021.1-2025.1(独立科技,月薪**,跳槽后的Lee月薪逐年增幅15%)
             2025.1-退休(吃喝玩乐,退休前已缴满15年)
     在职缴纳月养老金 = 企业缴纳部分+职工缴纳部分 
     企业缴纳月部分= 月薪×企业意愿缴费基数, 职工缴纳部分=月薪×个人意愿缴费基数
     个人缴纳月部分= 全省年度在岗职工月平均工资× 个人意愿缴费基数
     每月可领养老金额 = 月基础养老金 + 月个人账户养老金
     月基础养老金 = (全省年度在岗职工月平均工资+本人指数化月平均缴费工资)÷2×缴费年限×1%  其中，本人指数化月平均缴费工资=全省年度在岗职工月平均工资×个人意愿缴费基数
     月个人账户养老金=个人养老存储额÷计发月数(50岁为195个月、55岁为170个月、60岁为139个月)

解答：（详细代码见码云master分支）
Lee具体法定退休日期→ 2058年6月6日
Lee个人养老存储额→ 611451.42元
Lee每月可领养老金额→ 4740.18元

4.【2021-3-4】用递归法和非递归两种方法求1-100的和。

解答：（详细代码见码云friend分支）

5.【2021-3-4】构建对象实例，数组方法运用

 阿衰:物理:83,化学:42 ,生物:51 ,政治:49,地理:77 ,历史:89
 刘星:物理:41 ,化学:15,生物:67 ,政治:93 ,地理:23 ,历史:50
 小让:物理:85 ,化学:72,生物:63 ,政治:89 ,地理:75 ,历史:45
 大雄:物理:33 ,化学:10 ,生物:72,政治:36 ,地理:12 ,历史:88
 帮助以上学生选择文理分科,分科规则（高于另外一科[三门]总分的50%为优）,并找出每个人两科平衡学科,判断规则（两科分数相加等于160分）

解答：（详细代码见码云friend分支）

6.【2021-3-5】函数调用，数组循环

  自写一个算法函数,条件:满足任意数组中任意两个值相加的和等于100,并打印输出两个元素在数组内部的下标
  例如：arr:[10,20,59,17,80]=>[20,80]=>(1,4)

解答：2021-3-5

7.【2021-3-5】html与js搭配 dom操作 运算符

  自写加法计算器，条件：基础样式即可，输入任意数字均可得出答案，若用户输入非数字则提醒“输入数据不合法”,防止用户暴力点击，并进行为空处理。

解答：2021-3-5

8.【2021-3-6】对象更改属性，并新增新属性

    条件:将pople更改为name属性，新增id属性
      var people =[
        {people:'kahom',sex:'男',hoby:'旅游'},
        {people:'kenneth',sex:'男',hoby:'桌游'},
        {people:'katniss',sex:'女',hoby:'手游'}
    ]

解答：2021-3-6

9.【2021-3-6】数组转数组对象，并计算下标前三位之和

   var vegetables =['土豆','茄子','豌豆','黄瓜','豆腐','莲藕']
   var price =['100','62','58','102','65','85']

解答：2021-3-6

10.【2021-3-8】数组相加

条件：自定义至少两个以上数组，用至少两种方法将其数组合并

解答：2021-3-8

11.【2021-3-8】数组对象相加

条件：自定义至少两个以上数组对象，用至少两种方法将其数组对象合并

解答：2021-3-8

12.【2021-3-9】数组对象删除指定属性

条件： 自定义对象数组（包含id属性），删除指定的数组对象（删除id属性）

解答：2021-3-9

13.【2021-3-9】JS表单操作

  自定义表单，按钮获取所有用户输入的表单内容,根据表单内容一一做相应正则匹配
  姓名,性别(单选),出生年月日(时间选择器),手机号码,籍贯(自定义省份，不必全国),兴趣爱好(多选),个人经历(多行文本输入,定义字数不超过200字)
 条件:样式不限，仅需进行表单验证，提交按钮可获取所有内容

解答：2021-3-9

14.【2021-3-10】数组对象去重

   var student =[
        {name:'阿衰',physics:83,chemistry:42,biology:51,politics:49,geography:77,history:89},
        {name:'刘星',physics:41,chemistry:15,biology:67,politics:93,geography:23,history:50},
        {name:'小让',physics:85,chemistry:72,biology:63,politics:89,geography:75,history:45},
        {name:'大雄',physics:33,chemistry:10,biology:72,politics:36,geography:12,history:88},
        {name:'大雄',physics:33,chemistry:10,biology:72,politics:36,geography:12,history:88},
    ]

解答：2021-3-10

15.【2021-3-10】Tab栏组件

  Tab栏组件
  条件:样式不限,tab栏分三板块,内容相对性三部分

解答：2021-3-10

16.【2021-3-24】jQuery-weui表单组件

利用weui组件完成用户表单数据填写
姓名
性别
手机号
出生日期
个人爱好（多选）
过往经历（文本域）

传给后端的值
name:''
sex:'',
phone:'',
birthday:'',
hoby:'',
experience:'这就是一段测试性的文字，你说什么就是什么，你开心也就开心'

解答：2021-3-24

17.【2021-3-30】jQuery-layui表单组件

利用layui组件完成用户表单数据填写
姓名
性别
手机号
出生日期
个人爱好（多选）
过往经历（文本域）

传给后端的值
name:''
sex:'',
phone:'',
birthday:'',
hoby:'',
experience:'这就是一段测试性的文字，你说什么就是什么，你开心也就开心'

解答：2021-3-30

18.【2021-3-31】轮播图组件

利用相关组件或原生js完成至少三张图片的轮播效果

解答：2021-3-31

19.【2021-4-01】小米官网

模块一：https://www.mi.com
模块二：https://www.mi.com/service
两个模块的内页全部暂时不做，注：顶部tab栏，以及侧面栏，底部栏均要还原

解答：2021-4-08