<!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>Document</title> </head> <body> <script> let str = "hello,vue"; console.log(str.startsWith("hello")); // true console.log(str.endsWith(",vue")); // true console.log(str.includes("e")); // true console.log(str.includes("hel")); // true console.log(str.includes("ly")); // false // 1、多行字符串 let ss = `<div> <span>hello, world</span> </div>`; console.log(ss); // 2、字符串插入变量和表达式. 变量名写在 `${}` 中, `${}` 中可以放入 JavaScript 表达式 const person = { name: "hgw", age: 22 } const {name,age} = person; let info = `我是${name}, 今年${age + 10}了`; // 我是hgw, 今年32了 console.log(info); // 3、字符串中调用函数 function fun(){ return "这是一个函数"; } let sss = `哈哈哈哈,${fun()}`; console.log(sss); // 哈哈哈哈,这是一个函数 </script> </body> </html>
运行的效果如下：
<!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>Document</title> </head> <body> <script> // 多个参数时 // var sum = function (a, b) { // c = a + b; // return a + c; // } let sum2 = (a,b) => a + b; console.log(sum2(1,2)); var sum3 = (a, b) => { c = a + b; return a + c; } console.log(sum3(10, 20)) //------------------------------------------------------------------------------ const person = { name: "jack", age: 21, language: ['java', 'js', 'css'] } function hello(person) { console.log("hello," + person.name) } //箭头函数+解构 var hello2 = ({name}) => console.log("hello," + name); hello2(person); </script> </body> </html>
<!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>Document</title> </head> <body> <script> const person = { name: "jack", age: 21, language: ['java','js','css'] } console.log(Object.keys(person)); console.log(Object.values(person)); console.log(Object.entries(person)); // 声明3个对象 const target = { a:1 }; const source1 = { b:2 }; const source2 = { c:3 }; // 把source1、source2中的合在 target中 Object.assign(target,source1,source2); console.log(target); // {a: 1, b: 2, c: 3} // 声明对象简写 const age = 23 const name = "张三" // 传统写法 const person1 = {age: age, name: name}; // 如果属性名 和 属性值变量名一样, 可以如下简写 const person2 = {age,name}; //声明对象简写 console.log(person2); // 对象的函数属性简写 let person3 = { name: "jack", // 以前： eat: function (food) { console.log(this.name + "在吃" + food); }, //箭头函数this不能使用，对象.属性 eat2: food => console.log(person3.name + "在吃" + food), eat3(food) { console.log(this.name + "在吃" + food); } } person3.eat("炸鸡"); person3.eat2("米线"); person3.eat3("鸡蛋灌饼"); // 对象扩展运算符 // 1. 拷贝对象 let personT1 = {name: "Amy", age: 21}; let someone = {...personT1}; console.log(someone); // {name: 'Amy', age: 21} // 2. 合并对象 let ageT = {age: 15}; let nameT = {name:"Amy"}; let personT2 = {name: "张三"} personT2 = {...ageT, ...nameT}; // 如果两个对象的字段名重复, 后面对象字段值会覆盖前面对象的字段值 console.log(personT2); // {age: 15, name: 'Amy'} </script> </body> </html>
<!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>Document</title>
</head>
<body>
<script>
let str = "hello,vue";
console.log(str.startsWith("hello")); // true
console.log(str.endsWith(",vue")); // true
console.log(str.includes("e")); // true
console.log(str.includes("hel")); // true
console.log(str.includes("ly")); // false
// 1、多行字符串
let ss = `<div>
<span>hello, world</span>
</div>`;
console.log(ss);
// 2、字符串插入变量和表达式. 变量名写在 `${}` 中, `${}` 中可以放入 JavaScript 表达式
const person = {
name: "hgw",
age: 22
}
const {name,age} = person;
let info = `我是${name}, 今年${age + 10}了`; // 我是hgw, 今年32了
console.log(info);
// 3、字符串中调用函数
function fun(){
return "这是一个函数";
}
let sss = `哈哈哈哈,${fun()}`;
console.log(sss); // 哈哈哈哈,这是一个函数
</script>
</body>
</html>