JavaScript练习1----变量

最新推荐文章于 2023-04-23 13:04:59 发布

白云深处人家

最新推荐文章于 2023-04-23 13:04:59 发布

阅读量528

点赞数

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

本文链接：https://blog.csdn.net/u014314578/article/details/52351197

版权

JavaScript 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

JavaScript在经历了各个版本之后，已经到了ES6了，很令人兴奋，本人也开始了从原来稍微学点JavaScript开始，到目前的开始由浅及深的学习它了，开此博客以记录学习进程。

var声明和使用

var a;//使用var定义变量
console.info(a); //undefined,变量在未赋值的情况下是undefined类型
a=12;
console.info(a);//12,此时变量类型是number类型的
a="hello world !";
console.info(a);//hello world ! ,此时变量类型是String的，
//由于javascript是弱类型的语言，因此可以动态改变变量的类型，但是出于安全考虑，不推荐这么使用
function s(){
var message="我是局部变量";
}
console.info(message);//undefined,由于message是个在方法内部中的局部变脸，并且没有外部引用，因此此处结果是undefined
var b=0;//此处b和上文中的a都是全局变量，实际上他们都是全局对象window的一个变量
var m,n,k;//同样，JavaScript允许同时定义多个变量
w=9;
console.info(w);//9，由于类型提升功能，w隐式的定义为 var w=9;
//JavaScript代码在执行过程中，会在当前作用域当中寻找该变量的声明，如果找不到，就往上找，直到顶级声明位置
//若果在顶级声明位置仍然没有找到声明，那么会被在顶级作用域当中隐式声明。
//但是采用严格模式，这样未定义就使用的代码会报错。

let声明

//为了提高javascript代码对变量的管理能力，es6引入了let声明，来表述在代码块中的临时变量
{
  let a=10;
  var b=10;
}
a//报错,由于a用let声明，那么a此时只在它所在的代码块中有效
b//1 var变量返回正确的值

//对于过去的循环计数器，let声明变得更加适合,计数器i不再泄露为全局变量
for(let i=0;i<array.length;i++){
console.info(i);
}
//由于var变量在全局作用域下，所以循环当中使用的var i变量是一个，所以最后循环结束，变量i被覆盖为10
var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 10
//若果使用的是let声明，声明的变量只会在当前的块级作用域下有效，因此每次进入代码块，都会重新声明一个let i变量，所以i不是一个i，因此值不会覆盖，所以最后输出为6
var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 6
//let声明不会发生变量提升
console.info(f);//输出为undefined。变量发生提升了
console.info(b);//报错，变量未定义
var f=2;
let b=2;

//let变量死区
var tmp = 123;
if (true) {
  tmp = 'abc'; // 报错
  let tmp;
}
//全局变量在代码块中临时声明为let，在该代码块中发生死区，在之前的任何对tmp的操作都会发生死区，即无法对该变量操作，此时会报错.
//在代码块内，使用let命令声明变量之前，该变量都是不可用的
//在发生死区的时候，typeof操作会报错（typeof操作符不再是一个百分百安全的操作符了）
typeof undeclaredVariable//如果该变量发生了死区会报错
function fuc(x=y,y=1){
  return x+y;
}
fuc();//报错，x=y这句代码先用到了y，但是y在后面y=1当中才声明，因此会报错
//但如果先声明变量，后使用，就会正确执行
function fuc(x=1,y=x){
  return x+y;
}
fuc();
//变量死区是过去变量乱用导致过多错误的改进，死区会很容易的避免这种情况的发生
// let声明不允许重复声明
function(){
  let a=1;
  let a=2;
}
function(){
  var a=1;
  var a=1;
}
function(a){
  let a=1;
}
//以上三个都会报错,只要发生了let变量的重复声明，都会报错

//let变量好处，防止变量泄露
//类型提升造成的泄露
var t=new Date();
function f(){
  console.info(t);//此处发生了变量提升,t成了外层的变量
  if(false){
    var t="hello world !";//此处t覆盖了t变量
    }
    //退出代码块之后，t被回收
  }
f();//undefined

const声明

const PI=3.14//const声明表示一个制度常量，一旦声明，常量中的值就不能改变
{
  const PI=3.14;//const声明同样只会在所在的代码块有效
}
{
  console.info(PI);//报错，const没有变量提升
  const PI=3.14;
}
var PI=3.14；
function func(){
  const PI=3.14;//报错，const修饰不允许重复声明
}
const obj={};
const arr=[];
obj.a="hello world !";//const修饰仅仅只是引用不能改变，引用的内容可以变更
arr[0]=10;//const修饰仅仅只是引用不能改变，引用的内容可以变更
obj={};//报错，不能修改引用，否则会报错
arr=[];//报错，不能修改引用，否则会报错

变量析构

//以往为变量赋值，只能直接给变量指定值
var x=1;
var y=2;
var z=3;
//现在可以使用解构函数来写(左右两边必须都是可遍历的值)
var [x,y,z]=[1,2,3];//x=1,y=2,z=3
//解构函数可以做到匹配特殊类型的数据
var [x[[y],z]]=[1,[[2],3]];//x=1,y=2,z=3
//也可以只匹配一部分
var [,,z]=[1,2,3];//z=3
//也能够匹配长参数
var [x,y,...z]=[1];//x=1,y=undefined,z=[],没有匹配到值，就是undefined，长参数没有匹配到是空数组
//当两边不能完全匹配的时候，默认匹配到第一个符合的值
var [x,y]=[1,2,3];//x=1,y=2
var [x[[y],z]]=[1,[[2,3],4]];//x=1,y=2,z=4
//解构函数可以使用默认值
var [x,y=2]=[1];//x=1,y=2

//除了数组外，对象也有解构函数,与数组不同之处是不必一一对应，但是名称必须一致
var {x,y}={x:1,y:2};//x=1,y=2
//如果名称不一致，那么需要使用别名
var {x,y:z}={x:1,z:2};//x=1,y=2
//同样对象的解构函数也支持默认值
var {x, y = 5} = {x: 1};//x=1,y=5

var命名建议
s：表示字符串。例如：sName，sHtml；
n：表示数字。例如：nPage，nTotal；
b：表示逻辑。例如：bChecked，bHasLogin；
a：表示数组。例如：aList，aGroup；
r：表示正则表达式。例如：rDomain，rEmail；
f：表示函数例如：fGetHtml
o：表示以上未涉及到的其他对象如:oButton
1：作用域不大临时变量可以简写，如：str，num，bol，obj，fun，arr.
2：循环变量可以简写，比如：i，j，k等