Homework of Baidu front end college on days 17 to 18 and 16

Finally learn JavaScript!

Array related parameters

Array shift deletes the first element, pop deletes the last element, and all returned elements are deleted. unshift adds an element at the beginning, push adds an element at the end, splice is used for deletion and modification, slice is used for slicing.
***

Data type conversion


The + operator of a unary can be used to convert a variable to a number: if the variable cannot be converted, it will still be a number, but the value is NaN (Not a number):

constructor

"Bill".constructor                 // Return "function string() {[native code]}"
(3.14).constructor                 // Return "function number() {[native code]}"
false.constructor                  // Return "function boolean() {[native code]}"
[1,2,3,4].constructor              // Return "function array() {[native code]}"
{name:'Bill', age:62}.constructor  // Return "function object() {[native code]}"
new Date().constructor             // Return "function date() {[native code]}"
function () {}.constructor         // Return "function() {[native code]}"

You can check whether an object is an array function:

function isArray(myArray) {
    return myArray.constructor === Array;
}


You can wrap lines of code in a text string with a backslash.


const keyword is used to declare constants in JavaScript (as opposed to variables, it is not modifiable, but also a "container" for storing information.) , the value of a constant cannot be changed by reassigning and cannot be redeclared.

Even if the variable defines an array format, the data type returned by typeof is still object:

Arrays and objects are objects

if for switch while

if

switch

If default is not the last case in the switch block, remember to end the default case with break.

for

for (statement 1; statement 2; statement 3 / * the third statement is not required * /){
     Code block to execute
}

Statement 1 executes before the loop (code block) begins.

Statement 2 defines the conditions for running the loop (code block).

Statement 3 executes after each execution of the loop (code block).

Typically, you use statement 1 to initialize the variables used in the loop (i = 0).

But that's not always the case, JavaScript doesn't care. Statement 1 is optional.

You can initialize multiple values (separated by commas) in statement 1:

Statement 1 of for loop can have multiple, use, and split

for (i = 0, len = cars.length, text = ""; i < len; i++) { 
    text += cars[i] + "<br>";
}

The for in loop traverses the properties of the object, not the index of the array. Therefore, for in traverses not only arrays, but also objects.

Statement 1 and 3 can be omitted, and statement 2 is optional.

regular expression

// constructor transformation
c="1111";
a=c.constructor===Array;
console.log(a);
// false
// Use search to return address
var a="HELLO world";
b=a.search("wo");
console.log(b);
// 6
// Use replace to modify
b=a.replace("hello","Hello");
console.log(b);
b = a.replace(/hello/i,"nihao");
console.log(b);
// Return to nihao world
// text returns true or something for the search string.
c=/e/i.test("hello world");
console.log(c);
// "hello world" contains e, so it returns true;
console.log(typeof(true));
// exec searches the string through the specified pattern and returns the found text. Returns null if no match is found.
console.log(/e/i.exec("hllo woefr"));
// Return to e
console.log(typeof(/e/i.exec("hellofregt")));
// Return to object

abnormal

function jj(){
    var jieguo=document.getElementById("jieguo");
    jieguo.innerHTML="nihao";
    var input=document.getElementById("input").value;
    try{
        if(isNaN(input)) throw "Not numbers";
        if(input=="") throw "It's empty.";
        input=Number(input);
        if(input<5) throw "Too small";
        if(input>10) throw "too big";
    }
    catch(err){
        jieguo.innerHTML="Input:"+err;
    }
    finally{
        document.getElementById("input").value="";
    }
}

Add, subtract, multiply and divide with job code 1

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">    
    <title>IFE ECMAScript</title>
