是三好
是三好

9-AJAX-3原理

AJAX-原理

目录

  • XMLHttpRequest 的学习
  • Promise
  • 封装简易版 axios
  • 案例 - 天气预报

学习目标

  1. 了解原生 AJAX 语法 - XMLHttpRequest（XHR）
  2. 了解 Promise 的概念和使用
  3. 了解 axios 内部工作的大概过程（XHR + Promise）
  4. 案例 - 天气预报

01.XMLHttpRequest - 基础使用

目标

  • 了解 AJAX 原理 XHR 的基础使用

讲解

  1. AJAX 是浏览器与服务器通信的技术，采用 XMLHttpRequest 对象相关代码

  2. axios 是对 XHR 相关代码进行了封装，让我们只关心传递的接口参数

  3. 学习 XHR 也是了解 axios 内部与服务器交互过程的真正原理

  4. 语法如下：

9-AJAX-3原理_第1张图片

  1. 以一个需求来体验下原生 XHR 语法

    获取所有省份列表并展示到页面上

DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>XMLHttpRequest-基础使用title>
head>

<body>
  <h2>XMLHttpRequest-基础使用h2>
  <p class="list">
    
  p>
  <script>
    /**
     * 需求: XMLHttpRequest获取省份数据，渲染到页面上
     * */
    // 1. 创建 XMLHttpRequest对象
    const xhr = new XMLHttpRequest()

    // 2. 设置请求方法 和 请求URL
    xhr.open('GET', 'http://hmajax.itheima.net/api/province')

    // 3. 监听 loadend 事件，接收响应结果
    xhr.addEventListener('loadend', () => {
      // console.log(xhr.response)
      // JSON-->JS对象
      const data = JSON.parse(xhr.response)
      // console.log(data)

      // 渲染到页面上
      document.querySelector('.list').innerText = data.list
    })

    // 4. 发起请求
    xhr.send()

  script>
body>

html>

小结

  1. AJAX 原理是什么?

    答案
    • window 提供的 XMLHttpRequest

  2. 为什么学习 XHR ？

    答案
    • 有更多与服务器数据通信方式
    • 了解 axios 内部原理

  3. XHR 使用步骤？

    答案
    • 1. 创建 XHR 对象 2. 调用 open 方法，设置 url 和请求方法 3. 监听 loadend 事件，接收结果 4. 调用 send 方法，发起请求

02.XMLHttpRequest - 查询参数

目标

  • 使用 XHR 传递查询参数给服务器，获取匹配数据

讲解

  1. 复习下什么是查询参数：携带额外信息给服务器，返回匹配想要的数据
  2. 查询参数原理要携带的位置和语法：url?参数名=值&参数名=值
  3. 所以，原生 XHR 需要自己在 url 后面携带查询参数字符串，没有 axios 帮助我们了
  4. 以需求来体验：查询河北省下属的城市列表
  5. 切换到代码区，编码实现
DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>XMLHttpRequest-查询参数title>
head>

<body>
  <h2>XMLHttpRequest-查询参数h2>
  <p class="city">
    
  p>
  <script>
    /**
     * 需求：通过 XMLHttpRequest 获取某个省份的所有城市，渲染到页面上
    */
    // 1. 创建 XMLHttpRequest对象
    const xhr = new XMLHttpRequest()

    // 2. 设置请求方法 和 请求URL
    xhr.open('GET', 'http://hmajax.itheima.net/api/city?pname=湖北省')

    // 3. 监听 loadend 事件，接收响应结果
    xhr.addEventListener('loadend', () => {
      // console.log(xhr.response)
      // JSON-JS对象
      const data = JSON.parse(xhr.response)
      console.log(data)
      // 渲染到页面上
      document.querySelector('.city').innerText = data.list
    })

    // 4. 发起请求
    xhr.send()

  script>
body>

html>

小结

  1. XHR 如何携带查询参数?

    答案
    • 在调用 open 方法的时候，在 url? 后面按照指定格式拼接参数名和值

03.案例 - 地区查询

目标

  • 使用 XHR 完成案例地区查询

讲解

  1. 需求：和我们之前做的类似，就是不用 axios 而是用 XHR 实现，输入省份和城市名字后，点击查询，传递多对查询参数并获取地区列表的需求

    9-AJAX-3原理_第2张图片

  2. 但是多对查询参数，如果自己拼接很麻烦，这里用 URLSearchParams 把参数对象转成“参数名=值&参数名=值“格式的字符串，语法如下：

    9-AJAX-3原理_第3张图片

DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>案例_地区查询title>
  <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.1.3/css/bootstrap.min.css" rel="stylesheet">
  <style>
    :root {
      font-size: 15px;
    }

    body {
      padding-top: 15px;
    }
  style>
head>

