变量与常量的区别
1.变量
一.蛇形:user_name ,多单词之间用下划线,用在常量。
二.驼峰:userName,getUserName , 第二个单词首字母大写,用在变量、函数
三.大驼峰:UserName,帕斯卡命名,用在类/构造函数
变量的声明 let
声明不赋值, 默认就是undefined;第一次赋值,有一个清新的叫法,初始化
第二次赋值,更新/修改
let num;
num = 60;
num = 80;
console.log(num);
let禁止重复声明,它解决了一个var一个bug
二合一
let price = 99;
console.log(price);
2.常量
就是在代码执行期间不允许更新数据
声明时必须赋值
声明用const
const APP_NAME = "在线商城";
console.log(APP_NAME);
只有和同类型的数据,他们之间的运算才有意义
console.log(100 * "hello");
console.log(100 + 40);
console.log("hello" + ",未来");
输出:
函数的种类与参数类型
对于重复的计算过程,应该考虑用函数进行封装,实现”代码重复”
let num1 = 3;
let num2 = 5;
let total = 0;
total = num1 + num2;
console.log("total=", total);
num1 = 6;
num2 = 10;
total = num1 + num2;
console.log("total=", total);
" class="reference-link">输出:
function,函数声明的关键字
sum1: 函数名称
(num1 ,num2) 参数列表
(12,34):调用参数,实际参数(实参),与上面的参数列中的参数一一对应
function sum1(num1, num2) {
let total = 0;
total = num1 + num2;
console.log("total=", total);
}
sum1(12, 34);
sum1(5, 22);
第二个声明
参数不足,给函数设置默认参数来解决
console.log("---------");
sum1(20);
function sum2(num1, num2 = 0) {
let total = 0;
total = num1 + num2;
console.log("total=", total);
}
参数过多用rest参数,将所有参数压缩到一个数组中
console.log("-------");
function sum3(...args) {
console.log(args);
数据求和
第一种求和 args[0]+args[1]+…..
第二种求和 循环 for()…
引用求和
…:用在函数的形象中,就是rest,归并操作,压到一个数组中
…:用在函数的调用参数中,就是扩展/展开,spread
console.log(
"total =",
args.reduce((p, c) => p + c)
);
}
const arr = [10, 20, 30, 40, 50, 60];
sum3(...arr);
>
匿名函数:没有匿名名称
匿名函数有两种,第一种是一次性的叫立即调用函数,iifee
console.log("------------");
一次性数组
(function (a, b) {
console.log(a + b);
})(10, 50);
如果这个匿名函数不是一次性的,应该使用”函数表达式”
let add = function (a, b) {
return a + b;
};
console.log(add(40, 50));
作用域与闭包的关系与实现
作用域有两种:全局作用域,函数作用域
函数外面叫全局作用域,函数里面叫函数作用域
函数外面与里面的区别
let uesrname = "猪老师";
function demo1() {
函数作用域
console.log(uesrname);
let uesrname = "欧阳";
console.log(uesrname);
username 是先在函数内部查询,如果有就直接访问
如果没有,就向上一个作用域查询,一级一级向上,直到全局
全局有username,查询成功,返回 undefiend
作用域链,查询变量用的
函数外部是无法访问到内部的
作用域是单向的
> 由外向内传递,但是由内向外是禁止
闭包
1.父子函数
2.自由变量
父函数
function parent(a) {
子函数
function f(b) {
let c = 6;
return a + b + c;
}
// 返回
return f;
}
这个时候外部调用这个函数parent()会返回 一个函数,此时闭包就产生了
console.log(parent(5));
parent()调用结束,应该将空间和参数全部释放
但是父函数parent中的一个变量a,被它的一个子函数正在引用,所以不能销毁
const f1 = parent(5);
console.log(f1);
console.log(f1(8));
经典闭包场景
n是自由变量,它不属于子函数
let counter = (function (n) {
return function () {
子函数变量只有两种
1.外部参数
2.自己声明的变量
return n++;
};
})(5899);
执行
console.log(counter());
console.log(counter());
console.log(counter());
console.log(counter());
console.log(counter());
console.log(counter());
console.log(counter());
模板字符串与标签函数的使用方式
传统字符串, 多行和表达式变量的混写非常的麻烦
console.log("hello");
let lang = "html\n" + "css\n" + "js";
console.log(lang);
let a = 10,
b = 20;
let res = a + " + " + b + " = " + (a + b);
console.log(res);
输出:
es6使用模板字符串, 可以解决
使用反引来来声明, 不用引用
反引号 ` , 在 esc 键下面
lang = `hello`;
console.log(lang);
lang = `html
css
js`;
console.log(lang);
输出:
使用 ${…} 插值占位符,可以将变量或表达式嵌入到字符串
res = `${a} + ${b} = ${a + b}`;
console.log(res);
输出:
标签函数, 使用模板字符串为参数的函数
alert`hello ${10} ${20} ${30} world`;
console.log`hello ${10} ${20} ${30} world`;
标签函数(第一个参数是字符串字面量组成的数组,从第二个参数起, 是插值表达式)
num: 数量
pricce: 单价
nction total(num, price) {
console.log(num * price);
}
模板字符串参数中的占位符比较多,可以用rest进行归并
sum`计算多个数之和: ${5}${6}${7}${8}${9}`;
function sum(strings, ...args) {
console.log(`${args.join()}之和是 ${args.reduce((p, c) => p + c)}`);
}
输出:
总结
模板字符串: 可以使用插值表达式的字符串
标签函数: 可以使用”模板字符串”为参数的函数
标签函数,就是在”模板字符串”之前加一个标签/标识符,而这个标签,就是一个函数名
标签函数的参数是有约定的, 不能乱写, 第一个是字面量数组,从第二起才是内部的占位符参数