實用:javascript語言基礎語法

// this is hello world 註釋單行

/**
 * 註釋多行:1
 * 註釋多行:2
 * 註釋多行:3
*/

str = " "
str = "hello world"//聲明帶初始化賦值操作

console.log(str/*字符串註釋*/)
//a;//拋異常,只聲明不行,必須帶賦值
a = 0; //在全局作用域聲明並賦值
console.log(a)

var b; //提升作用域,相當於在第一行就聲明瞭這個b變量,但並沒有賦值
console.log(b)
var b = 2;//提升作用域並賦值
console.log(b)

console.log(c,d)//此處由於下一行中的var提前聲明瞭c,d兩個變量可以訪問但沒有定義值
var c;var d//提升作用域,相當於在第一行就聲明瞭這個b,c變量,但並沒有賦值
var c = 100;var d = 200
console.log(c,d)

let e;//並沒有提升作用域
console.log(e)
let f = 200//聲明並賦值,建議使用
console.log(f)
// let e = 200 e聲明一個塊作用域的局部變量,重複會拋異常
// console.log(e)

const haha = 'hello'//聲明一個常量,必須聲明時賦值,之後不可修改
//haha = 'hello2' 不可修改
console.log(haha)


function hello()
{
    var a1 = 300;
    let b1 = 400;
    console.log(a1,b1)
}
hello()
//console.log(a1) 拋異常
//console.log(b1) 拋異常

運行結果:

hello world
0
undefined
2
undefined undefined
100 200
undefined
200
hello
300 400

類型轉換:

//類型轉化
//弱類型
console.log('=====str=====')
console.log(a = 3 + 'python')
console.log(a = 3 + 'python',typeof(a))
console.log(a = null + 'python',typeof(a))
console.log(a = undefined + 'python',typeof(a))
console.log(a = true+ 'python',typeof(a))

//數字
console.log('=====num=====')
console.log(a = null + 8,typeof(a))
console.log(a = undefined + 8,typeof(a))
console.log(a = true + 8,typeof(a))
console.log(a = false + 8,typeof(a))

//boolean布爾值
console.log('=====bool====')
console.log(a = null + true,typeof(a))
console.log(a = null + false,typeof(a))
console.log(a = undefined + true,typeof(a))
console.log(a = undefined + false,typeof(a))
console.log(a = null & true,typeof(a))
console.log(a = undefined & true,typeof(a))

//短路
console.log('=====短路=====')
console.log(a = null && true,typeof(a))
console.log(a = false && null,typeof(a))
console.log(a = false && 'js',typeof(a))
console.log(a = true && 'js',typeof(a))
console.log(a = true && '',typeof(a))

//null
console.log('=====null=====')
console.log(a = null + undefined,typeof(a))

運行結果:

=====str=====
3python
3python string
nullpython string
undefinedpython string
truepython string
=====num=====
8 'number'
NaN 'number'
9 'number'
8 'number'
=====bool====
1 'number'
0 'number'
NaN 'number'
NaN 'number'
0 'number'
0 'number'
=====短路=====
null 'object'
false 'boolean'
false 'boolean'
js string
 string
=====null=====
NaN 'number'

改進:

//+Infinity 正無窮
//-Inifinity 負無窮
//NaN not a number 非數字
//0b,0o,0x,分別代表二進制,八進制,十六進制
//1E3 代表1*10的3次方,2E-2,代表2*10的-2次方
console.log(-1/0)//雙精度,顯示負無窮
console.log(1/22)//高精度顯示
console.log(2/2)

var big = Number.MAX_VALUE;
var small = Number.MIN_VALUE;
var inf = Number.POSITIVE_INFINITY;
var neginf = Number.NEGATIVE_INFINITY;
var nonum = Number.NaN
console.log(big,small,inf,neginf,nonum)

n1 = Number.parseFloat('13.14')
n2 = Number.parseInt('520')
console.log(n1,n2)
n3 = Number.isFinite(Math.PI) //判斷是否爲有限數字
console.log(n3)
n4 = Number.isInteger(Math.PI) //判斷是否爲整型
n5 = Number.isNaN('abc') //判斷是否爲非數字
console.log(n4,n5)

n6 = Math.abs(-1.001) //取絕對值
console.log(n6)
n7 = Math.max(3,1,8)
console.log(n7)


i = 0;
i = i + 1;
console.log(i)
i++
console.log(i)

let b1 = 0;
a1 = b1++ //let a1 = b1;b1=b1+1
console.log(a1,b1)

let b2 = 0;
a2 = ++b2 ;//let b2 = b2 +1;a2 = b2
console.log(a2,b2)

let b3 = 0;
a3 = b3++;//b3 = 0;a3 = 0 ====> a3 = 0;b3 = 1 
console.log(a3,b3++)//打印:a3=0;b3=1 ====> 實際值:a3=1;b3=2
console.log(b3)