<body>
  <div class="container">
    <form id="editForm" class="row">
      
      <div class="mb-3 col">
        <label class="form-label">省份名字label>
        <input type="text" value="北京" name="province" class="form-control province" placeholder="请输入省份名称" />
      div>
      
      <div class="mb-3 col">
        <label class="form-label">城市名字label>
        <input type="text" value="北京市" name="city" class="form-control city" placeholder="请输入城市名称" />
      div>
    form>
    <button type="button" class="btn btn-primary sel-btn">查询button>
    <br><br>
    <p>地区列表: p>
    <ul class="list-group area-group">
      
      <li class="list-group-item">东城区li>
    ul>
  div>
  <script src="https://cdn.bootcdn.net/ajax/libs/axios/1.3.2/axios.min.js">script>
  <script>
    /**
     * 需求: 根据省份和城市名字, 查询对应的地区列表
     *  1. 生成查询参数
     *  2. 调用接口
     *  3. 渲染数据
    */
    document.querySelector('.sel-btn').addEventListener('click', () => {
      // 1. 生成查询参数
      // 1.1 获取输入的省市
      const pname = document.querySelector('.province').value
      const cname = document.querySelector('.city').value
      console.log(pname, cname)
      // 1.2 通过 URLSearchParams 快速生成查询参数
      const params = new URLSearchParams({ pname, cname })
      // 中文会被编码，不影响服务器解析
      const query = params.toString()
      console.log(query)

      // 2. 调用接口
      // 2.1 实例化对象
      const xhr = new XMLHttpRequest()
      // 2.2 设置请求的方法和URL地址
      xhr.open('GET', `http://hmajax.itheima.net/api/area?${query}`)
      // 2.3 监听事件，接收并使用数据
      xhr.addEventListener('loadend', () => {
        // console.log(xhr.response)

        // 3. 渲染数据
        // 3.1 JSON-JS对象
        const data = JSON.parse(xhr.response)
        // console.log(data)
        // 3.2 渲染
        const html = data.list.map(v => `
  • ${v}
    • `    ).join('')
        // console.log(html)
        document.querySelector('.area-group').innerHTML = html
      })
      // 2.4 发送请求
      xhr.send()


    })

      script>
body>

html>

    小结

    1. JS 对象如何转成查询参数格式字符串?

      答案
      • 在调用 open 方法的时候，在 url? 后面按照指定格式拼接参数名和值

    04.XMLHttpRequest - 数据提交

    目标

    • 通过 XHR 提交用户名和密码，完成注册功能

    讲解

    1. 需求：通过 XHR 完成注册用户功能

    2. 注意1：但是这次没有 axios 帮我们了，我们需要自己设置请求头 Content-Type：application/json，来告诉服务器端，我们发过去的内容类型是 JSON 字符串，让他转成对应数据结构取值使用

    3. 注意2：没有 axios 了，我们前端要传递的请求体数据，也没人帮我把 JS 对象转成 JSON 字符串了，需要我们自己转换

    4. 注意3：原生 XHR 需要在 send 方法调用时，传入请求体携带

    9-AJAX-3原理_第4张图片

    DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>XMLHttpRequest-数据提交title>
head>

<body>
  <h2>XMLHttpRequest-数据提交h2>
  <button class="btn">点击注册button>
  <script>

    /**
     * 需求：使用xhr进行数据提交-完成注册功能
    */
    document.querySelector('.btn').addEventListener('click', () => {
      // 1. 实例化XHR对象
      const xhr = new XMLHttpRequest()
      // 2. 设置请求方法和地址
      xhr.open('POST', 'http://hmajax.itheima.net/api/register')
      // 3. 监听事件，接收并使用数据
      xhr.addEventListener('loadend', () => {
        console.log(xhr.response)
      })

      // 4. 设置请求头信息(根据接口文档设置Content-Type)
      xhr.setRequestHeader('Content-Type', 'application/json')

      // 5. 请求体发送数据(和请求头设置的一致)
      // 方案1: 自己写JSON
      // 方案2: JS对象--》转为JSON(推荐!)-JSON.stringify
      const obj = {
        username: 'itheima999',
        password: '123456'
      }
      const data = JSON.stringify(obj)
      xhr.send(data)

    })

  script>
body>

