JavaScript基础之规范和格式(var,const,let)

HTML中引用JavaScript

JavaScript一般使用在HTML中,HTML 中的脚本必须位于 <script></script**>** 标签之间。脚本可被放置在 HTML 页面的 <body><head> 部分中。

如下:

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript">
          //脚本
        </script>
    </head>
<body>
</body>
</html>

但是有时候问了方便管理,将脚本单独放在一个js文件中,然后通过引用进行调用。

// 脚本文件在放在 /test.js

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src='/test.js'>
        </script>
    </head>
<body>
</body>
</html>

这个时候就有两个疑问,第一如果又引入js文件以及在脚本中都有,那运行那个?

// 创建一个test.js
document.write("<h1>这个是src导入的js文件</h1>");

现在用html调用。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<script type="text/javascript" src='test.js'>
document.write("<h1>script内部调用</h1>");
</script>

</head>
<body>
	
</body>
</html>

在这里插入图片描述

可以看出src导入引出的优先与script内部写的脚本。在script标签中,两者一般也不会一起用,而且其很多时候在标签内两者都可以放多个。

格式和规范

注释,JavaScript中也会又注释,其用的是 //.

// 单行注释

/*
多行注释
*/

变量声明

变量名和其他语言一样,其有些特殊 比如function,var的不可用于命令。

命名方法: 小驼峰式命名法(不在讲解,编程语言中都会涉及)。想了解可以读:他人对命令规范的总结

变量类型如何声明?

在JavaScript中变量类型简单理解可以其类型是后面数据决定的,而变量名前面不会像是java或者C中那样提前给编译器一个信息要春初什么数据。

a=123;//存储的就是一个数字类型

a="123";//存储的是一个字符串

var,const和let

虽然不会声明变量的时候不会声明类型,但是前面还是又其关键字的,其中就是var,const和let三个。

首先对其进行个简单概述:

不适用关键字,其代表是全局变量,可以被任何地方引用。
使用var声明的变量,其作用域为该语句所在的函数内,且存在变量提升现象(提升只是在所在作用域提升而不是提升作用域的范围);
使用let声明的变量,其作用域为该语句所在的代码块内,不存在变量提升;
使用const声明的是常量,在后面出现的代码中不能再修改该常量的值。
//直接在全局中使用的话,没有什么区别
a=12;
console.log(a)// 可以输出12

var a=12;
console.log(a)// 可以输出12

看似没有什么区别,但是前面还提到了一个变量自动提升,下面看区别:

console.log(b); b=23;

在这里插入图片描述

console.log(c); var c=23;

在这里插入图片描述

上面可以看出var声明的变量会自动升级,而不像是没用使用var那样报错,说明c 这个变量声明存在被提前了,只是没有赋值而已。(后面聊 预编译)

现在看一下全局变量的意思。

//如果使用一个简单的花括号,似乎使用中没有什么区别。
{
    
    
    a=12;
}
console.log(a);// 可以输出12

{
    
    
    a=12;
}
console.log(a)// 可以输出12


//如果使用在方法中,会有区别的

function test(){
    
    
    a=12;
}
test();
console.log(a);// 可以输出12


function test() {
    
    
   var  a=12;
}
test();
console.log(a);// Uncaught ReferenceError: a is not defined


所以一般声明的时候尽可能的带有关键字,毕竟将所有的变量放在全局中会影响性能,而const和let关键字是对var关键字的范围更严格。

//用花括号。
{
    const a=12;
}
console.log(a);// Uncaught ReferenceError: a is not defined

{
   let a=12;
}
console.log(a)// Uncaught ReferenceError: a is not defined

//可以看出const和let定义的变量,其范围要求更严格,

const 的特性和 let 完全一样,同一作用域下let和const不能声明同名变量,而var可以,不同的只是:

  • 声明时候必须赋值

在这里插入图片描述

  • 只能进行一次赋值,即声明后不能再修改

在这里插入图片描述

方法

JavaScript的执行顺序是由上而下执行的。比如:

function test(){
   console.log( "执行test");
}
function test1(){
     console.log( "执行test1");
}

test1();
test();
// 因为调用方法顺序即使运行的顺序

还可以类似与变量方式一样声明方法:

var testA =function(){
    
}
或者
var testB =function testC(){
    
}

前者还可以容易理解,后面一种感觉方法有两种方法名,如果调用的话:

在这里插入图片描述

可以看出第二种只能用var 后面的变量名进行调用。

在这里插入图片描述

方法中的name属性可以看出第二种是=后面的名字。

这个时候又有了一个以为为什么方法会有属性?

JS 里, 函数也是对象, 是 Function 的实例。(详情的话后面原型链中聊)

Guess you like

Origin blog.csdn.net/u011863822/article/details/120704694