JavaScript中的ES6语法练习

白云点缀的蓝 · 发表于 2021-5-13 14:16

[Java] 纯文本查看 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
  class a {
    constructor(name,age) {
      this.name=name,
      this.age=age
    }
    speak(){
      console.log(this.name,this.age);
    }
  }
  let a1 = new a("starry","19");
  a1.speak();
  class b {
    constructor(name,age) {
    this.name=name,
    this.age=age
    }
    static isAdult(ages){
      if(ages>18){
        console.log("成年了");
      }else
      {
        console.log("未成年");
      }
      console.log(this.name, this.age);
    }
    speak(){
      console.log(this.name, this.age);
    }
  }

  let b1 = new b("晓红","30");
  b1.speak();
 b.isAdult(29);
 class Class extends b{
   constructor(city) {
     super();
    this.city=city;
   }
  speak() {
    console.log(this.city);
  }
 }
 Class.isAdult(30);
 let class1 = new Class("上海");
 class1.speak();
</script>
</body>
</html>

[Java] 纯文本查看 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    for (var i = 1; i <6 ; i++) {
        console.log(i);
    }
    console.log("外部能输出我吗?");
    if(undefined==i){
        console.log("不能,i="+i);
    }else {
        console.log("能,i="+i);
    }
    for (let k = 1; k <6 ; k++) {
        console.log(k);
    }
    console.log("外部能输出我吗?");
    if(undefined==k){
        console.log("不能,k="+k);
    }else {
        console.log("能,k="+k);
    }
</script>
</body>
</html>

[Java] 纯文本查看 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
  @fun
  class user {
    constructor(name,age) {
      this.name=name;
      this.age=age;
    }
    sayInfo(){
      console.log(this.name, this.age);
    }
  }
  var fun=(target)=>{
    target.city="北京";
  };
  let user1 = new user("星空","20");
  user1.sayInfo();
  console.log(user1.city);
</script>
</body>
</html>

[Java] 纯文本查看 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
  function* f() {
    yield "上海";
    yield "星空";
    yield "月薪过万";
    yield "19岁";
    return "success";
  };
  let hh=f();
  console.log(hh.next());
  console.log(hh.next());
  console.log(hh.next());
  console.log(hh.next());
  console.log(hh.next());
  for (var string of ffff= f()) {
    console.log(string);
  }
  console.log(ffff.next());
  for (let fKey of hh) {
    console.log(fKey);
  }
</script>
</body>
</html>

[Java] 纯文本查看 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
  let arr=["1","2","3","5","7"];
  var arr2=a=> parseInt(a);
  var abc= arr.map(arr1=> parseInt(arr1));
  // var cabc= arr.map(arr2());
  document.write(abc+"<br>");
  document.write(abc.reduce((a,b)=>{
    return a+b;
  }));
  document.write(abc.reduce((a,b,c)=>{
    return a+b+c;
  }));
</script>
</body>
</html>

[Java] 纯文本查看 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
  var a=new Promise((resolve, reject)=>{
  setTimeout(()=>{
    document.write("异步开始了");
    let number = Math.random();
    if(number<0.5){
      resolve("成功了");
    }else {
      reject("失败了");
    }
  },300);

  });
  a.then((mes)=>document.write(mes));
  a.catch((messa)=>document.write(messa));
  document.write("前面的代码已经执行完啦");
</script>
</body>
</html>

[Java] 纯文本查看 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
  var a=new Set();
  a.add("123");
  a.add("456");
  a.add("123");
  a.add("678");
  console.log(a.has("123"));
  console.log(a.has("111"));
  for (const key of a.keys()) {
    console.log(key);
  };
  a.clear();
  console.log(a.keys());
  let map = new Map();
  map.set("name","starry");
  map.set("age","19");
  console.log(map);
  for (const key of map.keys()) {
    console.log(map.get(key));
  };
  let b = map.has("name");
  let b1 = map.has("age");
  let b2 = map.has("aaa");
  console.log(b);
  console.log(b1);
  console.log(b2);
  let map1 = new Map([
    ["name","starry"],
      ["age","19"],]
  );
  console.log(map1.get("name"));
  for (const key of map1.keys()) {
    console.log(map1.get(key));
  }
  const mapaaa = new Map([ ['key1','value1'], ['key2','value2'], ]);
  console.log(mapaaa.get("key1"));;
  let set = new Set([["name","starry1"],["age","191"]]);
  let map2 = new Map(set);
  for (const key of map2.keys()) {
    console.log(map2.get(key));
  }
  function f(map4) {
    for (const key of map4.keys()) {
      console.log(map4.get(key));
    }
  }
  let map4 = new Map([["name","xk"],["age","20"]]);
  f(map4);
  a=()=>{
    return new Set([["name","xingkong"],["age","100"]]);
  }
  let map3 = new Map(a());
  for (const key of map3.keys()) {
    console.log(map3.get(key));
  }
</script>
</body>
</html>

[Java] 纯文本查看 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
  var str="hello starry";
  console.log(str.endsWith("starry"));
  console.log(str.endsWith("abcdfg"));
  console.log(str.startsWith("hello"));
  console.log(str.startsWith("ello"));
  console.log(str.includes("ello"));
  console.log(str.includes("bc"));
