JS基础知识

Study

JS的基础知识ECMAScript

JS引入方式

  • 内部引用
1
<script>alert(1)</script>
  • 外部引用
1
<script src=""></script>

JS语法

  • 定义变量
  • 语句以分号结尾
  • 变量名以￥、字母、_开头，其他字符可以是数字，区分大小写
  • 注释方式 
1
/*这是注释*/

基本调试

  • 审查元素，打开控制台
  • console.log();
  • alert();

数据类型

typeof可以用来判断数据类型

  • HTML标签类型：
    • block
    • inline-block
    • inline
    • table
    • …

  • JS中的数据类型:

    • 数字 Number(包括NaN)
    • 布尔型
    • 字符串
    • 对象(包括obj、[]、{}、null)
    • undefined

  • Null和undefined有什么区别:

    • null表示没有对象，明确此处不应该有值
    • 变量被声明了，但是没有赋值时，就==undefined
    • 调用函数时，应该提供的参数没有提供，该参数==undefined
    • 对象没有赋值的属性，该属性的值==undefined
    • 函数没有返回值，默认返回==undefined

基本语句

  • if语句
  • for语句
  • do-while语句
1
2
3
4
5
var i = 0; 
do{ 
    i += 2; 
}while(i < 10); 
console.log(i);
  • while
1
2
3
4
5
var i = 0; 
while (i < 10) { 
    i += 2; 
    console.log(i); 
}

  • for-in语句

    用于循环输出对象里的值，例如Json

  • break、continue

    用于循环语句中，当break时，跳出循环，结束循环。当continue时，跳出本次循环，继续下一次循环

  • switch

    判断语句，if else的简化版

1
2
3
4
5
6
7
8
9
10
switch(true){ 
    case score >= 90: 
        console.log('优'); 
        break; 
    case score >= 70: 
        console.log('良'); 
        break; 
    default: 
        console.log('差'); 
}
  • 函数
    • 定义方式
    • 带参数的函数
    • 函数的调用
    • 函数的作用域

运算符

  • 递增递减 – ++ 

    1
    2
    3
    4
    5
    var a = 10;
    var c = ++a;    //a自己加1，再赋值给c
    var d = a++;    // a赋值给d, 再自己加1，
    var b = 'hello';    
    b += 'kevin';  // b = b + 'kevin'; b的值是hello kevin

  • 非与或 ！ && ||

  • 乘法* 除法/ 求余%
    • 对于乘除减 非number先转化为number，如果转化失败，则返回NaN
  • 加法 +
    • 对于加，任何与字符串相加会转化成字符串
1
2
3
4
5
6
7
8
9
10
11
12
13
var a = 10,
    b = "2",
    c = true,
    d = false,
    e = null,
    f = 'hello';
console.log( a + a );  //20
console.log( a + b );  //102
console.log( a + c );  //11
console.log( d + c );  //1
console.log( e + f );  //nullhello
console.log( a + f );  //10hello
console.log( f + (a + a) );  //hello20

  • 关系><

    • number 直接比较
    • string 直接比较首字母的asc码
    • 如果一个是number,把另外一个转化为number 比较

  • 三目运算

    • var max=(num1>num2)?num1:num2

字符串操作

  • 长度.length

  • 截取 subStr/subString/slice

    1
    2
    3
    4
    var str = "hello world";
    var sub1 = str.subStr(1, 3); // 第一个是开始位置， 第二个是长度  ell
    var sub2 = str.subString(1, 3); // 第一个是开始位置，第二个是结束位置，长度为第二个－第一个  el
    var sub3 = str.slice(1, 3); // 同上 允许负参

  • 查找 search/replace/match

    1
    2
    3
    4
    var str = "hello my world";
    var s1 = str.search('my');   //6 找不到为-1
    var s2 = str.replace('my', 'your'); //
    var s3 = str.match('my'); //返回匹配的数组

  • 大小写 toLowerCase()/toUpperCase()

    1
    2
    3
    var str = "Hello";
    str.toUpperCase();
    str.toLowerCase();

  • 找到某个字符第一次出现的位置，返回asc码 charAt()/charCodeAt()

数组操作

JSON操作