javascript(variable/typeof/document/==)

参考地址：https://www.bilibili.com/video/BV1NJ411W7wh?p=153&spm_id_from=pageDriver&vd_source=b3ee5afefa39478cd9bbd4f1ad20acea

1.javascript执行顺序从上往下依次执行
<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8"> //配置引用参数
</head>

<body>
//文字输出
<h1>完美世界</h1>         //输出h1号文字
<p id="object">names</p>  //输入p号文字，引用下面定义的id

<p id="demo">sss</p>
<p id="myDIV">two</p>
<p id="myvar">three</p>
<button onclick="myfunc()">点击按钮获得答案</button>   //button按钮的用法nolick点击调用myfunc函数
<button onclick="myFunction('liaoyue',50)">press this button</button>

<script>                       //script输入命令框架
    function myfunc(){
        document.write("衡大疯子");    //写入文字
}
</script>

<br>

<script>
    let a = 2;             
    let b = a;           //传值
    console.log(a,b);
    a = 3;
    console.log(a,b);     //a会改变，b不会改变
    let c = {name:"jim"};
    let d = c;              //传址，b，c公用一个存储地址
    console.log(d,c)
    d.name = "divide";
    console.log(d,c)      //c,d都会改变
</script>

url：https://www.runoob.com/js/js-let-const.html
<script>
    var b,c;        //定义变量，非全局变量不建议使用var。(全局作用域)（指定函数内除外）（变量声明针对全局解析，没有顺序，后面变量定义需要按照顺序执行）
//函数内是局部变量，函数执行完会被删除。函数外是全局变量，var声明的全局变量
    a = 5;         //a没有通过var声明的是可变全局变量，赋值,(建议不要使用直接赋值)
    b = 6;
    c = 9;
    z = a * (b + c);             //直接运算
    let s = "another one";          //let声明的变量只在let所在的代码块内有效（局部使用，先声明再使用，否则报错）
    const PI = 3.141              //const用于声明一个或多个常量，不能被直接赋值修改和再次声明
    document.getElementById("demo").innerHTML = z;     //定义id函数，输入HTML打印值
    document.getElementById("myDIV").innerHTML = "another \
    one";    //\换行表示
    document.getElementById("myvar").innerHTML = s;
</script>

<p id="variable">variable type list</p>    \\打印参数格式
<script>
    document.getElementById("variable").innerHTML =
        typeof "jim" + "<br>" +
        typeof 342 + "<br>" +
        typeof [1,3,4,5] + "<br>" +
        typeof NaN + "<br>" +
        typeof {name:'john',age:34};    //<br>换行，typeof（类型）打印字符类型，+号：连接作用,NaN为number类型。判断具体类型可以使用instanceof（运算符）
</script>

<p id="agvr">variable type list</p>
<script>
    const n = "another ll";
    document.write(n + "<br>");
    function mydigital(b,c){
        return b*c;                         //b,c为传递参数，函数外部需要进行定义
    }
    document.getElementById("agvr").innerHTML = mydigital(3,4);     //调用函数
    document.write(mydigital(5,4) + "<br>")
</script>

<script>
    var i;
//    var cars = new Array();
    var cars=["Saab","Volvo","BWj"];    //定义对象
    for(i=0;i<cars.length;i++)         //i.length定义字符串长度，cars[*]可以依次答应字符串
    {
    document.write(cars[i] + "<br>");
    }
</script>

<button onclick="this.style.display='none'">点我后我就消失了</button>    //this接收事件的HTML元素
<script>

    var person = {
        firstname: "jim",
        lastname: "hori",
        id: 333,
        fullname : function(){              //function()固定写法，定义函数
            person = "ss"                  //没有声明指定，直接定义，为全局定义
            return this.firstname + " " + this.lastname;   //this指向person对象，因为person对象是fullname方法的所有者
        }
        }
        ;  //定义对象

Object.freeze(person); //锁住变量值，后面重新定义不会被改变

    document.write(person.firstname + "<br>");        //调用变量对象
    document.write(person["lastname"] + "<br>");     //调用变量对象
    document.write(person.fullname() + "<br>");     //调用上面定义的函数

    document.getElementById("object").innerHTML =
    person.firstname + "is his first name" + "<br>" +
    person.lastname + "is his last name";

    var person = null
    document.write(person + "<br>")     //清空变量
</script>

//<p>实例中 <strong>this</strong> 指向了 person2，即便它是 person1 的方法:</p>
<p id="demo"></p>
<script>
var person1 = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}
var person2 = {
  firstName:"John",
  lastName: "Doe",
}
var x = person1.fullName.call(person2); 
document.getElementById("demo").innerHTML = x; 
</script>

<script>
    function myFunction(name,age){   //name and age is parameter,传参
        alert("大傻子" + "is " + name + " " + "and his age is " + age);
    }
</script>

<button onclick="this.innerHTML=Date()">现在的时间是?</button>
<br>
//点击按钮执行 <em>displayDate()</em> 函数

<p id="show">button show?</p>；
<button onclick="functionshow()">is it time now?</button>；  //调用函数
<script>
    function functionshow(){
    document.getElementById("show").innerHTML=Date();          //上面function函数定义名称不能与js保留字符相同，尽可能含有大写字母，便于区分
    }
</script>

<br>

<p id="string"></p>
<script>
    var x = "jim"；
    var y = new String("jim")；
    document.getElementById("string").innerHTML = x===y;     //===为绝对相等，即数据类型与值都必须相等
</script>

<p id="stringo"></p>
<script>
    var x = "jims"；
    var y = new String("jims")；
    document.getElementById("stringo").innerHTML = x==y;   //==等于判断
</script>

<button onclick="this.innerHTML=Date()">现在的时间是?</button>
<br>
<p id="show">button show?</p>
<button onclick="functionshow()">is it time now?</button>
<script>
    function functionshow(){
    document.getElementById("show").innerHTML=Date();
    }
</script>

年龄：<input id="vage" value="30"/>    //调用id函数。并输入赋予value的值，默认值可随意更改。
<p>whether to reach the appropriate age</p>
<button onclick="Myage()">press the button</button>
<p id="Demo">enter information</p>
<script>
    function Myage(){
        var age,voteable;
        age=document.getElementById("vage").value;       //定义变量值
        voteable=(age<18)?"年龄太小":"年龄已达到";          //判断语句定义变量值
        document.getElementById("Demo").innerHTML=voteable;
    }
</script>

</body>

</html>

posted @ 2022-09-14 10:24 JASON_yul 阅读(59) 评论(0) 收藏举报

刷新页面返回顶部

javascript(variable/typeof/document/==)

公告