</head>
<body>        
    <input id="first-number" type="number" value="0" placeholder="First number">
    <input id="second-number" type="number" value="0" placeholder="Second number">
    <button id="add-btn" onclick="jia()">plus</button>
    <button id="minus-btn" onclick="jian()">reduce</button>
    <button id="times-btn" onclick="chen()">ride</button>
    <button id="divide-btn" onclick="chu()">except</button>
    <p id="result">Operation result</p>
    <script>
        function jia(){
            try{
                one=document.getElementById("first-number").value;
                two=document.getElementById("second-number").value;
                // if(isNaN(one)) throw "is not a number";
                // if(isNaN(two)) throw "is not a number";
                console.log("Original"+typeof(one)+one);
                one=parseFloat(one);
                two=parseFloat(two);
                if(isNaN(one)) throw "Not numbers";
                if(isNaN(two)) throw "Not numbers";
                console.log("Result"+typeof(one)+one)
                result=one+two;
                document.getElementById("result").innerHTML="Operation result:"+result;                
            }
            catch(err){
                console.log("input"+err);
            }
            
        }
        function jian(){
            one=document.getElementById("first-number").value;
            two=document.getElementById("second-number").value;
            console.log("Original"+typeof(one)+one);
            one=parseFloat(one);
            two=parseFloat(two);
            console.log("Result"+typeof(one)+one)
            result=one-two;
            document.getElementById("result").innerHTML="Operation result:"+result;
        }
        function chen(){
            one=document.getElementById("first-number").value;
            two=document.getElementById("second-number").value;
            console.log("Original"+typeof(one)+one);
            one=parseFloat(one);
            two=parseFloat(two);
            console.log("Result"+typeof(one)+one)
            result=one*two;
            document.getElementById("result").innerHTML="Operation result:"+result;
        }
        function chu(){
            one=document.getElementById("first-number").value;
            two=document.getElementById("second-number").value;
            console.log("Original"+typeof(one)+one);
            one=parseFloat(one);
            two=parseFloat(two);
            console.log("Result"+typeof(one)+one)
            result=one/two;
            document.getElementById("result").innerHTML="Operation result:"+result;
        }
    </script>
</body>
</html>

Job code 2 conversion binary

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">    
    <title>IFE ECMAScript</title>
    <style>
        input{
            width: 200px;
        }
    </style>
</head>
<body>        
        <input id="dec-number" type="number" placeholder="Enter a decimal nonnegative integer">
        <input id="bin-bit" type="number" placeholder="Enter the number of binary digits after conversion">
        <button id="trans-btn" onclick="jj()">Convert to binary</button>
        <p id="result">Operation result</p>
<script>

function dec2bin(decNumber) {
    // To implement your conversion method here, please note that the input must be a non negative integer.
    try{
        console.log(decNumber);
        if (decNumber<=0||decNumber.constructor!=Number) throw "Input must be a non negative integer";
        var z=decNumber;
        var a=""
        for(var i=0;;i++){
            y=z%2;             
            a=String(y)+a;
           if(z==1){
                break;
            }
            z=parseInt(z/2);
        }
        a=Number(a);
        return a;
    }
    catch(err){
        document.getElementById("result").innerHTML=err;
    }
}
// console.log(typeof(c))
// console.log(c)
// When the implementation party clicks the conversion button, the input decimal number will be converted to binary and displayed in the p tag of the result
// Some codeing
function jj(){
    var c=Number(document.getElementById("dec-number").value);
    d=dec2bin(c);
    // d=new Number(d);
    weishu=document.getElementById("bin-bit").value;
    weishu=Number(weishu);
    long=String(d).length
    console.log(long);
    console.log(weishu);
    if(weishu>=long){
        x=weishu-long;
        for(var i=0;i<x;i++){
            d="0"+String(d);
            // d=Number(d);
        }
    }else{
        d="The number of digits is too small. Please re-enter. The minimum number of digits is:"+long;
        console.log(typeof(d));
    }
    document.getElementById("result").innerHTML=d;
}

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

Convert binary Preview

Add, subtract, multiply, divide Preview
Hit something by yourself

