美文网首页Web开发
JS:定义变量的var、let有何操作?(360°无死角)

JS:定义变量的var、let有何操作?(360°无死角)

作者: 以气御码 | 来源:发表于2020-07-09 09:24 被阅读0次

进入我的主页,查看更多JS的分享!
我的代码有多短,本篇内容就有多短!

最近话不多,直接看代码和结果好伐?

一、var

定义:

//一般情况
var word = "Hello World";
console.log(word);
//输出:Hello World

//变量提升?
console.log(word);
var word = "Hello World";
//输出:undefined

//变量提升!
word = "哈哈哈";
console.log(word);
var word = "Hello World";
//输出:哈哈哈

//所谓的全局变量,已经在window对象上了
var word = "Hello World";
console.log(window.word);
//输出:Hello World

//不写var
word = "Hello World";
console.log(word);
console.log(window.word);
//输出:
//Hello World
//Hello World

函数:

//一般情况
var word = "Hello World";
function PLAYFULHD() {
  console.log(word);
}
PLAYFULHD();
//输出:Hello World

//变量提升?
PLAYFULHD();
var word = "Hello World";
function PLAYFULHD() {
  console.log(word);
}
//输出:undefined

//变量提升?
PLAYFULHD();
function PLAYFULHD() {
  console.log(word);
}
var word = "Hello World";
//输出:undefined

//变量提升!
word = "嘿嘿嘿";
PLAYFULHD();
function PLAYFULHD() {
  console.log(word);
}
var word = "Hello World";
//输出:嘿嘿嘿

//不写var
word = "Hello World";
function PLAYFULHD() {
    var word = "嘿嘿嘿";
    console.log(word);
}
PLAYFULHD();
console.log(word);
//输出:
//嘿嘿嘿
//Hello World

重复定义:

//重复定义1
var word = "Hello World";
console.log(word);
var word = "哦吼吼";
console.log(word);
//输出:
//Hello World
//哦吼吼

//重复定义2
var word = "Hello World";
console.log(word);
function PLAYFULHD() {
    var word = "哦吼吼";
    //let word = "哦吼吼"; //效果一样
    console.log(word);
}
PLAYFULHD();
console.log(word);
//输出:
//Hello World
//哦吼吼
//Hello World

总结:

  • 全局变量:指变量在函数外定义, 网页中所有脚本和函数均可使用;当页面关闭后销毁
  • 局部变量:指变量在函数内定义,重复定义了相同的变量并不改变全局变量的值;当函数执行结束后销毁;
  • 变量提升?只要存在赋值的操作,就能直接使用,其实可以理解为默许了没有var就可以定义变量;
  • 一般在定义全局变量时,放在script标签下的最前面,且局部变量的命名不和全局变量重复;
  • 对于数组和对象,和原始类型的情况不一样,下面是执行代码:(数组和对象的情况类似)
//正常情况
arr = ["HHHH"];
console.log(arr);
var arr = ["哈哈哈", "嘿嘿嘿", "哦吼吼"];
//输出:["HHHH"]

//直接报错
arr[0] = "HHHH";
console.log(arr);
var arr = ["哈哈哈", "嘿嘿嘿", "哦吼吼"];
//输出:Uncaught TypeError: Cannot set property '0' of undefined

二、let

必须先定义,再使用;其它情况同var

//直接报错
word = "哈哈哈";
console.log(word);
let word = "Hello World";
//输出:Uncaught ReferenceError: Cannot access 'word' before initialization

//不绑定到window
let word = "Hello World";
console.log(word);
console.log(window.word);
//Hello World
//undefined

三、总结

  • var是全局变量,在window对象上可以访问到
  • var:定义时可以不加,直接进行赋值操作
  • let:定义的语句必须先声明,否则报错;不在window对象上
  • 局部定义的变量,即函数内,在执行完毕后就销毁,注意匿名函数也是如此
  • const与let相似,定义的语句必须先声明

有补充请在评论区留言。


相关文章

  • JS:定义变量的var、let有何操作?(360°无死角)

    进入我的主页,查看更多JS的分享!我的代码有多短,本篇内容就有多短! 最近话不多,直接看代码和结果好伐? 一、va...

  • js问题

    js中let和var定义变量的区别,主要体现在作用于的不同。 var定义的变量是全局变量或者函数变量。 let定义...

  • js使用const声明常量

    js定义变量有三种方式:var、let、const var定义的变量可以修改,如果不初始化会输出undefined...

  • 关于JS中的定义变量

    js-变量定义关键字const,var,let var定义的变量可以修改,如果不初始化会输出undefined,不...

  • ES6总结

    let和const,var特点:let有块作用域,不能重复定义,没有变量提升var没有块作用域,能重复定义,有变量...

  • let 和 const;函数默认参数

    let let 和 var 一样, 也是是用来定义变量的。如 let 与 var 的区别 let 定义的变量的作用...

  • js中的let和var

    [toc] js中let和var区别 1. 作用域不同 let定义的变量作用域仅限于定义该变量的代码块中。比如:i...

  • js 2022经典面试题汇总

    1.JS数据类型有哪些 2.var、let、const区别 var存在变量提升,而let、const没有 let、...

  • 前端面试题整理

    针对js的问题 let 和 var的区别是什么var声明的变量都是全局变量,不存在局部变量,有变量提升;let可以...

  • let、var的区别

    var定义的变量没有块的概念,let则有块的概念; var可以跨块访问,let则不能跨块访问; var有变量提升,...

网友评论

    本文标题:JS:定义变量的var、let有何操作?(360°无死角)

    本文链接:https://www.haomeiwen.com/subject/uhcjcktx.html