</script>
</body>
</html>

[Java] 纯文本查看 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
  var arr=[1,2,3,4,5,6,7];
  document.write(...arr);
  document.write("<br>");
  function f(a,b) {
    return a+b;
  };
  var [a,b]=arr;
 document.write( f(a,b)+"<br>");
 var [b,...c]=arr;
  document.write("b=",b);
  document.write("<br>");
  document.write("c=",c);//c=2,3,4,5,6,7
  document.write("<br>");
  function f2(a,b,c,d,e,f,g) {
    return a+b+c+d+e+f+g;
  };
  document.write( f2(...arr));
  var arr3=[1,2,3];
  var arr4=[4,5,6];
  document.write("<br>");
  document.write(...arr3,...arr4);

</script>
</body>
</html>

[Java] 纯文本查看 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
  function f(a,b) {
    return "和为"+(a+b);
  };
  var f1=(a,b,c)=>{
    return a+b+c;
  }
  var f2=()=>{
    document.write(f1(10,20,30)+"<br>");
  }
  document.write(f(10, 20)+"<br>");
  document.write(f1(10,20,30)+"<br>");
  f2();
  var peson={
    name:"starry",
    age:"16"
  };
  var f3=({name,age})=>{
    document.write(name+"<br>",age+"<br>");
  }
  var f4=({name})=>{
    document.write(name+"<br>");
  }
  f3(peson);
  f4(peson);
</script>
</body>
</html>

[Java] 纯文本查看 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
  // var arr=[1,2,3,4,5,6,7,8,9];
  // var [a,b,c,d,e,g]=arr;
  // console.log(a);
  // console.log(b);
  // console.log(c);
  // console.log(d);
  // console.log(e);
  // console.log(g);
  // var strarr=["a","b","c","d","e","f","g"];
  // var [o,p,q,r,s,t,u]=strarr;
  // console.log(o);
  // console.log(p);
  // console.log(q);
  // console.log(r);
  // console.log(s);
  // console.log(t);
  // console.log(u);
  // var [g]=strarr;
  // var [ll,gg,aa]=strarr;
  // console.log(g);
  // console.log(ll);
  // console.log(gg);
  // console.log(aa);
  // var [g]=arr;
  // var [ll,gg,aa]=arr;
  // console.log(g);
  // console.log(ll);
  // console.log(gg);
  // console.log(aa);
  var abcd={
    name:"starry",
    age:19
  };
  var {name,age}=abcd;
  console.log(name);
  console.log(age);
  var {name:name1}=abcd;
  console.log(name1);
</script>
</body>
</html>

[Java] 纯文本查看 复制代码

import React from 'react';
import styles from './index.css';
import testIpEp from "./testIpEp";
import calculate from "./testIpEp";
import add from "./testIpEp";
export default function Page() {
  return (
    <div>
      <h1 className={styles.title}>Page index</h1>
    </div>
  );
}
@f
class user {
    constructor(name,age) {
        this.name=name;
        this.age=age;
    }
    sayInfo(){
        console.log(this.name, this.age);
    }
}
function f(target) {
    target.city="北京";
}
//不支持箭头函数
var fun=(target)=>{
    target.city="北京";
};
let user1 = new user("星空","20");
user1.sayInfo();
console.log(user.city);
//@T通过@符号进行引用该方法，类似java中的注解
// class User { constructor(name, age = 20)
// { this.name = name; this.age = age; }
// }function T(target) {
//     //定义一个普通的方法
// console.log(target);
// //target对象为修饰的目标对象，这里是User对象
// target.country = "中国";
// //为User类添加一个静态属性country
// }console.log(User.country); //打印出country属性值
//@T
// class Class {
//     constructor(name,age) {
//         this.name=name;
//         this.age=age;
//     }
// }
// function T(tar) {
//     tar.city="上海"
// }
// let class1 = new Class("星空","19");
// console.log(class1.age, class1.name, class1.city);
console.log(calculate.add(1, 2, 3));
console.log(calculate.mul(2,2,3));

[Java] 纯文本查看 复制代码

class calculate {
    constructor() {
    }
    static add(a,b,c){
        return a+b+c;
    }
    static mul = (a,b,c)=>{
        return a*b*c;
    }
}
export default calculate;

白云点缀的蓝 · 发表于 2021-6-13 18:16

@Shark恒帖子有个点评是灌水广告，麻烦处理一下

Shark恒 · 发表于 2021-6-13 18:22

starry、星空发表于 2021-6-13 18:16
@Shark恒帖子有个点评是灌水广告，麻烦处理一下

已处理，感谢反馈

ImnxBAtW · 发表于 2022-3-1 04:14

感谢楼主

WGIJlqH · 发表于 2022-3-8 09:59

谢谢分享

Idiptygh194 · 发表于 2022-3-27 19:20

谢谢分享

tiEo943 · 发表于 2022-4-2 22:58

感谢楼主

omgTsQ6917 · 发表于 2022-4-2 23:14

谢谢分享

uYE05 · 发表于 2022-4-15 17:41

感谢楼主

UpjaxeJ67380 · 发表于 2022-4-20 09:16

太好了，我看看，谢谢！

		自动登录	找回密码
密码			立即注册

[其他] JavaScript中的ES6语法练习

评分

点评