zoukankan      html  css  js  c++  java
  • day12

    回顾

    流程控制(语句)

    分支

    if () {
       
    }

    if () {
       
    } else {
       
    }

    if () {
       
    } else if () {
       
    } else if () {
       
    } else {
       
    }


    switch () {
      case break;
      case break;
      default:
    }

    循环

    while () {
       
    }

    do {
       
    } while()

    #适合遍历 指定次数循环
    for (var i = 0; 循环条件; 循环变化) {
       
    }

    其他语句

    continue
    break
    return

    try {
       
    } catch () {
       
    } finally {
       
    }

    'use strict'

    函数

    定义方式

    function 函数名(参数) {
       
    }

    var 函数名 = function(参数){
       
    }

    参数

    • 形参和实参

    • 参数的默认值 demo('utf-8')

    • 可变长参数 arguments

    返回值

    回调函数

    自调函数

    (function(){
       
    })()
    #作用域

    笔记

    1. JS作用域

    1.1 全局作用域和局部作用域

    • 函数外面声明的就是 全局作用域

    • 函数内是局部作用域

    • 全局变量可以直接在函数内修改和使用

    • 变量,使用var是声明,没有var是使用变量。 如果在函数内使用var来声明变量,在函数内会覆盖同名的全局变量

    1.2 变量提升

    • 在变量声明之前 去使用变量 会得到 undefined ,而不是报错 预读

    • 函数内,如果声明了跟全局变量同名的局部变量, 在声明之前使用改变量,得到undefined( 该变量已经是局部的啦)

    1.3 作用域链

    • 当一个作用域 使用某个变量时,先从本作用域中找, 如果没有去父作用域,再没有,父作用域的父作用域,一直到 全局作用域。 构成了一个作用域链

    1.4 闭包

    • 通常需要 函数中 返回一个 函数

    • 目的 把一个局部作用域的 数据 让外层的作用域使用

    1.5 ES6 新增一 块状作用域

    • let关键字也可以声明变量,同var一样

    • 但是let关键字声明的变量,会在结构语句中产生 块状作用域 同局部作用域

    • ES6建议 使用let代替 var

    2. JS对象

    2.1 构造函数和对象

    构造就是类
    function User([参数]) {
      this.属性 = 值;
      this.属性 = 值;
       
      this.方法 = function(){
           
      }
    }

    #实例一个对象
    new 构造函数();
    如果构造函数没有参数 可以 不加()
    对象.constructor 数字的话:12..constructor或者(12).constructor

    2.2 JS原型和原型链 了解

    原型

    • 每个对象 都有原型 (原型仍然是一个对象)

    • 对象可以继承原型的属性和方法

    • __proto__ 所有对象都有该属性, 该属性指向该对象的原型

    原型链

    • 原型作为对象 也有原型

    • 原型的原型的原型 就构成了 原型链

    • 使用对象中某个属性的时候,先从对象中找,如果没有,从原型上找,原型如果也没有,继续向上找,知道顶层 (顶层的原型对象是一个 类型(类)(构造函数)是Object 的对象)

    2.4 JS对象属性的调用

    .  点
    obj.name
    obj.age

    [] 中括号
    obj['name']
    obj['age']
    obj['user-name']


    任意的对象 都可以在对象实例化完成后, 添加属性和方法

    2.4 Object 构造函数

    js内建的构造方法 叫 Object
    var obj = new Object()


    josn方式定义对象
    var obj = {属性:值, 属性:值}   // new Object的简写
    obj的构造含 是 Object

    3. 实用技巧

    3.1 从页面中获取元素

    document.getElementById()   根据ID的值
    document.getElementsByTagName()   根据标签名
    document.getElmenntsByClassName() 根据class的值
    document.getElementsByName() 根据name属性的值
    document.querySelector(css选择器) 返回满足条件的第一个 元素对象
    document.querySelectorAll(css选择器)   返回所有满足条件元素组成的 类数组对象

    3.2 给元素绑定事件

    先获取元素
    ele.onclick = function(){
       
    }

    获取元素的类数组对象, 遍历,挨个给每个元素绑定事件

    3.3 修改元素的CSS样式

    ele.style.css属性名
    ele.style.background
    ele.style.border
    ele.style.backgroundColor
    ele.style['background-color']

    3.4 设置元素的class值

    ele.className 可以赋值,也可以获取
    ele.classList.add(‘值’) 添加一个class值
    ele.classList.remove(‘值’) 删除一个class值
    ele.classList.toggle(‘值’) 自动切换一个class值(有就删除,没有就添加)

    3.5 事件

    onclick         单击
    ondblclick   双击
    oncontextmenu   右击
    onmouseover/onmouseenter       鼠标悬浮到元素上
    onmouseout/onmouseleave       鼠标离开元素
    onmousemove   鼠标在上面移动
    onmousedown   鼠标的按键按下
    onmouseup     鼠标的按键抬起

    3.6 JS定时

    单次定时

    setTimeout(fn, delay)
    clearTimeout() 清除定时

    多次定时

    setInterval(fn, dealy)
    clearInterval() 清除定时

    总结

    1. 作用域

    2. 对象

    • 构造函数 实例化对象

    • 对象的原型 原型链

    3 Object 类型

    • 类似于python的字典

    • 键值对

    作页

    • 进度条效果

    • 倒计时效果 (选做) (距离世界末日还有 23天1小时4分2秒)

    •  

  • 相关阅读:
    mysql 主从备份
    ELK 日志系统
    rsync+inotify 实现自动同步
    yum 的 group的信息
    Centos yum 命令行 安装KDE Desktop
    centos 配置本地yum源
    关于抽象在解耦的作用
    linux 查看当前系统下的所有用户的名称
    Qthread的使用方法
    linux command 4
  • 原文地址:https://www.cnblogs.com/xujinjin18/p/9457137.html
Copyright © 2011-2022 走看看