var c=12;
var day
console.log(typeof(c))
if (c!="12"){
    console.log("yes")
}else if (c=='12'){
    console.log("Completely equal")
}
else{
    console.log("no")
}
c= new Date()
console.log(new Date().getDay())
switch(new Date().getDay()){
    // case 0:
    //     day = "Sunday";
    //     break;
    // case 2:
    //     day = "Tuesday";
    //     break;
    // case 3:
    //     day = "Wednesday";
    //     break;
    // default:
    //     day = "not set";
    //     // break;
    case 0:
day = "Sunday";
break;
case 1:
day = "Monday";
 break;
case 2:
day = "Tuesday";
 break;
case 3:
day = "Wednesday";
 break;
}
console.log("Today is"+day);
switch (new Date().getDay()) {
case 0:
day = "Sunday";
break;
case 1:
day = "Monday";
 break;
case 2:
day = "Tuesday";
 break;
case 3:
day = "Wednesday";
 break;
// case 4:
//     day = "Thursday";
//      break;
// case 5:
//     day = "Friday";
//      break;
// case 6:
//     day = "Saturday";
}
console.log("Today is"+day);
var c=["html","css","python","java"] ,d="",i;
for(i=0;i<c.length;i++){
d+=c[i]+"\t";
}
console.log(d);
var text="123";
for(i=0;i<c.length;i++){
text+=c[i]+"\n";
}
console.log(text)
var x;
for (x in c){
console.log("star")
console.log(c[x]);
}
function zixing(){
var b=1;
for(i=0,c=1;i<100;i++){
// console.log("typeof(c)= "+typeof(c));
// console.log("c="+c);
b=1+i;
document.write(b);
document.write("<br>");
// console.log(typeof(b));
}
}
var i=null;
i=0;
while (i<10){
i++;
console.log(i)
if(i===3){
break;
} 
}
var i=null;
i=0;
do{
console.log(i);
i++;
if(i===3){
console.log("hello");
// continue;
break;
}
console.log("completion of enforcement")
}
while(i<10);
console.log("stt")
console.log(i);
i=0;
var list=["hello","world","welcome","to","china"]
biaoqian:{
console.log(list[i]+"\n");
console.log(list[3]+"\n");
i++;
console.log(list[i]+"\n");
break biaoqian;
console.log("after break");
}
console.log("111".constructor)
// var a="111";
// document.getElementById("id").innerHTML=lz(a);
// function lz(sh){
//     return sh.constructor === String;
// }
var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("qq").innerHTML = isArray(fruits);

function isArray(myArray) {
return myArray.constructor === Array;
}
var d=["11","123",["12",'1']];
console.log(d.length);
// c=d.join("*")
d.pop();
d.push("increase");
console.log(d);
d.shift();
console.log(d);
d=null;
d=["hello","world","nihao"];
c=d.shift();
console.log(c+"\n"+d);
c=d.unshift(["11","11"]);
console.log(c+"\n"+d);
console.log(d[0]);
// Delete or add elements through splice;
d.splice(0,1,"xin");
console.log(d);
// concat is used to link elements
dd=["new","element","element"];
console.log(d.concat(dd));
c="111";
console.log(c.length);
// slice() is used for cutting out.
e=dd.slice(1,2);
console.log(e);
var b= new Date();
console.log(b);
console.log("11");
console.log(typeof(b));
bb=b.toDateString();
console.log(bb);
console.log(typeof(bb));
b=b.getDate();
console.log(b);
console.log(typeof(b));
// constructor transformation
c="1111";
a=c.constructor===Array;
console.log(a);
// false
// Use search to return address
var a="HELLO world";
b=a.search("wo");
console.log(b);
// 6
// Use replace to modify
b=a.replace("hello","Hello");
console.log(b);
b = a.replace(/hello/i,"nihao");
console.log(b);
// Return to nihao world
// text returns true or something for the search string.
c=/e/i.test("hello world");
console.log(c);
// "hello world" contains e, so it returns true;
console.log(typeof(true));
// exec searches the string through the specified pattern and returns the found text. Returns null if no match is found.
console.log(/e/i.exec("hllo woefr"));
// Return to e
console.log(typeof(/e/i.exec("hellofregt")));
// Return to object
function jj(){
    var jieguo=document.getElementById("jieguo");
    jieguo.innerHTML="nihao";
    var input=document.getElementById("input").value;
    try{
        if(isNaN(input)) throw "Not numbers";
        if(input=="") throw "It's empty.";
        input=Number(input);
        if(input<5) throw "Too small";
        if(input>10) throw "too big";
    }
    catch(err){
        jieguo.innerHTML="Input:"+err;
    }
    finally{
        document.getElementById("input").value="";
    }
}

Keywords: Javascript ECMAScript Python Java

Added by delphi123 on Sat, 19 Oct 2019 00:30:31 +0300