本文共 2310 字,大约阅读时间需要 7 分钟。
目录
1.变量
var let const
var类型语法要求不严格;
1)对象、数字、字符、数组……都可以赋给var
例如:
2)var中允许出现同名变量 ,后面的会覆盖前面的
let类型要求严格
const常量(定义的值不能被改变)
解构赋值
1)对象的解构赋值
语法:let {属性名1,属性名2,...} = {属性名1:属性值1,属性名2:属性值2...}
要求:
要求解构后的属性名和对象中的属性名保持一致
如果找不到对应的属性返回undefined
例如:let {name,age,height} = {name:"张三",age:20,height:180,weight:120,address:"西安"};
2)数组的解构赋值
语法: let [变量名1,变量名2...] = [值1,值2...]
说明: 默认情况下会从头到尾依次赋值即变量1对应值1,变量2对应值2……
let [a,b,c] = [23,5,7]; a=23 , b=5 , c=7;
如果想给指定变量赋值,用逗号占位
let [a,,b] = [23,5,7]; a=23 , b=7; 此时5没有对应的;
解构赋值可以做参数
例如:function show({name,color}){
alert("name=" + name);
alert("color=" + color);
}
let dog = {name:"旺财",age:5,color:"黑色"};
show(dog);
2.模板语法
模板语法简化输出使用反单引号,不用拼接字符串
``:作为空分隔符,里面放字符串 ${}:用来渲染变量
<script>
var person = {name:"张三",age:20,gender:"男"};
// alert("姓名是:" + person.name + ",年龄是:" + person.age + ",性别是:" + person.gender);非模板语法
alert(`姓名是:${person.name},年龄是${person.age},性别是${person.gender}`);//模板语法
</script>
3.箭头函数
<script>
//正常函数:
var add = function(a, b){
alert(a + b);
}
//箭头函数:
// var add = (a, b) => {alert(a + b);};
// add(2, 5);
1)当只有一条js代码时大括号可以省略
// var sub = (a, b) => alert(a - b);
// sub(2, 5);
2)当只有一个参数时,小括号可以省略, 如果没有参数时小括号不能省略
// var p = a => alert(a * a);
// p(9);
3) 如果没有大括号,会自动返回运算的结果,如果添加return会报错
// let mul = (a, b) => a * b;此时 let mul等价于 =(a,b)=>{return (a*b)};
// let result = mul(7, 8);
// alert(`result=${result}`);
4)箭头函数不能做构造函数,因为箭头函数中的this默认指向window对象
//window对象也称为上下文对象(Person所在的环境)
let Person = (name, age) => {this.name = name;this.age = age;}
var person = new Person("张三",20); alert(person.name); alert(person.age);
</script>
4.对象:
<script>
let name = "张三";
let age = 20;
let gender = "女"
//当属性名和属性值对应的变量名相同时可以省略变量名
let person = {name,age,gender,eat(){alert("吃")}};//简写形式
let person = {name:"name",age:"age",gender:"gender",eat(){alert("吃")}};//正常写法
console.log(person);
person.eat();
</script>
</head>
<body>
<!-- html中,属性名和属性值一样时,属性值可以省略 -->
<input type="checkbox" name="hobby" value="篮球" checked />篮球
<input type="checkbox" name="hobby" value="足球" disabled />足球
<input type="checkbox" name="hobby" value="羽毛球" />羽毛球
</body>
可变参数
<script>
可变参数语法:...变量名
可变参数实质: 数组
可变参数传递实参时可以离散的传值
函数中如果有多个参数时,可变参数必须放到所有参数的后面
一个函数中只能有一个可变参数
var add = (name,...array) => {
let sum = 0;
for(let i of array) {
sum = sum + i;
}
alert(sum);
alert(name);
};
add("张三",1,2,3);
</script>
转载地址:https://blog.csdn.net/qq_52807480/article/details/119717042 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!