delete i
//經典面試題
i = 0
let n = ++i+i+++i+++i;
//分解:單目運算符優先級高於雙目運算符
//++i+i+++i+++i = (++i) + (i++) + (i++) + (i)
//i=0;(++i) + (i++) + (i++) + (i)
//     1    +   1   +   2   +  3
//i=   1        2       3 
console.log(n)


console.log(1,100 > '200') //false,'200'被轉化爲數字
console.log(2,300 > '200') //true
console.log(3,300 > '2000') //false
console.log(4,3000 > '2a') //false,‘2a’被轉化爲NaN
console.log(5,3000 > NaN) //不管大於小於都是false
console.log(6,'3000' > '2000') //true
console.log(7,3000 > Number.NaN)
console.log(7,3000 > Number.POSITIVE_INFINITY)
console.log(7,3000 > Number.NEGATIVE_INFINITY)

//寬鬆比較
console.log(8,300 == '300') //true,做了隱式類型轉換
console.log(9,'200' == '200') //true

//嚴格比較 ===
console.log(10,300 === '300') //false,沒做隱式轉換,類型不一致就返回false
console.log(11,'200' === '200') //true

//三目運算符
console.log((3>30)?'yes':'no')

//逗號表達式
console.log('1============================')
let a=1,b=2,c=(3>30)?'yes':'no'
console.log(a,b,c)

a = new String('abc')
console.log(b instanceof String)

b = new Number(123)
console.log(b instanceof Number)

console.log('2============================')
console.log(typeof(a))
console.log(typeof(100))
console.log(typeof(typeof(100)))
console.log(typeof('abc') == 'string')
console.log('3============================')



let student1 = 1;
var student2 = 2;
student3 = 3;
eval('var student4 = 4')
console.log(student1,student2,student3,student4)

var trees = new Array('a','b','c','d')
delete trees[3]//索引位置設置爲undefined,長度還是保持4
console.log(trees[3])//undefined
console.log(trees)//打印a,b,c
trees[3] = 'd'
console.log(trees)//打印a,b,c,d

console.log('4============================')
console.log(0 in trees)
console.log(3 in trees)
console.log(6 in trees)
console.log('length' in trees)
console.log('a' in trees)
console.log('5============================')
delete trees[3]
for (var i=0;i<trees.length;i++)
    console.log(trees[i]);
console.log('6============================')
//自定義對象
let mycar = {
    'var1':1,
    'var2':2,'var3':3
}
console.log('var1' in mycar);
console.log('var2' in mycar);
console.log('7============================')

function* inc(){
    let i = 0;
    while (true){
        yield (++i);
    }
}
g = inc()
console.log(g.next())
console.log(g.next())
console.log(g.next().value)
console.log('8============================')

function* inc2(){
    let i2 = 0;
    let j2 = 3;
    while (true){
        yield i2++;
        console.log(j2)
        if (!j2--) return 100;
    }
}
let gen = inc2()
for (let i=0;i<6;i++){
    console.log(gen.next());
}

console.log('9============================')

delete student3,student4
delete student1,student2
console.log(student1,student2)//student1和student2都沒有刪除
console.log(student3,student4)//student3和student4都成功被刪除

運行結果:

-Infinity
0.045454545454545456
1
1.7976931348623157e+308 5e-324 Infinity -Infinity NaN
13.14 520
true
false false
1.001
8
1
2
0 1
1 1
0 1
2
7
1 false
2 true
3 false
4 false
5 false
6 true
7 false
7 false
7 true
8 true
9 true
10 false
11 true
no
1============================
1 2 'no'
false
true
2============================
object
number
string
true
3============================
1 2 3 4
undefined
[ 'a', 'b', 'c', <1 empty item> ]
[ 'a', 'b', 'c', 'd' ]
4============================
true
true
false
true
false
5============================
a
b
c
undefined
6============================
true
true
7============================
{ value: 1, done: false }
{ value: 2, done: false }
3
8============================
{ value: 0, done: false }
3
{ value: 1, done: false }
2
{ value: 2, done: false }
1
{ value: 3, done: false }
0
{ value: 100, done: true }
{ value: undefined, done: true }
9============================
1 2
Error: 
/home/yzx/Desktop/新建文件夾/node_8253235d89a5d.tmp:170
console.log(student3,student4)//student3和student4都成功被刪除
            ^

ReferenceError: student3 is not defined
    at Object.<anonymous> (/home/yzx/Desktop/新建文件夾/node_8253235d89a5d.tmp:170:13)
    at Module._compile (internal/modules/cjs/loader.js:776:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10)
    at Module.load (internal/modules/cjs/loader.js:653:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
    at Function.Module._load (internal/modules/cjs/loader.js:585:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:829:12)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)

案例:(ES6中塊作用域的概念)

