JavaScript和Java在概念和设计方面都是完全不同的语言。JavaScript由Brendan Eich于1995年发明,并于1997年成为ECMA标准。ECMA-262是官方名称。ECMAScript 6(2015年6月发布)是JavaScript的最新官方版本。

  在HTML中,必须在<script>和</ script>标记之间插入JavaScript代码。可以放在HTML页面的<body>和<head>部分。

JavaScript可以以不同的方式“显示”数据:

  • 使用window.alert()写入警告框
  • 使用document.write()写入HTML输出
  • 使用innerHTML写入HTML元素
  • 使用console.log()写入浏览器控制台

变量

声明 

var person = "John Doe", carName = "Volvo", price = 200;

注意:声明没有值的变量将具有 undefined如果重新声明JavaScript变量,它将不会丢失其值。

执行这些语句后,变量person仍将具有值“John Doe”:

var person = 'John Doe';
var person;
console.log(person);

运算

如果向字符串添加数字,那么将该数字视为字符串并连接。+=用于字符串拼接;

console.log(1 + 5 + '10' + 15); // 61015

如果一个变量的值是字符串的数字,执行++操作会转成数字并计算 ; ++ 是操作变量的,不能是 ++1 或 1++

var number = '5'
console.log(typeof number) // string
console.log(number += 1); // 51
console.log(++ number); // 52
console.log(typeof number) //number

比较

  将字符串与数字进行比较时,JavaScript会在进行比较时将字符串转换为数字:空字符串转换为0非数字字符串转换为NaN  和NaN比较始终为false,即使是和NaN自己。可以用isNaN()判断是否是非数字,再进行比较,连接,运算等操作。比较两个字符串时,“2”将大于“12”,因为(按字母顺序)1小于2。因此比较的时候最好转成Number类型。

function print(log){
    console.log(log);
}
base.js
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <script src="base.js"></script>
    <script>
        print('5' > 4); //true
        print('' > -1); // true
        print('' < 1); // true
        print('n' > 0) // false
        print(0 === NaN) //false
        print(0 == NaN) //false
        print(NaN === NaN); // false
        print(NaN == NaN);  // false
    </script>
</body>
</html>

 数据类型

number,string,object, boolean,undefined

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <script src="base.js"></script>
    <script>
        print(typeof "John" );              // Returns string
        print(typeof 3.14)                  // Returns number
        print(typeof false)                 // Returns boolean
        print(typeof [1,2,3,4])             // Returns object
        print(typeof {name:'John', age:34}) // Returns object
        print(typeof a)                     // Returns undefined
    </script>
</body>
</html>

JavaScript具有动态类型。这意味着同一个变量可以用作不同的类型:

var x;               // Now x is undefined
var x = 5;           // Now x is a Number
var x = "John";      // Now x is a String

null与undefined

在JavaScript中,null的数据类型是一个对象。

var person = null;           // Value is null, but type is still an object

undefined和null之间的区别:

typeof undefined             // undefined
typeof null                  // object
null === undefined           // false
null == undefined            // true

undefined比null更消极,null表示变量该是一个对象,undefined表示不知道要保存什么类型;

数组和类

toString()

返回值:数组转换为(逗号分隔的)数组值的字符串。

 

注意:将对象转成字符串时,用String()转,因为String(null)不出错, undefined.toString()或null.toString()会出错

 

arr.join([separator])

返回值:用给定的分隔符将各数组元素组成字符串,类似于toString()

 

pop()和push() 【改变原数组】

分别在尾巴上弹出和推入元素;

返回值:分别返回弹出的元素和新数组的长度;shift()和unshift()类似,只是在前面弹出和推入元素

 

fill();【改变原数组】

将数组统一用给定参数填充;

返回值: 更改后的数组

 

filter(func[,thisValue]):

处理函数:  func(currentValue[,index,arr])  【下同】

返回值:传入一个函数,根据函数的返回结果判断是保留,并将保留结果作为数组返回

 

find(func,[thisValue]); 

返回值:传入一个函数,根据函数的返回结果返回第一个符合条件的数组元素值

 

findIndex(func[,thisValue]):

和find(func)类似,只是返回符合func()条件的数组元素的index值

返回值: 如果数组中的任何元素通过测试,则返回数组元素索引,否则返回undefined

 

forEach(func,[thisValue])

为每个元素调用处理函数func; thisValue是处理函数this的值,如果此参数为空,则是Windows对象

返回值:  undefined

 

slice(start[, end])

返回值:  将指定部分的数组元素作为新数组返回

 

splice(index,howmany,item...) 【改变原数组】

在index位置开始删除howmany各元素,并插入item...

返回值:  返回删除的值(如果有)

 

Javascript没有对象:

于是模拟了一个对象:类似于hashmap的key:value保存结构

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <script src="base.js"></script>
    <script>
           var stu = new Object(); // 能够保存key value的值
           stu.name = "王有财";
           stu.age = 21;
           stu.showInfo = function(){
               print(this);
               print('name = '+ this.name + ';age = ' + this.age);
           }
           stu.showInfo();
          
    </script>
</body>
</html>

结果:

{name: "王有财", age: 21, showInfo: ƒ}
 name = 王有财;age = 21