Community Learn Tools Library Leisure
search
English
Home > List of blog posts > 数组，对象，传参解构; 访问器属性的get,set操作
Blogger Information
Blog 11
fans 0
comment 0
visits 6576
Special Recommendation
More>
Related recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
数组，对象，传参解构; 访问器属性的get,set操作
Ghcᝰ
Original
573 people have browsed it

数组，对象，传参

  1.     <!-- 函数传参:永远都是值传递 -->
  3.     <script>
  5.         const f1 = (x) => (x = 10);
  6.         let m = 5;
  7.         // m:入参,当前传入的是一个基本类型，原始类型，整数
  8.         f1(m);
  9.         console.log("m = %d", m);
  11.         const f2 = (x) => (x.a = 10);
  12.         let o = {
  13.             a: 5,
  14.             b: 6
  15.         }
  16.         f2(o);
  17.         console.log('o.a = ', o.a);
  18.         // 这里虽然o.a的属性被修改了，但不是更新，
  20.         // 模板字面量和标签函数
  21.         let name = "朱老师";
  22.         let str = "hello" + name;
  23.         let str = `Hello ${name}`; //这行代码等价于上面的代码
  24.         // 字面量：Hello
  25.         // 插值：${name}
  28.         console.log(str);
  30.         // 1.模板字面量：将表达式/插值嵌入到字符串中
  31.         //模板字面量内部有2部分组成：字符串字面量，变量插值
  32.         let menus = ['首页', '视频', '文章'];
  34.         let htmlStr = `
  35.                     <nav>
  36.         <a herf="">${menus[0]}
  37.         <a herf="">${menus[1]}
  38.         <a herf="">${menus[2]}
  39.                         </nav>      
  40.                     `;
  41.         console.log(htmlStr);
  43.         // 2.标签函数，（模板函数）,自定义模板字面量的一些行为
  44.         const hello = (name) => (alert(name));
  46.         hello("谢谢哦哦");
  47.         //参数约定：
  48.         // 1.第一个参数：所有字符串字面量组成的数组
  49.         // 2.第二个参数：变量插值组成的数组
  51.         let sum = (strs, a, b) => {
  52.             console.log(strs);
  53.             console.log(a, b);
  54.         }
  55.         let a = 5, b = 6;
  56.         sum`${a}+${b}=`;
  58.         // // rest: 归并参数
  59.         sum = (strs, ...args) => {
  60.             console.log(strs);
  61.             console.log(args);
  62.         }
  63.         let c = 7;
  64.         sum`${a}+${b}+${c}=`;

数组，对象，解构

  1.    //解构赋值
  2.         // 数组解构
  3.         // 等号左边是右边的模板，必须长得一样
  4.         let [a, b, c] = [1, 2, 3];//完全结构
  5.         [a, b] = [1, 2, 3];//不完全结构
  7.         [a, b, ...c] = [1, 2, 3, 4, 5, 6, 7, 8, 9];//把后面所有的参数给到C里面
  9.         //对象解构
  10.         let shangpin = { id: 1, sname: "手机" };
  11.         let id, sname;
  12.         // ({ id, sname } = { id: 1, sname: "手机" });
  13.         ({ id, sname } = shangpin);
  14.         console.log(id, sname);
  16.         //参数解构
  17.         //数组传参
  19.         let qiuhe = ([a, b]) => a + b;
  20.         // 上面的a,b相对于等号左边的模板,下面的30,50相当于等号右边的插值
  21.         console.log(qiuhe([30, 50]));

访问器属性的get,set操作

  1. <!DOCTYPE html>
  2. <html lang="en">
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <title>访问器属性的get,set操作</title>
  9. </head>
  11. <body>
  12.     <!-- bingd(),call(),apply() -->
  13.     <!-- this:执行上下文,程序的运行环境 -->
  14.     <script>
  15.         let fwqsx = {
  16.             data: { name },
  17.             get name() {
  18.                 return this.data.name;
  19.             },
  20.             set name(v) {
  21.                 this.data.name = v;
  22.             }
  23.         };
  25.         fwqsx.name = "老师";
  26.         console.log(fwqsx.name);
  27.         // 访问器属于的优先级高于同名的普通属性
  28.         fwqsx.data.name = "老师1";
  29.         console.log(fwqsx.data.name);
  30.     </script>
  32. </body>
  34. </html>
Correcting teacher：天蓬老师天蓬老师

Correction status：qualified

Teacher's comments：
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post