html>

    小结

    1. XHR 如何提交请求体数据?

      答案
      • 在 send 中携带请求体数据，要按照后端要求的内容类型携带

    你可能感兴趣的:(学习整理之web前端,ajax,javascript,ecmascript)

    • Zynq PL端IP核之AXI DMA Mazy.v fpga开发嵌入式硬件arm开发单片机
      1.AXIDMA简介Zynq提供了两种DMA，一种是PS中的DMA控制器，通过GP口与PL端连接，另一种是PL中的AXIDMAIP核（软核），通过HP口与PS端连接。Zynq有4个HP接口，每一个HP接口都包含控制和数据FIFO，这些FIFO为大数据量突发传输提供缓冲，让HP接口成为理想的高速数据传输接口。AXIDMAIP内核在AXI4内存映射和AXI4StreamIP接口之间提供高带宽直接储存访
    • 9种JavaScript数组去重的高阶方法 2501_90226133 javascriptjava算法
      给定一个数组[1,2,2,4,null,null,‘3’,‘abc’,3,5,4,1,2,2,4,null,null,‘3’,‘abc’,3,5,4]去除重复项。letarr=[1,2,2,4,null,null,‘3’,‘abc’,3,5,4,1,2,2,4,null,null,‘3’,‘abc’,3,5,4]1、利用对象的key唯一众所周知，对象的key不可重复，否则后者将覆盖前者。利用该特性
    • Ark-TS 语言：鸿蒙生态的高效开发利器，让我们用大白话说一说 harmonyos-next
      Ark-TS（华为专门为鸿蒙系统——就是华为自己的手机、平板、智能设备操作系统——设计的编程语言，基于TypeScript，一种比普通JavaScript更严格、能减少错误的语言）是鸿蒙应用开发的主力工具。它就像给开发者配备了一套趁手的工具包，让写代码又快又稳。简单来说，Ark-TS有几个厉害的地方：静态类型检查（写代码时必须给变量指定类型，比如数字、文字，这样电脑能在运行前就发现类型错误，避免程
    • 单例模式实现 后端
      一、是什么单例模式（SingletonPattern）：创建型模式，提供了一种创建对象的最佳方式，这种模式涉及到一个单一的类，该类负责创建自己的对象，同时确保只有单个对象被创建在应用程序运行期间，单例模式只会在全局作用域下创建一次实例对象，让所有需要调用的地方都共享这一单例对象，如下图所示：二、实现在javascript中，实现一个单例模式可以用一个变量来标志当前的类已经创建过对象，如果下次获取当
    • JavaScript HTML DOM 节点列表 宇哥资料 JavaScriptjavascripthtml开发语言
      NodeList对象是一个从文档中获取的节点列表(集合)。NodeList对象类似HTMLCollection对象。一些旧版本浏览器中的方法（如：getElementsByClassName()）返回的是NodeList对象，而不是HTMLCollection对象。所有浏览器的childNodes属性返回的是NodeList对象。大部分浏览器的querySelectorAll()返回NodeLis
    • js知识点-拓展运算符和剩余运算符 lmryBC49 javascript开发语言ecmascript
      概述在现代JavaScript开发中，ES6引入的拓展运算符（SpreadOperator）和剩余运算符（RestOperator）让代码更加简洁和灵活。无论是数组、对象的拆分与合并，还是函数参数的处理，这两个运算符都是非常实用的工具。拓展运算符1.什么是拓展运算符？拓展运算符（SpreadOperator）由三个连续的点...表示，用于将一个可迭代对象（例如数组、字符串等）展开成多个元素。拓展运
    • 域名如何绑定服务 我真的不想做程序员 javajava后端开发语言服务器阿里云容器
      目录一、理解域名与Java服务之间的关系二、DNS解析三、配置DNS记录四、Java服务的配置1.部署Java应用2.配置反向代理五、DNS解析六、验证绑定是否成功七、代码示例八、总结在现代网络应用中，域名和Java服务的绑定是实现用户友好访问和后台服务的关键步骤。本文将详细介绍这一过程，包括DNS解析、反向代理以及Java服务的配置，最后会展示代码示例和视觉化流程图。一、理解域名与Java服务之
    • Vue.js 性能优化：虚拟 DOM 与虚拟滚动 vvilkim vuevue.js前端javascript
      在现代前端开发中，性能优化是一个永恒的话题。Vue.js作为一款流行的前端框架，提供了许多强大的工具和技术来提升应用的性能。其中，虚拟DOM和虚拟滚动是两个非常重要的概念。本文将深入探讨它们的原理、优势以及如何在Vue.js中使用它们来优化性能。什么是虚拟DOM？虚拟DOM（VirtualDOM）是Vue.js用于提升性能的核心技术之一。它是一个轻量级的JavaScript对象树，用于表示真实DO
    • Android studio之编译提示Could not find :umeng-asms-v1.2.1:. 码莎拉蒂 . AndriodstudioAndroidCouldnotfind导入正确的aar文件umeng-asms-v1flatDir
      1、问题Couldnotdeterminethedependenciesoftask':app:compileDebugJavaWithJavac'.>Couldnotresolvealltaskdependenciesforconfiguration':app:debugCompileClasspath'.>Couldnotfind:umeng-asms-v1.2.1:.Requiredby:p
    • 用python执行js代码：PyExecJS库详解 数据知道 2025年爬虫和逆向教程pythonjavascript爬虫数据采集nodejs
      更多内容请见：爬虫和逆向教程-专栏介绍和目录文章目录1.介绍和安装1.1PyExecJS介绍1.2安装JavaScript运行时1.3安装PyExecJS2.PyExecJS的基本使用2.1执行简单的JavaScript代码2.2使用外部JavaScript文件2.3先编译、后调用2.4传递参数和获取返回值3.PyExecJS的高级功能3.1指定JavaScript运行时3.2处理异步JavaSc
    • 【 ＜二＞ 丹方改良：Spring 时代的 JavaWeb】之 Spring Boot 中的 RESTful API 设计：从上手到骨折 Foyo Designer springspringbootrestfulSpringMVCAsyncCrossOrigin
      点击此处查看合集https://blog.csdn.net/foyodesigner/category_12907601.html?fromshare=blogcolumn&sharetype=blogcolumn&sharerId=12907601&sharerefer=PC&sharesource=FoyoDesigner&sharefrom=from_link一、开篇整活儿咱今儿个唠唠Spr
    • $.ajax()方法详解 小二爱编程· ajaxjavascriptjquery
      jquery中的ajax方法参数总是记不住，这里记录一下。目录1.url2.type3.timeout4.async5.cache6.data7.dataType8.beforeSend9.complete10.success11.error12.contentType13.dataFilter14.dataFilter15.global16.ifModified17.jsonp18.userna
    • 5-1 使用ECharts将MySQL数据库中的数据可视化 上课的牛马 实训大数据
      方法一：使用PythonFlask框架搭建API对于技术小白来说，使用ECharts将MySQL数据库中的数据可视化需要分步骤完成。以下是详细的实现流程：一、技术架构‌后端服务‌：使用PythonFlask框架搭建API（简单易学，适合新手）数据库连接‌：通过Python的pymysql库连接MySQL前端可视化‌：HTML+JavaScript+ECharts数据流向‌：MySQL数据库→Pyt
    • 【轻松学C：编程小白的大冒险】— 09 运算符与表达式的实际应用 秋知叶i #C语言c语言开发语言
      在编程的艺术世界里，代码和灵感需要寻找到最佳的交融点，才能打造出令人为之惊叹的作品。而在这座秋知叶i博客的殿堂里，我们将共同追寻这种完美结合，为未来的世界留下属于我们的独特印记。【轻松学C：编程小白的大冒险】—09运算符与表达式的实际应用一、运算符家族大阅兵二、算术运算符：数学界的五虎上将1.加法运算符`+`2.减法运算符`-`3.乘法运算符`*`4.除法运算符`/`5.取模运算符`%`二、赋值运
    • 设计模式之工厂模式的优缺点 C++ 老炮儿的技术栈 算法c++学习笔记
      工厂模式是一种创建对象的设计模式，它将对象的创建和使用分离。以下是工厂模式的优缺点：优点-解耦对象的创建和使用：使得代码的依赖关系更加清晰，使用者不需要了解对象的具体创建过程，只需要关心如何使用对象，降低了代码的耦合度。-提高可维护性和可扩展性：当需要创建新的对象或者修改对象的创建逻辑时，只需要在工厂类中进行修改，而不需要在所有使用该对象的地方进行修改，便于代码的维护和扩展。-便于代码复用：工厂类
    • 前端面试：[React] Recoil 里面 selector 支持哪些参数？ returnShitBoy 前端面试react.js
      在Recoil中，selector用于派生状态并可以通过传递不同的参数来实现更强大的功能。创建selector时，可以传入以下参数：1.key类型:string描述:是selector的唯一标识符。每个selector和atom都必须有一个唯一的key，否则会抛出错误。这个key用于在Recoil状态树中进行识别。示例：javascriptconstmySelector=selector({key
    • OpenCV图像拼接（1）自动校准之校准旋转相机的函数calibrateRotatingCamera() 村北头的码农 OpenCVopencv人工智能
      操作系统：ubuntu22.04OpenCV版本：OpenCV4.9IDE:VisualStudioCode编程语言：C++11算法描述cv::detail::calibrateRotatingCamera是OpenCV中用于校准旋转相机的函数。它特别适用于那种相机相对于一个固定的场景进行纯旋转运动的情况，比如在全景拼接过程中。此函数可以从一系列单应性矩阵（HomographyMatrices）中
    • CCF CSP 历年真题 C语言版 满分代码集合 (至2021.9 持续更新中 JY_0329 CCFc语言开发语言cspccf算法
      CCFCSP历年真题C语言版满分代码集合（全部原创）2021-9-1数组推导2021-9-2非零段划分2021-4-1灰度直方图2021-4-2领域均值2020-12-1期末预测之安全指数2020-12-2期末预测之最佳阈值2020-9-1称检测点查询2020-9-2风险人群筛查2020-6-1线性分类器2020-6-2稀疏向量2019-12-1报数2019-12-2回收站选址2019-9-1小明
    • 在网页跑3D多人互动之渲染效能瓶颈 微网兔子 後端技術前端网络服务器c++unity架构3d
      累积到目前测试回馈给我们的心得，主要问题还是在前端显示的部分。所以就来聊聊在网页跑3D多人互动之渲染效能瓶颈!!!数万个3D角色与场景物件需即时渲染，导致GPU/CPU过载，低端设备卡顿。已经使用的解决方案：LOD（LevelofDetail）技术：根据距离动态调整模型细节，远距离使用低多边形模型。InstancedRendering：批次渲染相同模型（如重复的树木、建筑物）。Culling（剔除
    • 使用Three.js渲染器创建炫酷3D场景
      引言在当今数字化的时代，3D图形技术正以其独特的魅力在各个领域掀起波澜。从影视制作到游戏开发，从虚拟现实到网页交互，3D场景以其强烈的视觉冲击力和沉浸式的体验，成为了吸引用户、传达信息的重要手段。而Three.js，作为一款功能强大且广受欢迎的JavaScript3D库，为我们提供了便捷、高效的途径来创建令人炫目的3D场景。本文将深入探讨使用Three.js渲染器创建炫酷3D场景的方方面面，带领读
    • 通俗详解redis底层数据结构哈希表之渐进式rehash 八股文领域大手子 javajvm算法数据库mysqlredis
      一、为什么要用渐进式rehash？假设你家的旧柜子（哈希表）装满了，需要换个大柜子。如果一次性把所有东西倒腾到新柜子，你可能得停下手头所有事，累得半死（这就是传统rehash的问题：卡顿）。Redis为了不“累死”，选择边搬边用，每次搬一点，这就是“渐进式”。二、具体怎么“搬家”？1️⃣先准备好新柜子（分配空间）•Redis会先申请一个更大的新哈希表（比如旧表两倍大），这时候系统里同时有「旧表」和
    • 用Babel操作AST实现JavaScript代码的自动化生成与转换
      目录目录环境搭建代码：修改AST的逻辑重命名函数名重命名变量并修改变量值函数调用替换控制流扁平化还原删除未使用的变量对象属性简化条件表达式优化表达式还原环境搭建安装环境npminstall@babel/parser@babel/traverse@babel/generator@babel/typesast转换的代码框架constfs=require('fs');constvm=require('n
    • k8s往secret里导入证书_Kubernetes K8S之存储Secret详解 weixin_39604598 k8s往secret里导入证书
      K8S之存储Secret概述与类型说明，并详解经常使用Secret示例html主机配置规划服务器名称(hostname)系统版本配置内网IP外网IP(模拟)k8s-masterCentOS7.72C/4G/20G172.16.1.11010.0.0.110k8s-node01CentOS7.72C/4G/20G172.16.1.11110.0.0.111k8s-node02CentOS7.72C/
    • 记20个忘10个之七：身体结构 nshkfhwr beauty美女head头body身hand手foot脚lap大腿面organ器官
      记20个忘10个之七：身体结构附送几个单词：beautyn.美女lookern.靓女girln.女孩lassn.少女，年轻女子lassien.少女，小姑娘maidenn.少女，未婚女子maidn.女仆ladyn.女士；小姐hostessn.女主人；女房东mistressn.女主人，主妇；情妇blonden.金发女郎这样是不是很好记呀，^_^
    • c语言数据结构之栈 Qurry.OS 数据结构数据结构c语言链表
      前言栈是一种先进后出的结构，只能对栈顶进行操作，数据入栈、出栈都在栈顶处，换句话说，栈只能对栈顶端进行操作，禁止跳过栈顶插入或删除其它数据。栈可以简单分为数组栈和链表栈；数组栈设定了空间大小，而链表栈在内存允许的范围内无空间大小限制，通过链表的方式将栈链接起来。C语言数据结构之单链表C语言数据结构之双向链表c语言数据结构之栈c语言数据结构之队列C语言数据结构之树1链表栈1.1数据结构在单链表的基础
    • 一键掌控海量文件！Shell的find命令终极指南 + 高阶组合技 芯有所享 java前端android经验分享
      你是否经历过这些崩溃瞬间？想清理3个月前的日志却无从下手要在10万张图片里找出某个版本突然发现服务器被临时文件塞爆…今天介绍的Linux三剑客之find命令，就是你的超级救星！不仅能精准定位文件，结合其他命令更能玩出自动化运维的花样！一、Find基础三连击（新手必看）按图索骥-名称搜索查找当前目录所有.txt文件（精准匹配）find.-name“*.txt”忽略大小写找配置文件（模糊匹配）find
    • 数据结构之单链表（C语言） 渴望脱下狼皮的羊 初阶数据结构学习（C语言实现）数据结构c语言开发语言
      数据结构之单链表（C语言）1链表的概念2节点创建函数与链表打印函数2.1节点创建函数2.2链表打印函数3单链表尾插法与头插法3.1尾插函数3.2头插函数4单链表尾删法与头删法4.1尾删函数4.2头删函数5指定位置的插入与删除5.1在指定位置之前插入数据5.2在指定位置之后插入数据5.3删除指定位置节点5.4删除指定位置之后节点6链表数据的查找与链表的销毁6.1链表数据的查找6.2链表的销毁7单链表
    • Scrum实施情况调查之案例分析 zhijie435 项目管理thoughtworks敏捷项目管理敏捷开发工作框架
      导读：社区Agile主题敏捷实施,企业级敏捷标签Scrum作者李剑，在InfoQ中文站上发表了一篇"Scrum在中国——企业实施情况调查实录"。这份调查实录，分别调查了五个实施SCRUM的公司，其中三家公司实施成功，二家公司失败。我建议所有准备或者正在实施SCRUM的人们都能来读一下。在此，我们会对这篇文章中的案例分类进行分析、诊断。并探讨什么是敏捷开发方法、什么是SCRUM、使用敏捷方法需要什么
    • 双指针之滑动窗口 旧念25 算法数据结构
      滑动窗口是双指针的一种所谓滑动窗口，就是不断的调节子序列的起始位置和终止位置，从而得出我们要想的结果。给定一个含有n个正整数的数组和一个正整数s，找出该数组中满足其和≥s的长度最小的连续子数组，并返回其长度。如果不存在符合条件的子数组，返回0。示例：输入：s=7,nums=[2,3,1,2,4,3]输出：2解释：子数组[4,3]是该条件下的长度最小的子数组暴力解法两层for循环嵌套，第一层for循
    • 优化Apache Spark性能之JVM参数配置指南 weixin_30777913 jvmspark大数据开发语言性能优化
      ApacheSpark运行在JVM之上，JVM的垃圾回收（GC）、内存管理以及堆外内存使用情况，会直接对Spark任务的执行效率产生影响。因此，合理配置JVM参数是优化Spark性能的关键步骤，以下将详细介绍优化策略和配置建议。通过以下优化方法，可以显著减少GC停顿时间、提升内存利用率，进而提高Spark作业吞吐量和数据处理效率。同时，要根据具体的工作负载和集群配置进行调整，并定期监控Spark应
    • windows下源码安装golang 616050468 golang安装golang环境windows
               系统： 64位win7， 开发环境：sublime text 2，  go版本： 1.4.1    1.  安装前准备(gcc, gdb, git)        golang在64位系
    • redis批量删除带空格的key bylijinnan redis
      redis批量删除的通常做法： redis-cli keys "blacklist*" | xargs redis-cli del 上面的命令在key的前后没有空格时是可以的，但有空格就不行了： $redis-cli keys "blacklist*" 1) "blacklist:12: [email protected]
    • oracle正则表达式的用法 0624chenhong oracle正则表达式
        方括号表达示 方括号表达式 描述 [[:alnum:]] 字母和数字混合的字符 [[:alpha:]] 字母字符 [[:cntrl:]] 控制字符 [[:digit:]] 数字字符 [[:graph:]] 图像字符 [[:lower:]] 小写字母字符 [[:print:]] 打印字符 [[:punct：]] 标点符号字符 [[:space:]]
    • 2048源码(核心算法有，缺少几个anctionbar，以后补上) 不懂事的小屁孩 2048
      2048游戏基本上有四部分组成， 1：主activity，包含游戏块的16个方格，上面统计分数的模块 2：底下的gridview，监听上下左右的滑动，进行事件处理， 3：每一个卡片，里面的内容很简单，只有一个text，记录显示的数字 4：Actionbar，是游戏用重新开始，设置等功能(这个在底下可以下载的代码里面还没有实现) 写代码的流程 1：设计游戏的布局，基本是两块，上面是分
    • jquery内部链式调用机理 换个号韩国红果果 JavaScriptjquery
      只需要在调用该对象合适(比如下列的setStyles)的方法后让该方法返回该对象（通过this  因为一旦一个函数称为一个对象方法的话那么在这个方法内部this（结合下面的setStyles）指向这个对象） function create(type){ var element=document.createElement(type); //this=element;
    • 你订酒店时的每一次点击 背后都是NoSQL和云计算 蓝儿唯美 NoSQL
      全球最大的在线旅游公司Expedia旗下的酒店预订公司，它运营着89个网站，跨越68个国家，三年前开始实验公有云，以求让客户在预订网站上查询假期酒店时得到更快的信息获取体验。 云端本身是用于驱动网站的部分小功能的，如搜索框的自动推荐功能，还能保证处理Hotels.com服务的季节性需求高峰整体储能。 Hotels.com的首席技术官Thierry Bedos上个月在伦敦参加“2015 Clou
    • java笔记1 a-john java
      1，面向对象程序设计（Object-oriented Propramming，OOP）：java就是一种面向对象程序设计。 2，对象：我们将问题空间中的元素及其在解空间中的表示称为“对象”。简单来说，对象是某个类型的实例。比如狗是一个类型，哈士奇可以是狗的一个实例，也就是对象。 3，面向对象程序设计方式的特性：     3.1 万物皆为对象。    
    • C语言 sizeof和strlen之间的那些事 C/C++软件开发求职面试题 必备考点（一） aijuans C/C++求职面试必备考点
              找工作在即，以后决定每天至少写一个知识点，主要是记录，逼迫自己动手、总结加深印象。当然如果能有一言半语让他人收益，后学幸运之至也。如有错误，还希望大家帮忙指出来。感激不尽。        后学保证每个写出来的结果都是自己在电脑上亲自跑过的，咱人笨，以前学的也半吊子。很多时候只能靠运行出来的结果再反过来
    • 程序员写代码时就不要管需求了吗？ asia007 程序员不能一味跟需求走
            编程也有2年了，刚开始不懂的什么都跟需求走，需求是怎样就用代码实现就行，也不管这个需求是否合理，是否为较好的用户体验。当然刚开始编程都会这样，但是如果有了2年以上的工作经验的程序员只知道一味写代码，而不在写的过程中思考一下这个需求是否合理，那么，我想这个程序员就只能一辈写敲敲代码了。       我的技术不是很好，但是就不代
    • Activity的四种启动模式 百合不是茶 android栈模式启动Activity的标准模式启动栈顶模式启动单例模式启动
      android界面的操作就是很多个activity之间的切换,启动模式决定启动的activity的生命周期 ;   启动模式xml中配置     <activity android:name=".MainActivity" android:launchMode="standard&quo
    • Spring中@Autowired标签与@Resource标签的区别 bijian1013 javaspring@Resource@Autowired@Qualifier
      Spring不但支持自己定义的@Autowired注解，还支持由JSR-250规范定义的几个注解，如：@Resource、 @PostConstruct及@PreDestroy。   1. @Autowired    @Autowired是Spring 提供的，需导入    Package:org.springframewo
    • Changes Between SOAP 1.1 and SOAP 1.2 sunjing ChangesEnableSOAP 1.1SOAP 1.2
      JAX-WS SOAP Version 1.2 Part 0: Primer (Second Edition) SOAP Version 1.2 Part 1: Messaging Framework (Second Edition) SOAP Version 1.2 Part 2: Adjuncts (Second Edition)   Which style of WSDL
    • 【Hadoop二】Hadoop常用命令 bit1129 hadoop
      以Hadoop运行Hadoop自带的wordcount为例，   hadoop脚本位于/home/hadoop/hadoop-2.5.2/bin/hadoop，需要说明的是，这些命令的使用必须在Hadoop已经运行的情况下才能执行   Hadoop HDFS相关命令  hadoop fs -ls  列出HDFS文件系统的第一级文件和第一级
    • java异常处理（初级） 白糖_ javaDAOspring虚拟机Ajax
      从学习到现在从事java开发一年多了，个人觉得对java只了解皮毛，很多东西都是用到再去慢慢学习，编程真的是一项艺术，要完成一段好的代码，需要懂得很多。 最近项目经理让我负责一个组件开发，框架都由自己搭建，最让我头疼的是异常处理，我看了一些网上的源码，发现他们对异常的处理不是很重视，研究了很久都没有找到很好的解决方案。后来有幸看到一个200W美元的项目部分源码，通过他们对异常处理的解决方案，我终
    • 记录整理-工作问题 braveCS 工作
      1）那位同学还是CSV文件默认Excel打开看不到全部结果。以为是没写进去。同学甲说文件应该不分大小。后来log一下原来是有写进去。只是Excel有行数限制。那位同学进步好快啊。 2）今天同学说写文件的时候提示jvm的内存溢出。我马上反应说那就改一下jvm的内存大小。同学说改用分批处理了。果然想问题还是有局限性。改jvm内存大小只能暂时地解决问题，以后要是写更大的文件还是得改内存。想问题要长远啊
    • org.apache.tools.zip实现文件的压缩和解压，支持中文 bylijinnan apache
      刚开始用java.util.Zip，发现不支持中文（网上有修改的方法，但比较麻烦） 后改用org.apache.tools.zip org.apache.tools.zip的使用网上有更简单的例子 下面的程序根据实际需求，实现了压缩指定目录下指定文件的方法 import java.io.BufferedReader; import java.io.BufferedWrit
    • 读书笔记-4 chengxuyuancsdn 读书笔记
      1、JSTL 核心标签库标签 2、避免SQL注入 3、字符串逆转方法 4、字符串比较compareTo 5、字符串替换replace 6、分拆字符串 1、JSTL 核心标签库标签共有13个， 学习资料：http://www.cnblogs.com/lihuiyy/archive/2012/02/24/2366806.html 功能上分为4类： (1)表达式控制标签：out
    • [物理与电子]半导体教材的一个小问题 comsci 问题
            各种模拟电子和数字电子教材中都有这个词汇-空穴       书中对这个词汇的解释是; 当电子脱离共价键的束缚成为自由电子之后,共价键中就留下一个空位,这个空位叫做空穴       我现在回过头翻大学时候的教材,觉得这个
    • Flashback Database --闪回数据库 daizj oracle闪回数据库
      Flashback 技术是以Undo segment中的内容为基础的， 因此受限于UNDO_RETENTON参数。要使用flashback 的特性，必须启用自动撤销管理表空间。 在Oracle 10g中， Flash back家族分为以下成员： Flashback Database， Flashback Drop，Flashback Query(分Flashback Query,Flashbac
    • 简单排序:插入排序 dieslrae 插入排序
      public void insertSort(int[] array){ int temp; for(int i=1;i<array.length;i++){ temp = array[i]; for(int k=i-1;k>=0;k--)
    • C语言学习六指针小示例、一维数组名含义，定义一个函数输出数组的内容 dcj3sjt126com c
      # include <stdio.h> int main(void) { int * p; //等价于 int *p 也等价于 int* p; int i = 5; char ch = 'A'; //p = 5; //error //p = &ch; //error //p = ch; //error p = &i; //
    • centos下php redis扩展的安装配置3种方法 dcj3sjt126com redis
      方法一 1.下载php redis扩展包  代码如下 复制代码 #wget http://redis.googlecode.com/files/redis-2.4.4.tar.gz 2 tar -zxvf 解压压缩包，cd /扩展包 （进入扩展包然后 运行phpize 一下是我环境中phpize的目录，/usr/local/php/bin/phpize (一定要
    • 线程池(Executors) shuizhaosi888 线程池
      在java类库中，任务执行的主要抽象不是Thread，而是Executor，将任务的提交过程和执行过程解耦 public interface Executor { void execute(Runnable command); }   public class RunMain implements Executor{ @Override pub
    • openstack 快速安装笔记 haoningabc openstack
      前提是要配置好yum源 版本icehouse，操作系统redhat6.5 最简化安装，不要cinder和swift 三个节点 172 control节点keystone glance horizon 173 compute节点nova 173 network节点neutron control /etc/sysctl.conf net.ipv4.ip_forward =
    • 从c面向对象的实现理解c++的对象（二） jimmee C++面向对象虚函数
      1. 类就可以看作一个struct，类的方法，可以理解为通过函数指针的方式实现的，类对象分配内存时，只分配成员变量的，函数指针并不需要分配额外的内存保存地址。 2. c++中类的构造函数，就是进行内存分配(malloc)，调用构造函数 3. c++中类的析构函数，就时回收内存(free) 4. c++是基于栈和全局数据分配内存的，如果是一个方法内创建的对象，就直接在栈上分配内存了。 专门在
    • 如何让那个一个div可以拖动 lingfeng520240 html
      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml
    • 第10章 高级事件（中） onestopweb 事件
      index.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/
    • 计算两个经纬度之间的距离 roadrunners 计算纬度LBS经度距离
      要解决这个问题的时候，到网上查了很多方案，最后计算出来的都与百度计算出来的有出入。下面这个公式计算出来的距离和百度计算出来的距离是一致的。 /** * * @param longitudeA * 经度A点 * @param latitudeA * 纬度A点 * @param longitudeB *
    • 最具争议的10个Java话题 tomcat_oracle java
      1、Java8已经到来。什么！？ Java8 支持lambda。哇哦，RIP Scala！ 　　随着Java8 的发布，出现很多关于新发布的Java8是否有潜力干掉Scala的争论，最终的结论是远远没有那么简单。Java8可能已经在Scala的lambda的包围中突围，但Java并非是函数式编程王位的真正觊觎者。 　 　2、Java 9 即将到来 　　 Oracle早在8月份就发布
    • zoj 3826 Hierarchical Notation(模拟) 阿尔萨斯 rar
      题目链接：zoj 3826 Hierarchical Notation 题目大意：给定一些结构体，结构体有value值和key值，Q次询问，输出每个key值对应的value值。 解题思路：思路很简单，写个类词法的递归函数，每次将key值映射成一个hash值，用map映射每个key的value起始终止位置，预处理完了查询就很简单了。 这题是最后10分钟出的，因为没有考虑value为{}的情
    按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他