值传递和引用传递

  1. <script>
  2. // 值传递有原生类型，字符串，数值，布尔，值传递的时候只传值，不会传地址，这样更改其中一个数值的时候不会一起更改
  3. let a=1;
  4. let b=a;
  5. a=2;
  6. //这两个都是原生类型，更改a后b不会更改值，b还是1
  8. //引用专递有对象，传递的时候值和地址一起传递，更改数值的时候回一起更改
  9. let obj1={a:1， b:2};
  10. let obj2=obj1;
  11. //更新obj1其中a的值
  12. obj1.a=10;
  13. //这时候obj2中的a也会更新
  14.     //传递参数无论什么类型都是值传递
  15. const f1=(x)=>(x=10);
  16. let m=5;
  17. //把m传入到f1函数中,叫入参
  18. f1(m);
  19. //函数中对参数更新，不会影响到入参的值
  20. const f2=(x)=>(x.a=10);
  21. let o={a:1,b:2};
  22. //用o调用f2这个函数
  23. f2(o);
  24. //虽然o里面的a更新了，实际上不是引用传递，是值传递，因为对于引用类型，只有全新的赋值才是更新，修改其中单个属性不算
  25. const f3=(x)=>(x={a:1,b=1});
  26. f3(o);
  27. //深拷贝就是值传递，穿个值过去，就值和地址都过去了
  28. //浅拷贝就是引用传递，就给你个地址让你访问
  29. </script>

数组和对象解构的常用方法与函数传参

  1. <script>
  2. //解构赋值就是快速从集合数据（对象/数组）解构出独立变量，常用于vue中
  3. //解构数组
  4. let [a,b,c]=[1,2,3];
  5. console.log(a, b, c);
  6. //变量名多数值少，多出的变量会显示默认值
  7. [a, b, c, d] = [1, 2, 3];
  8. //变量名少数值多，有几个变量名显示几个数值
  9. [a, b] = [1, 2, 3];
  10. //解析a、b，剩下都放进数组
  11. [a,b,...c]=[1,2,3,4,5];
  12. //单独解析某个值，它是第几位就在前面加几个逗号，后面也得加上
  13. [,,a,,]=[1,2,3,4,5];
  14. //两个变量交换值就可以直接用解构来弄，不用再弄中间数了
  15. let x = 1,
  16. y = 2,
  17. // 中间量
  18. t;
  19. console.log("x=%d,y=%d", x, y);
  20. t = y;
  21. y = x;
  22. x = t;
  23. console.log("x=%d,y=%d", x, y);
  24. // 用解构函数
  25. [y, x] = [x, y];
  26. console.log("x=%d,y=%d", x, y);
  28. //对象解析，变量名必须一样，顺序是无所谓
  29. let {id,name}={id:10,name:"手机"};
  30. console.log(id, name);
  31. //用已有变量名来解析会导致覆盖已有的值，可以用别名的方式来解析
  32. let email="as@qq.com"
  33. let {name,email:asemail}={name:"电脑",email:"sd@qq.com"}
  34. //这样访问asemail会访问后面的值，访问原先email会访问到原先的值
  36. //参数解构，
  37. //数组传参
  38. let sum=([a,b])=>a+b;
  39. console.log(sum([10, 20]));
  40. // 对象传参
  41. let getUser = ({ name, email }) => [name, email];
  42. console.log(getUser({ email: "php.con", name: "老师" }));
  43. </script>

call,apply,bind

  1. <script>
  2. //创建函数
  3. function hello(name){
  4.     this.name=name;
  5.     console.log(this.name);
  6. }
  7. //创建一个对象
  8. const obj={name:"admin"};
  9. console.log(hello("朱老师"));
  10. //hello通过用bind绑定到obj上，因为需要参数，所以第二个写成参数
  11. let f = hello.bind(obj, "天蓬老师");
  12. //f()不会立刻执行，返回的是个函数声明
  13. console.log(f());
  14. //call/apply立即执行
  15. f = hello.call(obj, "灭绝老师");
  16. //这里就不用加括号了，因为是立即执行
  17. console.log(f);
  18. //用apply，参数必须数组
  19. f = hello.apply(obj, ["西门老师"]);
  20. console.log(f);
  21. </script>