//列表解構
var array1 = ['a1','a2'];
var array2 = ['b1',...array1,'b2'];
console.log(array2)

//參數解構
function fn(x,y,z){
    console.log(x+y+z)
}
var args = [2,3,4]
fn(...args)
console.log('------------')

//語句塊作用域
function hello(){
    let a = 1;
    var b = 2;
    c = 3;
}

let d = 100
if (1){
    let d = 4;
    var e = 5;
    f = 6;
    if (true) {
        console.log(d)
        console.log(e)
        console.log(f)
        console.log('------------')
        g = 10
        var h = 11
    }
}

// console.log(a) //不可見
// console.log(b) //不可見
// console.log(c) //不可見
console.log(d) //塊作用使用let,不可見,但是塊外的d可見
console.log(e)
console.log(f)
console.log(g)
console.log(h)

運行結果:

[ 'b1', 'a1', 'a2', 'b2' ]
9
------------
4
5
6
------------
100
5
6
10
11

案例:

i = 0
while (true){
    if (i==1){
        console.log('=1')
    }
    else if (i==2){
        console.log('=2')
    }
    else if (i==3){
        console.log('=3')
    }
    else {
        console.log(i)
    }
    i++
    if (i==5){
        console.log(i)
        break
    }
}

//False等效,false,undefined null,0.NaN,""  其他值都認爲True

console.log('=========================')
a = 1
switch (a) {
    case 1:
        console.log('1')
    case 2:
        console.log('2')
        break
    case 3:
        console.log('3')
    default:
        console.log('Null');
}

//for 循環
console.log('=========================')
array3 = [1,2,3,4]
for (x=0,y=0;x<array3.length;x++,y+=2){
    console.log(x,array3[x],y)
}

//如果語句塊只有一條語句可以省略大括號

if (user='yzx',passwd='123',passwd=='123') console.log(user);

while (true){ 
    console.log(100)
    break;
}

x = 0
do {
    x += 200
    console.log(x)
}while (x==400)

x = 0
do {
    console.log(x)
}while(x++<3)

//打印九九乘法表
console.log('=========================\n')
for (x=1;x<10;x++){
    str = ''
    for (y=1;y<=x;y++){
        if (y < x){
            str += y+'x'+x+'='+(x*y)+' '
        }
        else{
            str += y+'x'+x+'='+(x*y)
            console.log(str)
        }
    }
}

console.log('=========================')
array4 = [10,20,30,40]

for (x in  array4){
    console.log(x,array4[x])
}

console.log('=========================')
function add(x,y){
    return x+y
}

var obj={p1:100,p2:'abc',p3:[1,2,3],p4:add}
for (x in obj){
    console.log(`${x},${obj[x]}`)
}
console.log(obj.p4(3,4))//對象可用.屬性來訪問

//遍歷數組值
console.log('=========================')
for (x of array4){
    console.log(x)
}

for (x=1;x<10;x++){
    line = '';
    for (y=1;y<=x;y++){
        line += `${y}*${x}=${x*y} `
        if (x == y){
            console.log(line);
        }
    }
}

運行結果:

0
=1
=2
=3
4
5
=========================
1
2
=========================
0 1 0
1 2 2
2 3 4
3 4 6
yzx
100
200
0
1
2
3
=========================

1x1=1
1x2=2 2x2=4
1x3=3 2x3=6 3x3=9
1x4=4 2x4=8 3x4=12 4x4=16
1x5=5 2x5=10 3x5=15 4x5=20 5x5=25
1x6=6 2x6=12 3x6=18 4x6=24 5x6=30 6x6=36
1x7=7 2x7=14 3x7=21 4x7=28 5x7=35 6x7=42 7x7=49
1x8=8 2x8=16 3x8=24 4x8=32 5x8=40 6x8=48 7x8=56 8x8=64
1x9=9 2x9=18 3x9=27 4x9=36 5x9=45 6x9=54 7x9=63 8x9=72 9x9=81
=========================
0 10
1 20
2 30
3 40
=========================
p1,100
p2,abc
p3,1,2,3
p4,function add(x,y){
    return x+y
}
7
10
20
30
40

1*1=1 
1*2=2 2*2=4 
1*3=3 2*3=6 3*3=9 
1*4=4 2*4=8 3*4=12 4*4=16 
1*5=5 2*5=10 3*5=15 4*5=20 5*5=25 
1*6=6 2*6=12 3*6=18 4*6=24 5*6=30 6*6=36 
1*7=7 2*7=14 3*7=21 4*7=28 5*7=35 6*7=42 7*7=49 
1*8=8 2*8=16 3*8=24 4*8=32 5*8=40 6*8=48 7*8=56 8*8=64 
1*9=9 2*9=18 3*9=27 4*9=36 5*9=45 6*9=54 7*9=63 8*9=72 9*9=81
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章