day02es6

最新推荐文章于 2024-09-17 11:42:54 发布

wwdn_n

最新推荐文章于 2024-09-17 11:42:54 发布

阅读量82

点赞数

分类专栏： es6 文章标签： javascript html5 es6

本文链接：https://blog.csdn.net/m0_61333559/article/details/120275547

版权

es6 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

本文详细介绍了ES6中的let和const声明变量的规则，包括变量不可重复声明、块级作用域以及不存在变量提升。同时，讲解了模板字符串的使用以及解构赋值在数组和对象中的应用。此外，还探讨了箭头函数的特性和this的指向问题，帮助理解箭头函数与普通函数的区别。

摘要由CSDN通过智能技术生成

day2es6

1.let 访问修饰符

1.1声明变量

//声明变量
        // let a;
        // let b,c,d;
        // let e = 'lbj';
        // let f = 'qq',g='ww',h='ee';

1.2声明的变量不能重复

//变量不能重复声明
        // let student = '刘备';
        // let student = '诸葛亮';

1.3不能跨域声明

//不能跨域声明
        // {
        //     let teacher = '诸葛亮';
        // }
        // console.log(teacher)

1.4不存在变量提升

//不存在变量提升
        // console.log(star)
        // let star = '周杰伦'
         var items = document.getElementsByClassName("item");
         //此处不能用var 的原因是var是全局作用域，如果使用var将会是items[3]
        //  for (var i = 0; i < items.length; i++) {
        //         items[i].onclick = function (){
        //             items[i].style.background = 'pink'
        //         }
        //  }
        for (let i = 0; i < items.length; i++) {
                items[i].onclick = function(){
                    this.style.background = 'pink'
                }
         }
        //  console.log(i)  此处的I是3

2.const常量

2.1常量需要初始化值

const a;

2.2常量不能修改

2.3常量和let一样只能在同一作用域中有效

2.4可以在数组以及对象中进行修改，因为地址没有改变，所以可以修改

//4.可以在数组和对象中进行修改
        const lakers = ['lbl','dvice','bop']
        lakers.push('kuzma')
        console.log(lakers)
        const person = {
            name:'李皓',
            master:'袁硕',
            msg:'银城八大家之李家继承人'
        }
        person.msg = '记忆力超群';
        console.log(person)

3.字符模板

3.1使用``可以直接使用换行

//2.运用``可以换行使用
        const longstr = `<ul>
                            <li>1</li>
                            <li>2</li>
                        </ul>`;
                        console.log(longstr)

3.2变量拼接字符串

const sons = '<<借过>>';
       const now = `我先在在听${sons}`;
       console.log(`我先在在听${sons}`)

4.解构赋值

4.1为数组进行结构赋值

 //所谓结构赋值就是在常量中通过一定的方式从变量获取值
       //1.从数组中获取值
    //    const classmates = ['ty','qqq','www']
    //    let [a,b,c] = classmates;
    //       console.log(a)
    //       console.log(b)
    //       console.log(c)

4.2为对象进行解构赋值

 //2.从对象中获取值
          const tian = {
              age:20,
              sex:'女',
              secret:function(){
                  console.log('ok,that`s no luck with you forever!')
              }
          };
          //花括号里面的内容必须和对象里面的属性一致
       let {age,sex,secret} = tian;
       console.log(age);
       console.log(sex);
       console.log(secret);

5.箭头函数

5.1箭头函数和普通函数

 function haha(){
            console.log(this.name);
        }
        let  haha2 = () => {
            console.log(this.name)
        }

5.2箭头函数的this是静态的且this代表的是函数所在作用域指向的对象，而不是所在的作用域对象。

function haha(){
            console.log(this.name);
        }
        let  haha2 = () => {
            console.log(this.name)
        }
        window.name='lfhy';
        const school = {
              name:'xixi'
        }
         //haha();
         //haha2();
       //说明了箭头函数的this是静态的只在当前的作用域
         haha.call(school)
         haha2.call(school)