访问器属性的原理与实现过程

  1. <script>
  2. const product = {
  3.         data: [
  4.           { name: "电脑", price: 5000, num: 5 },
  5.           { name: "手机", price: 4000, num: 10 },
  6.           { name: "相机", price: 7000, num: 3 },
  7.         ],
  8.         //计算多少钱
  9.         getAmounts() {
  10.           return this.data.reduce((t, c) => (t += c.price * c.num), 0);
  11.         },
  12.         //访问器属性
  13.         //通过方法伪造成一个属性
  14.         //通过get从新创建一个方法
  15.         //这样就可以用属性来打到方法的效果，这就是访问器属性
  16.         get ta() {
  17.           return this.data.reduce((t, c) => (t += c.price * c.num), 0);
  18.         },
  19.         //用ser来修改其中某一个数值
  20.         set setPrice(price) {
  21.           //this就是指向当前data中的第二个的price属性，然后让它等于传进来的参数
  22.           this.data[1].price = price;
  23.         },
  24.       };
  25.       console.log("总额:", product.getAmounts());
  26.       //通过属性访问
  27.       console.log("总额:", product.ta);
  28.       //先访问一些原先的属性
  29.       console.log(product.data[1].price);
  30.       //然后从新赋值一个
  31.       product.setPrice = 9000;
  32.       //然后再访问一些
  33.       console.log(product.data[1].price);
  34.       console.log("--------------------");
  35.       //访问器属性的优先级高于同名的普通属性
  36.     </script>

多分支与swithc转换的技巧

  1. <script>
  2.     let cj=60;
  3.     //单循环
  4.     if(cj>=60){
  5.     console.log('及格');
  6.     }
  7.     //加分支
  8.     if(cj>=60){
  9.     console.log('及格');
  10.     }else{
  11.     console.log('不及格');
  12.     }
  13.     //多分支
  14.     if(cj>=60&&cj<=80){
  15.     console.log('及格');
  16.     }else if(cj>=80&&<=100){
  17.     console.log('优秀')
  18.     }else if(cj>100||cj<0){
  19.     console.log('非法数据')
  20.     }else{
  21.     console.log('不及格')
  22.     }
  23.     //多分支用switch来写，switch是严格匹配，括号里面必须用true
  24.     score = 100;
  25.     switch (true) {
  26.     // 第一种情况
  27.     case score >= 60 && score < 80:
  28.     console.log("合格");
  29.     // 跳出来
  30.     break;
  31.     case score >= 80 && score <= 100:
  32.     console.log("优秀");
  33.     // 跳出来
  34.     break;
  35.     case score > 100 && score < 0:
  36.     console.log("问题");
  37.     // 跳出来
  38.     break;
  39.     // 默认分支
  40.     default:
  41.     console.log("补考");
  42.     }
  43.     // 一般用在单值判断
  44.     let response = "Success";
  45.     // 传递的值有可能会出现大小写错误
  46.     // toLowerCase()会把传入的字符串全部改为小写
  47.     // toUpperCase()全部改为大写
  48.     switch (response.toLowerCase()) {
  49.     case "fail":
  50.     console.log("请求失败");
  51.     break;
  52.     case "success":
  53.     console.log("请求成功");
  54.     break;
  55.     default:
  56.     console.log("位置分支");
  57.     }
  58. </script>

三元运算

  1. <script>
  2. // 三元运算符简写法
  3. // 条件：如果为真执行第一个，如果为假执行第二个,中间用分号分开
  4. score = 50;
  5. console.log(score >= 60 ? "及格" : "补考");
  6. </script>

更多相关文章

  1. 组件基础与组件之间的通信
  2. 在 vue 中使用条件渲染语句实现 todolist，以及 vue 中的计算属性
  3. box-sizing属性，常用的元素居中方式
  4. CSS高级知识网格布局Grid常用属性
  5. python单下划线开头和双下划线开头的方法和属性
  6. grid对齐属性、grid实战php网站首页、媒体查询
  7. 第24章 0118-vue常用指令介绍，学习心得、笔记（实例演示条件渲染， 计
  8. grid属性实例演示
  9. 【转】windowSoftInputMode属性详解

随机推荐

  1. android底层的学习
  2. Android加载SVG实现交互式地图绘制
  3. Windows下通过虚拟机搭建android的linux
  4. Android之实现点击波纹效果
  5. Android adb shell命令大全
  6. android数据库操作出现的 android.databa
  7. Android的EditText控件常用属性
  8. Android架构实例分析之注册hello HAL的JN
  9. android 四种启动模式
  10. 剖析andriod联系人