JS基础：script标签用法、变量基础知识

JS基础：script标签用法、变量基础知识

1.script标签用法

• 如果 script 标签中出现 src 属性,将调用一个外部 js 脚本,并忽略内部代码，如
  <script src="jsfile.js"></script>

• script 标签中添加 async 属性: 可以实现外部的 js 文件与当前的 html 文件的解析同步进行
  <script src="jsfile.js" async></script>

• script 标签中添加 defer 属性: 将会延迟加载外部的 js 文件,直到当前的 html 解析完成
  <script src="jsfile.js" defer></script>

2.变量基础知识

2.1 变量声明

• js中声明变量用 var 关键字，语句结束后需加;
var name="username";
  注：php 不用声明直接用$给变量赋值即可
  $name="username";

2.2 命名规则

（1） 变量名区分大小写（与 php 一致）

var username = "admin";
var userName = "Peter";
// 变量区分大小写, 与php一致
console.log(username); //输出admin
console.log(userName); //输出peter

（2） 函数名也区分大小写（PHP 中函数名不区分大小写）

function a() {
  console.log("Hello a");
}
function A() {
  console.log("Hello A");
}
a(); //输出Hello a
A(); //输出Hello A

2.3 常量的约定

在 JS 中没有常量，但可以参照 PHP 的写法，用大写来约定常量，约定大于配置

// 用大写来约定常量
var PATH = "app/files/";
console.log(PATH);

2.3 变量的更新与重新声明

JS 中的更新直接用“变量名=值”即可

重新声明与变量声明语法相同

ES5 还允许重新声明。ES6 及以上就不允许重新声明了

// 用var关键字声明变量并赋值
var name = "baoyu";
console.log(name);
// 更新变量的值
name = "zhanghao";
console.log(name);
// 重新声明变量并赋值
var name = "lijiang";
console.log(name);

2.4 全局作用域与函数作用域

JS 与 PHP 的作用域是一样的,也有函数和全局,但都不存在块作用域(除了函数以外的大括号就相当于块作用域)

JS可以在函数内访问函数外的变量，这点与PHP是不一样的，PHP中要想使用函数外的变量需使用global关键字引入

// 函数作用域,函数内部声明的变量仅能在函数内使用
function a() {
  var name = "zhangsan";
  console.log(name);
}
a();
// 除函数内声明的变量外，其他任何地方声明的变量都可在全局范围内使用，函数内也可直接调用全局变量,php中要想调用函数外变量需要用global关键字引入函数内，而JS中只要变量在函数调用之前声明并赋值，函数中就可直接调用变量的值
var name = "baoyu";
console.log(name); //输出baoyu
// 相当于块作用域，但实际还是全局作用域
{
  var sex = "man";
}
if (true) {
  var age = 30;
}
console.log(sex); //输出man
console.log(age); //输出30
function b() {
  console.log(name); //输出为全局变量name的最新值
}
b();

2.5 变量声明提升

在JS中变量未定义之前就可以使用了，只不过值为undefined，而PHP中必须先声明变量后才能使用变量，否则报错

// 先访问
console.log(email);
// 后声明及赋值
var email = "admin@php.cn";
// JS变量声明提升：JS访问变量是允许在声明之前访问的，只不过值为undefined
// 上面的代码相当于：
var email; //声明变量
console.log(email); //访问变量
email = "admin@php.cn"; //变量赋值

3.总结

JS与PHP的语法有很多都是一样的，PHP会了JS就很好学了，用法上也基本一致。