03-03 js基础语法 - 图1

js基础语法

1、分支结构

1-1 if 基础语法

  1. if (条件表达式) {
  2.     代码块;
  3. }
  4. // 1. 当条件表达式结果为true，会执行代码块；反之不执行
  5. // 2. 条件表达式可以为普通表达式
  6. // 3. 0、undefined、null、""、NaN为假，其他均为真

1-2 if 复杂语法

  1. // 1.双分支
  2. if (表达式1) {
  3.     代码块1;
  4. } else {
  5.     代码块2;
  6. }
  8. // 2.多分支
  9. if (表达式1) {
  11. } else if (表达式2) {
  13. } 
  14. ...
  15. else if (表达式2) {
  17. } else {
  19. }

1-3 if 嵌套

  1. if (表达式1) {
  2.     if (表达式2) {
  4.     }
  5. }

1-4 案例：

  1. var weather = prompt("天气(晴|雨)");  // 文本输入弹出框
  2. if (weather == "晴") {
  3.     alert("今天是晴天")
  4. } else if (weather == "雨") {
  5.     alert("今天是雨天")
  6. } else {
  7.     alert("输入信息有误")
  8. }

2、循环结构

2-1 or循环

  1. for (循环变量①; 条件表达式②; 循环变量增量③) {
  2.     代码块④;
  3. }
  4. // for循环执行的顺序：① ②④③ ... ②④③ ②，入口为①，出口为②，②④③就是循环过程
  6. // 案例：
  7. for (var i = 0; i < 5; i++) {
  8.     console.log(i);
  9. }
  11. // 结果：
  12. 0
  13. 1
  14. 2
  15. 3
  16. 4

2-2 while循环

  1. while (条件表达式) {
  2.     代码块;
  3. }
  4. // 条件满足执行代码块，条件不满足跳出循环
  6. // 案例：
  7. var i = 0;
  8. while (i < 5) {
  9.     console.log(i);
  10.     i++;
  11. }
  13. // 结果：
  14. 0
  15. 1
  16. 2
  17. 3
  18. 4

2-3 for…in迭代器

  1. var arr = [1, 2, 3, 4, 5]
  2. for (num in arr) {
  3.     console.log(num);
  4. }
  6. // 结果：
  7. 0
  8. 1
  9. 2
  10. 3
  11. 4

2-4 break，continue关键词

  1. // 1. break：结束本层循环
  2. // 2. continue：结束本次循环进入下一次循环

3、 JavaScript 对象

3-1 Object类型

创建

  • 直接量

    1. var obj = {name:'xiaolili', age:100, getInfo:function(
    2.              console.log(this.age)
    3.          )}

  • new 构造函数

    1. var obj = new Object()
    2. obj.name = 'xiaolili'
    3. obj.age = 100

    属性操作

  • 读取或修改属性
    ```json console.log(obj.name) obj.name = ‘lili’

console.log(obj[‘name’]) obj[‘name’] = ‘honghong’

  2. - 删除属性
  3. ```json
  4. delete obj['name']
  5. delete obj.name

  • 监测属性是否出存在

    1. 'name' in obj

    3-2 声明类(构造函数)

    ```json function User(name, age){ this.name = name this.age = age

    this.getInfo = function(){

    1.   console.log(this.name, this.age)

    } }

var u = new User(‘鲁迅’, 45)

  2. - 每个对象都有一个属性 `.constructor` 从而获取其构造函数
  3. - 使用运算符`instanceof`可以判断一个对象是否属于某个构造函数
  4. <a name="3-3-this"></a>
  5. ### 3-3 this
  7. - this表示方法 所属的对象
  8. - 全局函数中的this 指向 window
  9. <a name="JVr3z"></a>
  10. ### 3-4 原型和原型链
  11. <a name="zoAvM"></a>
  12. #### 什么是原型
  13. 每一个JavaScript对象都和另一个对象相关联, 并从另一个对象继承属性,另一个对象就是"原型"<br />用直接量创建的对象 都具有同一个原型对象 Object.prototype
  14. <a name="d3czA"></a>
  15. #### 原型链
  16. 对象的原型也有原型,构成了原型链
  17. <a name="1z3X5"></a>
  18. #### 获取原型
  19. ```json
  20. 构造函数.prototype    
  21. 对象.__proto__

给原型添加属性或方法

给原型添加属性和方法，以该对象为原型的对象 都可以使用该方法

检测属性 是自有属性还是继承自原型的属性

  1. obj.hasOwnProperty(proName)

创建对象时指定原型

  1. Object.create(原型对象)