JS学习之变量、函数、数组、对象、作用域及闭包
程序员文章站
2022-04-05 12:50:28
...
JS学习之变量、函数、数组、对象、作用域及闭包
变量有数值(number)、字符串(string)、布尔值(boolean)、undefined 、 null
引用类型有:数组array、对象object、函数function三种
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>初识js</title>
</head>
<body></body>
<script>
// 变量
let myName = "zhangDeng";
console.log(myName);
// alert
//alert(myName);
let price = 99;
console.log(price);
// 变量有数值(number)、字符串(string)、布尔值(boolean)、undefined 、 null
// 引用类型有:数组array、对象object、函数function三种
// 数组
const price1 = [33, 44, 55, 66];
console.log(price1[0], price1[1]);
// 对象
const shop = {
name: "京东便利店",
room: 150,
price: 8899,
};
console.log(shop.name, shop.price, shop.room);
const shop1 = {
"my name": "京东便利店",
"my-room": 150,
};
console.log(shop1["my name"]);
// 实际开发过程中数组和对象结合使用
const shop2 = [
{ name: "饼干", num: 2, price: 3.5 },
{ name: "面包", num: 4, price: 4.5 },
{ name: "水果", num: 6, price: 7 },
];
console.log(shop2);
// 函数
function getTotal(name) {
return "hello" + name;
}
console.log(getTotal("张老师"));
// typeof是返回判断变量类型;
console.log(typeof getTotal);
console.log(getTotal.name);
console.log(getTotal.length);
// 数组里包含函数
const arr = [
123,
"bbb",
[1, 2, 3, 4],
{ a: 1, b: 2, c: 3 },
function age() {
console.log("my age is 33");
},
];
console.log(arr[0]);
console.log(arr[4]());
// 封装函数 对于重复使用的代码,可以考虑封装,实现复用
function sum(num1, num2) {
let total = 0;
total = num1 + num2;
console.log("total=", total);
}
sum(2, 3);
// 胖箭头
// 1.如果执行语句只有一条,可以不写大括号;
// 2.如果参数只有一个,可以不写参数外部的括号;
// 3。如果没有参数,括号必须写
add = () => 11 + 3;
console.log(add());
// 全局变量,函数可以从外向内传递,无法由内向外传递
// 闭包练习 满足两个条件: 父子函数及*变量
//父函数
function p(n) {
// 子函数
function m() {
return n++;
}
// 返回子函数
return m;
}
// 声明父函数
const r = p(10);
// 返回
r();
console.log(r());
console.log(r());
console.log(r());
console.log(r());
// 经典闭包IIFE;
let jishu = (function (i) {
return function () {
return i++;
};
})(99);
console.log(jishu());
console.log(jishu());
console.log(jishu());
console.log(jishu());
console.log(jishu());
</script>
</html>
上一篇: layui 获取下拉框被选中的值