JavaScript简介

JavaScript是一种具有函数优先特性的轻量级、解释型或者说即时编译型的编程语言。虽然作为 Web 页面中的脚本语言被人所熟知，但是它也被用到了很多非浏览器环境中，例如 Node.js、Apache CouchDB、Adobe Acrobat 等。进一步说，JavaScript 是一种基于原型、多范式、单线程的动态语言，并且支持面向对象、命令式和声明式风格。

JavaScript语法

输入输出

JS中输出数据的语法有三种，分别是文档输出document.write()、控制台输出console.log()和页面警示alert()；输入的语句有prompt()。

    // 文档输出
    document.write('js')
    // 页面警示
    alert('js')
    // 控制台输出
    console.log('js')
    // 输入语句
    prompt('请输入您的名字：')

声明变量

JS中可用var、let、const等关键字声明变量，其中var是老版本的，现在多用let

// var声明变量
var age = 18

// let声明变量
let age = 19

// const声明变量,const声明的是常量
const pi = 3.14

JS的基本数据类型

JS是弱数据类型只有赋值了才知道是什么数据类型，JS支持数字型、字符串型、布尔型、未定义类型和空类型等数据类型，可用typeof检测数据类型。

// 数字型
let num = 1
console.log(typeof num)
// 字符串型
let str = '字符串'
console.log(typeof str)
// 布尔型
let bool = true
console.log(typeof bool)
// 未定义型  undefined
let un
console.log(typeof un)
// 空类型  null
let obj = null
console.log(typeof obj)
// 函数
function sayHi() {
   console.log('hi~')
}
//对象
let obj = {
  uname: '张三',
  age: 18,
  gender: '男'
}

JavaScript运算符

JS运算符包括赋值运算符、一元运算符、比较运算符和逻辑运算符等。
赋值运算符：=、+=、-=、/=、*=、%=
一元运算符：++、--
比较运算符：>、<、>=、<=、==、===、!==
逻辑运算符：&&、||、!

JavaScript分支语句

JS分支语句包括if分支语句、三元运算符和switch语句
if分支语句又可分为单分支、双分支和多分支
以下是各分支语句的语法结构：

// if单分支语句
    if (true) {
      console.log('执行语句')
    }
// if双分支语句
    if (true) {
      console.log('执行语句')
    } else {
      console.log('执行另一个语句')
    }
// if多分支语句
    if (true) {
      alert('一')
    } else if (false) {
      alert('二')
    } else {
      alert('三')
    }
    
// 三元运算符
3 < 5 ? console.log('真的') : console.log('假的')

//switch语句
    switch (1) {
      case 1:
        console.log('1')
        break
      case 2:
        console.log('2')
        break
      case 2:
        console.log('2')
        break
      default:
        console.log('no')
        break
    }

JavaScript循环语句

JS循环语句包括while循环语句和for循环语句。

// while循环语句
let i = 1
while (i <= 3) {
    document.write('JavaScript<br/>')
    i++
}
// for循环语句
for (let i = 1; i <= 3; i++) {
    document.write('JavaScript<br/>')
}

JavaScript函数

// 函数声明
function sayHi() {
   console.log('hi~')
}
// 函数调用
sayHi()

JavaScript对象

JS的对象是一种数据类型，同时是一种无序的数据集合，由属性和方法组成
属性即信息或叫特征，对象拥有增、删、查、改等使用属性

// 声明对象
    let obj = {
      uname: '张三',
      age: 18
    }
    console.log(obj)
// 增   对象名.新属性名 = 新值
    obj.gender = '男'
    console.log(obj)  
// 删
    delete obj.age
    console.log(obj)    
// 查   对象名.属性名 or 对象名['属性名']
    console.log(obj.uname)
    console.log(obj['uname'])
// 改  对象名.属性名 = 新值
    obj.age = 19
    console.log(obj)

方法即功能或叫行为.一般是动词性的，其本质是函数

    let obj = {
      uname: '张三',
      eat: function () {
        console.log('吃饭')
      },
      speak: function () {
        console.log('说话')
      }
    }
    obj.eat()
    obj.speak()

遍历对象所使用是for in语法。

let obj = {
    uname: '张三',
    age: 18,
}
// 遍历对象
for (let k in obj) {
   console.log(k)  //属性名
   console.log(obj[k])  //输出属性值
}

JavaScript的基础语法是每一个前端工作者必须掌握的知识，即便再简单，也是后面JS更深入内容的学习所必不可少的基石。

JavaScript语法笔记丨青训营