-seventy-
-seventy-

JavaScript-1

基础认知

认识 JavaScript

是什么？
	JavaScript是一种运行在客户端（浏览器）的编程语言，能够实现人机交互效果

做什么？
	网页特效（监听用户的一些行为，让网页做出对应的反馈）
	表单验证（针对表单数据的合法性进行判断）
	数据交互（获取后台的数据，渲染到前端）
	服务端编程（node.js）

JavaScript 组成

  • ECMAScrpt：规定了js基础语法核心知识（比如：变量、分支语句、循环语句、对象等）
  • Web APIs
    • DOM：操作文档（比如：对页面元素进行移动、添加、删除等操作）
    • BOM：操作浏览器（比如：页面弹窗、检测窗口宽度、存储数据到浏览器等等）

JavaScript 位置

内部 JavaScript

<body>
    <div class="box">
        <p>你好，世界p>
    div>

    
    
    <script>
        // 在这里书写Javascript代码

        alert("Hello World")    // 页面弹出警示框

    script>
body>

具体位置：直接写在html文件里，用script标签包围JavaScript代码

书写规范：script标签写在的上面

外部 JavaScript


    

        
你好，世界

    



    
    


代码写在以.js结尾的文件里，通过script标签，引入到html页面中

内联 JavaScript


    


代码写在标签的内部

注意：此处作为了解即可，但是后面的vue框架会使用这种模式！

语法速查

MDN 官网：https://developer.mozilla.org/zh-CN/

注释

单行注释：
	符号：//
	VS Code快捷键：Ctrl + /
	
块注释：
	符号：/* */
	VS Code快捷键：Shift + Alt + A （注意：此快捷键可能与系统的截图快捷键冲突，可在VS Code中修改为其他快捷键）

结束符

    <script>
        alert("Hello World");
    script>

JavaScript 的结束符是";"

作用：使用英文的;代表语句结束

实际情况：实际开发中，可写可不写，浏览器（JavaScript 引擎）可以自动推断语句结束的位置

现状：越来越多的人主张省略结束符

约定：为了风格统一，结束符要么每一句都写，要么每一句都不写（按照团队要求）

输入

prompt

<body>
    <script>
        prompt('请输入您的姓名')
    script>
body>

作用：显示一个对话框，对话框中包含一条文字信息，用来提示用户输入文字

输出

write

<body>
    <script>
        // 输出内容到文档中
        document.write('
我是div标签
')
        document.write('
我是一级标题
')
    script>
body>

语法：document.write()

作用：向body内输出内容

注意：如果输出的内容写的标签，也会被解析成网页元素。

alert

<body>
    <script>
        alert("警示")
    script>
body>

作用：页面弹出警告对话框

console.log

<body>
    <script>
        console.log('输出内容到控制台')
    script>
body>

作用：输出到控制台，程序员调试时使用

变量

命名规范

规则：
	1.不能使用关键字
	2.只能用下划线、字母、数字、$组成，且不能数字开头
	3.字母严格区分大小写
	
规范：
	1.起名要有意义
	2.遵守小驼峰体命名法（例如：userName）

声明变量

<body>
    <script>
        // 声明变量
        let temp
        
        // 声明变量的同时，进行赋值
        let age = 18
        let name = 'Jack'
        
        // 一次性声明多个变量
        let a, b
        let c = 10, b = 'hello world'
        
        // 为了更好的可读性，一般声明多个变量采取"一行只声明一个变量"的形式
        let data1
        let data2
        let data3
        
    script>
body>

语法：
	let 变量名

更新变量


    


更新变量：变量赋值后，还可以更新它的值

注意：let 不允许多次声明一个变量

let 与 var

let 和 var 的区别：

  • 在较旧的 JavaScript 中，使用关键字 var 来声明变量，而不是 let

  • 现在的开发中一般不再使用 var ，只是我们可能在老版本的程序中看到它

  • let 解决了 var 的一些问题，更加先进！

var 声明：

  • 可以先使用，再进行声明（不合理）
  • var 声明过的变量可以重复声明（不合理）
  • 变量提升、全局变量、没有块级作用域等

数组

<body>
    <script>
        // 定义数组
        let nums = []

        // 赋值操作
        nums[0] = 10
        nums[1] = 20

        // 定义并初始化
        let names = ['Jack', 'Tony', 'Peter']

        // 输出数组元素
        console.log(nums[0])
        console.log(nums[1])
        console.log(names[0])
        console.log(names[1])
        console.log(names[2])

        // 输出数组长度
        console.log(names.length)
    script>
body>

概念：一种将"一组数据存储在单个变量名下"的优雅方式

语法：
	let arr = []

常量

<body>
    <script>
        const PI = 3.14
        console.log(PI);
    script>
body>

概念：使用 const 声明的变量称为"常量"

使用场景：当某个变量永远不会改变时，就可以用 const 来声明，而不用 let

注意：常量不允许重新赋值，这意味着声明的时候就必须进行初始化

规范：英文全部大写（可以不遵守）

数据类型

基本数据类型

类型名称 Type Name
数字型 number
字符串型 string
布尔型 boolean
未定义型 undefined
空类型 null

引用数据类型

类型名称 Type Name
对象 object

数字类型

算术运算符

<body>
    <script>
        // 求余数：
        console.log(5 % 3);     // 结果为 2
    script>
body>

"数学运算符"也叫"算术运算符"，主要包括以下几个部分：
加(+)	减(-)	乘(*)	除(/)	取余(%)

优先级：
	1.括号
	2.乘、除、取余
	3.加减

NaN

NaN：not a number

NaN 代表计算错误！它是一个不正确的或者一个未定义的数学操作所得到的结果

NaN 是粘性的，任何对 NaN 的操作都会返回 NaN（例如：NaN + 6 的结果还是 NaN）

字符串类型

认识字符串

<body>
    <script>
        let name = 'Jack'       // 使用单引号
        let gender = "male"     // 使用双引号
        let goods = `HUAWEI`    // 使用反引号
        let tel = '13636975625' // 字符串
        let str = ''            // 空字符串
    script>
body>

1.通过单引号、双引号、或反引号包裹的数据都是字符串

2.单引号和双引号没有本质上的区别，推荐使用单引号!

3.必要时可以使用转义符"\"，输出单引号和双引号

字符串拼接

<body>
    <script>
        let age = 30
        document.write('年龄：' + age + '岁')
    script>
body>

运行结果：
	年龄：30岁

模板字符串

<body>
    <script>
        let age = 30
        document.write(`Jack已经${age}岁了`)
    script>
body>

运行结果：
	Jack已经30岁了

语法：
	用"反引号"去包含字符串，遇到变量则使用 ${变量}

布尔类型

<body>
    <script>
        let isCool = true
        isCool = false
        console.log(isCool);
    script>
body>

未定义类型

基本介绍：
	"未定义"是比较特殊的类型，只有一个值 undefined

什么情况出现未定义类型？
	只声明变量，不赋值的情况下，变量的默认值为 undefined，一般很少（直接）为某个变量赋值为 undefined

使用场景：
	我们开发中经常生命一个变量，等待传送过来的数据，如果我们不知道这个数据是否传递过来，此时我们可以通过检测这个变量是不是 undefined，就判断用户是否有数据传递过来

空类型

<body>
    <script>
        let obj = null
        console.log(obj)
    script>
body>

null 和 undefined 的区别

  • undefined 表示没有赋值
  • null 表示赋值了，但是内容为空
  • 计算有明显区别
    • undefined + 1 的结果为 undefined
    • null + 1 的结果为 1

检测数据类型

<body>
    <script>
        let num = 10
        console.log(typeof num)
    script>
body>

typeof 运算符可以返回被检测的数据类型，它支持两种语法格式
	1.作为运算符：typeof x	(常用的写法)
	2.函数形式：typeof(x)
	
提示：有括号和没有括号，得到的结果是一样的，所以我们直接使用"运算符"的写法

类型转换

隐式转换

规则：
	+ 号两边只要有一个是字符串，都会把另外一个转成字符串
	除了 + 以外的算术运算符，比如 - * / 等都会把数据转成数字类型

缺点：
	转换类型不明确，靠经验才能总结

显示转换

<body>
    <script>
        let str = '123'
        console.log(Number(str))                // 123
        // ---------------
        console.log(parseInt('12px'))           // 12
        console.log(parseInt('12.78px'))        // 12
        console.log(parseInt('13.14Love'))      // 13
        // ---------------
        console.log(parseFloat('12px'))         // 12
        console.log(parseFloat('12.678px'))     // 12.678
        console.log(parseFloat('13.14Love'))    // 13.14
        // ---------------
        console.log(parseInt('abc3.14'))        // NaN
        console.log(parseFloat('abc3.14'))      // NaN
    script>
body>

为了避免"隐式转换"带来的问题，通常需要对数据进行显示转换

语法：
	Number(数据)
	// 转成数字类型
	// 如果字符串内容里面有非数字，转换失败时结果为 NaN（Not a Number）

	parseInt(数据)
	// 只保留整数（具有去除非数字部分字符的能力）
	
	parseFloat(数据)
	// 可以保留小数（具有去除非数字部分字符的能力）

你可能感兴趣的:(前端-JavaScript,javascript)

  • ts之变量声明以及语法细节，ts小白初学ing 菥菥爱嘻嘻 小白学习tstypescript前端
    TypeScript用js编写的项目虽然开发很快，但是维护是成本很高，而且js不报错啊啊啊啊啊！！！以js为基础进行扩展的给变量赋予了类型语法、实战(ts+vue3)TypeScript是JavaScript的一个超集，支持ECMAScript6标准（ES6教程）。TypeScript由微软开发的自由和开源的编程语言，在JavaScript的基础上增加了静态类型检查的超集。TypeScript设计
  • Node.js 如何发布一个 NPM 包——详细教程 还是鼠鼠 node.jsnpm前端node.jsvscode
    在本文中，我将带大家一步步学习如何创建并发布一个NPM包，帮助开发者理解整个流程，并能顺利将自己的JavaScript库发布到NPM上供他人使用。1.安装Node.js和npm在开始之前，请确保你的电脑上已经安装了Node.js和npm（Node.js自带npm）。你可以在终端（Windows用户请使用cmd或PowerShell）输入以下命令检查是否已安装：node-vnpm-v如果出现版本号，
  • 【前端】实操tips集合 JAMJAM_NoName 前端学习前端javascript开发语言
    1.关闭vue中组件名字的多词校验(1)package.json文件中修改eslint配置"eslintConfig":{"rules":{"vue/multi-word-component-names":"off"}},（2）.eslintrc.js或者.eslintrc配置文件中进行配置module.exports={rules:{'vue/multi-word-component-names
  • 前端技术学习记录：react+dvajs+ant design实现暴走计算器的页面重构（二） 大泡泡糖 学习记录reactjs前端gitwebstorm
    前端技术学习记录：react+dvajs+antdesign实现暴走计算器的页面重构（二）前言定义Modelconnect起来更新state拥抱变化主题切换更换页面获取当前设备类型编写武学选择前言www定义Model完成UI后，现在开始处理数据和逻辑。dva通过model的概念把一个领域的模型管理起来，包含同步更新state的reducers，处理异步逻辑的effects，订阅数据源的subscr
  • 包管理工具 她的双马尾 JSjavascript包管理工具npmyarnpnpm
    JavaScript包管理工具对比：npm、yarn和pnpm1.npm1.1历史与背景npm（NodePackageManager）是Node.js的默认包管理工具，首次发布于2010年。它是JavaScript生态系统中最早的包管理工具，主要用于管理和共享JavaScript模块。目前，npm拥有全球最大的JavaScript包注册中心（npmregistry），包含数百万个开源包。1.2核心
  • uniapp Deepsleep. uni-app
    uni-app是一个使用Vue.js开发所有前端应用的框架，可以编译到iOS、Android、H5、以及各种小程序等多个平台。以下是uni-app页面生命周期的详细介绍，包括一些简单的示例：初始化阶段onLoad(options)触发时机：页面加载时触发，且只触发一次。参数：options是一个包含页面路径参数的对象。示例：从上一个页面传递参数到当前页面。onLoad(options){conso
  • 若依框架二次开发——启动 RuoYi-Cloud 微服务项目 bjzhang75 项目开发实践微服务若依
    文章目录前期准备第一步：拉取RuoYi-Cloud项目源码第二步：初始化数据库1.创建数据库2.导入数据第三步：配置Nacos并启用持久化1.下载并解压Nacos2.启动Nacos3.访问Nacos控制台第四步：安装并运行Redis1.安装Redis2.启动Redis第五步：修改后端配置第六步：启动后端服务第七步：启动前端项目1.进入前端项目目录2.安装前端依赖3.启动前端第八步：访问系统总结Ru
  • 前端实例：轮播图效果 2301_81535770 前端
    利用HTML、CSS和JavaScript实现轮播图效果。一、轮播图原理：通过给窗口设置position属性和overflow属性，使得超出窗口范围的部分被隐藏，表面可见范围只包含窗口，但实际上其内部空间很大；调整胶卷相对于窗口的位置，使得整个胶卷向左移动；调用JS中的定时器，实现轮播效果。流程图如下：二、实现自动切换效果1、HTML搭建基础框架分为图片展示窗口和上下页切换按键两部分>2、CSS设
  • Angular与Laravel的CSRF问题探讨与解决 t0_54manong 编程问题解决手册angular.jslaravelcsrf个人开发
    在现代Web开发中，安全性是一个不容忽视的关键问题。跨站请求伪造（CSRF）攻击是常见的安全威胁之一，幸运的是，Laravel框架已经为我们提供了强大的CSRF保护机制。然而，当我们将Angular前端与Laravel后端集成时，可能会遇到一些CSRF相关的挑战。今天我们将通过一个具体的案例来探讨如何解决Angular与Laravel之间的CSRF问题。背景介绍假设我们有一个使用Angular开发
  • 前端请求怎么发送到后端：深度剖析与实用指南 dhfnngte24fhfn pythondjangopygamevirtualenv
    前端请求怎么发送到后端：深度剖析与实用指南在web开发中，前端与后端之间的通信是至关重要的。前端通过发送请求来获取后端的数据或执行某些操作，而后端则负责处理这些请求并返回相应的响应。本文将分四个方面、五个方面、六个方面和七个方面，深入剖析前端请求是如何发送到后端的，并为你提供实用的指南。四个方面：请求与响应的基础首先，我们需要了解前端请求与后端响应的基础概念。前端通过HTTP协议向后端发送请求，后
  • SpringMVC-解决跨域的两种方案 青岛欢迎您 开发框架springmvc
    1.什么是跨域跨域，即跨站HTTP请求(Cross-siteHTTPrequest)，指发起请求的资源所在域不同于请求指向资源所在域的HTTP请求。2.跨域的应用情景当使用前后端分离，后端主导的开发方式进行前后端协作开发时，常常有如下情景：后端开发完毕在服务器上进行部署并给前端API文档。前端在本地进行开发并向远程服务器上部署的后端发送请求。在这种开发过程中，如果前端想要一边开发一边测试接口，就需
  • Vue——Vue-cli脚手架+前端路由 pdsu_zhao VueVue学习之旅vuev-routerv-resourcevue-cliES6
    Vue-cli是Vue的脚手架工具可以进行目录结构、本地调试、代码部署、热加载、单元测试1、MVVM框架View——ViewModel——Model（视图）（通讯）（数据）“DOM”“观察者vue实例”“Javascript”注意：交互为双向的特点：（1）针对具有复杂交互逻辑的前端应用；（2）提供基础的架构抽象；（3）通过Ajax数据持久化，保证前端用户体验。2、什么是Vue.js它是一个轻量级M
  • Angular与ASP.NET Core：解决表单数据传输问题 t0_54coder 编程问题解决手册angular.jsasp.net前端个人开发
    在现代Web开发中，Angular和ASP.NETCore是两个非常流行的框架，它们的组合可以构建出高效且易于维护的应用程序。然而，在使用Angular发送表单数据到ASP.NETCoreAPI时，开发者常常会遇到一些数据传输的问题。今天我们就来探讨如何正确地处理这种情况，并通过实际例子来展示解决方案。问题描述假设我们有一个Angular前端应用，需要将一个包含文件和其他数据的表单提交到ASP.N
  • 2021-最新Web前端经典面试试题及答案-史上最全前端面试题(含答案)---React篇 圆白菜和大白菜 前端react大前端react
    ★★★React事件绑定原理★★★React中的setState缺点是什么呢★★★React组件通信如何实现★★★类组件和函数组件的区别★★★请你说说React的路由是什么？★★★★★React有哪些性能优化的手段？★★★★Reacthooks用过吗，为什么要用？★★★★虚拟DOM的优劣如何？实现原理？★★★★React和Vue的diff时间复杂度从O(n^3)优化到O(n)，那么O(n^3)和O
  • 深入浅出：序列化与反序列化的全面解析 进击的小白菜 一些开发常识开发语言开发常识
    文章目录1.引言2.什么是序列化？2.1为什么需要序列化？3.什么是反序列化？3.1反序列化的重要性4.序列化与反序列化的实现4.1JSON(JavaScriptObjectNotation)4.2XML(eXtensibleMarkupLanguage)4.3ProtocolBuffers(Protobuf)4.4MessagePack5.安全性考虑6.性能优化7.结论附录：常见问题解答Q1:什
  • Android :实现登录功能的思路 前期后期 android
    android的登录功能和前端一样，需要保存登录的用户信息。创建一个工具类//用户工具类，用于管理用户登录状态和用户信息objectAppUserUtil{//常量定义privateconstvalLOGGED_FLAG="logged_flag"//登录状态的键名privateconstvalUSER_INFO="user_info"//用户信息的键名privateconstvalTAG="Ap
  • Electron打包文件生成.exe文件打开即可使用 糕冷小美n electronjavascript前端
    1、Electron打包，包括需要下载的内容和环境配置步骤注意：Electron是一个使用JavaScript、HTML和CSS构建跨平台桌面应用程序的框架首先需要电脑环境有Node.js和npm我之前的文章有关nvm下载node的说明也可以去官网下载检查是否有node和npm环境命令node-vnpm-v输出版本号，说明安装成功2、创建Electron项目2.1创建项目目录打开命令行工具，创建一
  • JavaScript基础-事件对象 難釋懷 javascript开发语言
    在现代Web开发中，事件处理是实现动态和交互式网页的核心。当用户与页面进行交互时（如点击按钮、提交表单等），浏览器会生成相应的事件。为了有效地响应这些事件，JavaScript提供了事件对象，它包含了关于事件的详细信息。本文将详细介绍事件对象的概念、重要的属性和方法，并通过实例展示其应用场景。一、什么是事件对象？每当一个事件被触发时，浏览器都会创建一个事件对象，这个对象包含了该事件的所有相关信息，
  • Three.js世界中的三要素：场景、相机、渲染器 Front_Yue 3D技术实践指南javascriptthree.js3d
    一、Three.js简介Three.js是一个基于WebGL的JavaScript库，它允许开发者在网页上创建和显示复杂的3D图形和动画，而无需用户安装任何额外的插件或软件。Three.js在Web开发中的地位非常重要，它通过提供简单直观的API，极大地降低了3D图形开发的门槛，使得开发者可以更专注于实现创意。Three.js广泛应用于游戏开发、虚拟现实、数据可视化、艺术创作等多个领域。二、场景：
  • PHP框架为基础的购物平台设计思路分步骤说明 星糖曙光 后端语言（nodejavascriptvue等等）学习课程设计vue.jspythonphp
    以下是以PHP框架为基础的购物平台设计思路分步骤说明：一、技术选型阶段技术栈={后端框架：Laravel/Yii2（提供ORM、路由、中间件支持）前端框架：Vue.js/React（可选SPA方案）数据库：MySQL8.0+（事务型数据存储）缓存：Redis（会话/商品缓存）队列：RabbitMQ（异步处理订单）\text{技术栈}=\begin{cases}后端框架：Laravel/Yii2（提
  • 致现在的我与未来的我：编程长河中的摆渡手札 星糖曙光 后端语言（nodejavascriptvue等等）笔记学习深度学习人工智能网络
    致现在的我与未来的我：编程长河中的摆渡手札一、技术积累：从萤火微光到星河初现（约3000字）前端的启蒙：HTML/CSS与"所见即所得"的魔法“代码是诗，但诗未必能成为产品”，初学编程时，我如《禅与摩托车维修艺术》中追寻"良质"的探索者，在W3School的教程中笨拙地敲下第一行。记得仿写京东首页时，一个浮动布局的错位让我通宵调试，最终发现竟是未闭合的标签——这让我想起《代码大全》中的警示：“计算
  • 若依集成knife4j实现swagger文档增强 Roc-xb knife4j
    knife4j的前身是swagger-bootstrap-ui，为了契合微服务的架构发展,由于原来swagger-bootstrap-ui采用的是后端Java代码+前端Ui混合打包的方式,在微服务架构下显的很臃肿,因此项目正式更名为knife4j。目录一、单体版本1、ruoyi-admin\pom.xml模块添加整合依赖2、SwaggerController.java修改跳转访问地址二、前后端分离
  • C++在线OJ负载均衡项目 平凡的小y c++开发语言
    1.演示项目项目源码链接：2.项目所用技术和开发环境所用技术C++STL标准库Boost准标准库(字符串切割)cpp-httplib第三方开源网络库ctemplate第三方开源前端网页渲染库jsoncpp第三方开源序列化、反序列化库负载均衡设计MySQLCconnectAce前端在线编辑器html/css/js/jquery/ajax开发环境Ubuntu云服务器vscodeMysqlWorkben
  • JavaScript基础-DOM的一些基本常用语法 Southern Wind JavaScriptjavascript
    总结了一下JS一直到DOM中所用的单词的用法输入方式：window.prompt('请输入数据');输出方式：1、window.alert('HelloJavaScript');2、console.log输出到控制台3、输出数据到页面document.write('hello')JavaScript数据类型1、基本类型string：字符型number：数值型boolean：布尔型2、特殊类型und
  • JavaScript基础-删除事件（解绑事件） 難釋懷 javascript前端开发语言
    在现代Web开发中，动态地添加和移除事件处理器是构建交互式网页的关键技能之一。虽然添加事件处理器相对直观，但了解如何有效地移除或“解绑”这些处理器同样重要。这不仅有助于优化性能，还能防止潜在的内存泄漏问题。本文将介绍几种方法来删除JavaScript中的事件处理器，并探讨它们的应用场景及最佳实践。一、为什么需要删除事件？随着页面复杂度的增加，不恰当地管理事件处理器可能会导致性能下降或出现意外行为。
  • rocketmq-client 4.3.0 在springboot中的使用 Myueye JAVAjava
    rocketmq-client4.3.0在springboot中的使用1、导入依赖2、配置文件属性3、编写配置类4、使用测试5、结果5.1RocketMQ后台显示5.2前端页面5.3后端后台1、导入依赖org.apache.rocketmqrocketmq-client4.3.02、配置文件属性mq.nameserverAdd=ip地址:9876mq.topic=top1(topic名称)mq.p
  • 六十天前端强化训练之第二十九天之深入解析：从零构建企业级Vue项目的完整指南 编程星辰海 #前端前端Vue项目
    =====欢迎来到编程星辰海的博客讲解======看完可以给一个免费的三连吗，谢谢大佬！目录一、Vite核心原理与开发优势二、项目创建深度解析三、配置体系深度剖析四、企业级项目架构设计五、性能优化实战六、开发提效技巧七、质量保障体系八、扩展阅读推荐一、Vite核心原理与开发优势1.1为什么选择Vite？Vite采用现代浏览器原生ES模块系统（NativeESM）作为开发服务器，颠覆了传统打包工具的
  • HTTP核心知识 Sean2077 HTTPhttp
    理解HTTP协议是优化Web应用性能、调试问题和实现高效通信的基础。以下是前端开发者需要掌握的核心HTTP知识：1.HTTP基础概念请求与响应模型理解客户端（浏览器）发送HTTP请求，服务器返回HTTP响应的基本流程。HTTP方法（Methods）GET：获取资源（幂等操作）POST：提交数据（非幂等）PUT：更新资源DELETE：删除资源HEAD：仅获取响应头OPTIONS：查看服务器支持的通信
  • 前端性能优化-知识点 甲亿 前端性能优化
    Web性能优化意义1.减少整体加载时间：减小文件体积、减少HTTP请求、使用预加载。2.使网站尽快可用：仅加载首屏内容，其他内容根据需要进行懒加载。3.平滑和交互性：使用CSS替代JS动画、减少UI重绘。4.加载表现形式：使用加载动画、进度条、骨架屏等过渡信息，让用户感觉到页面加载更快。5.性能监测：性能指标、性能测试、性能监控持续优化等Web性能指标RAIL性能模型Response(响应)：快速
  • JavaScript 性能优化实战：优化循环结构提升效率 deying0865423 javascript开发语言
    目录一、理解循环的性能损耗二、减少循环迭代次数（一）缓存数组长度（二）提前终止循环三、优化循环内部操作（一）避免在循环内执行复杂计算（二）减少DOM操作四、选择合适的循环类型（一）for循环与while循环的选择（二）for...in与for...of的使用场景在JavaScript编程中，循环结构是实现重复执行任务的基础工具。然而，不当的循环使用常常会导致性能瓶颈，特别是在处理大量数据时，循环的
  • SQL的各种连接查询 xieke90 UNION ALLUNION外连接内连接JOIN
    一、内连接   概念：内连接就是使用比较运算符根据每个表共有的列的值匹配两个表中的行。                 内连接（join 或者inner join ）       SQL语法：       select * fron
  • java编程思想--复用类 百合不是茶 java继承代理组合final类
          复用类看着标题都不知道是什么,再加上java编程思想翻译的比价难懂,所以知道现在才看这本软件界的奇书   一:组合语法:就是将对象的引用放到新类中即可     代码:     package com.wj.reuse; /** * * @author Administrator 组
  • [开源与生态系统]国产CPU的生态系统 comsci cpu
          计算机要从娃娃抓起...而孩子最喜欢玩游戏....       要让国产CPU在国内市场形成自己的生态系统和产业链,国家和企业就不能够忘记游戏这个非常关键的环节....       投入一些资金和资源,人力和政策,让游
  • JVM内存区域划分Eden Space、Survivor Space、Tenured Gen，Perm Gen解释 商人shang jvm内存
    jvm区域总体分两类，heap区和非heap区。heap区又分：Eden Space（伊甸园）、Survivor Space(幸存者区)、Tenured Gen（老年代-养老区）。 非heap区又分：Code Cache(代码缓存区)、Perm Gen（永久代）、Jvm Stack(java虚拟机栈)、Local Method Statck(本地方法栈)。 HotSpot虚拟机GC算法采用分代收
  • 页面上调用 QQ oloz qq
    <A href="tencent://message/?uin=707321921&amp;Site=有事Q我&amp;Menu=yes">   <img style="border:0px;" src=http://wpa.qq.com/pa?p=1:707321921:1></a>
  • 一些问题 文强chu 问题
    1.eclipse 导出 doc  出现“The Javadoc command does not exist.” javadoc command 选择 jdk/bin/javadoc.exe 2.tomcate 配置 web 项目 ..... SQL:3.mysql  * 必须得放前面 否则  select&nbs
  • 生活没有安全感 小桔子 生活孤独安全感
           圈子好小，身边朋友没几个，交心的更是少之又少。在深圳，除了男朋友，没几个亲密的人。不知不觉男朋友成了唯一的依靠，毫不夸张的说，业余生活的全部。现在感情好，也很幸福的。但是说不准难免人心会变嘛，不发生什么大家都乐融融，发生什么很难处理。我想说如果不幸被分手(无论原因如何)，生活难免变化很大，在深圳，我没交心的朋友。明
  • php 基础语法 aichenglong php 基本语法
    1 .1 php变量必须以$开头 <?php $a=” b”; echo ?> 1 .2 php基本数据库类型 Integer  float/double Boolean string 1 .3 复合数据类型 数组array和对象 object 1 .4 特殊数据类型  null 资源类型(resource)    $co
  • mybatis tools 配置详解 AILIKES mybatis
    MyBatis Generator中文文档 MyBatis Generator中文文档地址： http://generator.sturgeon.mopaas.com/ 该中文文档由于尽可能和原文内容一致，所以有些地方如果不熟悉，看中文版的文档的也会有一定的障碍，所以本章根据该中文文档以及实际应用，使用通俗的语言来讲解详细的配置。 本文使用Markdown进行编辑，但是博客显示效
  • 继承与多态的探讨 百合不是茶 JAVA面向对象 继承 对象
    继承 extends   多态 继承是面向对象最经常使用的特征之一：继承语法是通过继承发、基类的域和方法 //继承就是从现有的类中生成一个新的类，这个新类拥有现有类的所有extends是使用继承的关键字：     在A类中定义属性和方法； class A{ //定义属性 int age； //定义方法 public void go
  • JS的undefined与null的实例 bijian1013 JavaScriptJavaScript
    <form name="theform" id="theform"> </form> <script language="javascript"> var a alert(typeof(b)); //这里提示undefined if(theform.datas
  • TDD实践（一） bijian1013 java敏捷TDD
    一.TDD概述         TDD：测试驱动开发，它的基本思想就是在开发功能代码之前，先编写测试代码。也就是说在明确要开发某个功能后，首先思考如何对这个功能进行测试，并完成测试代码的编写，然后编写相关的代码满足这些测试用例。然后循环进行添加其他功能，直到完全部功能的开发。     
  • [Maven学习笔记十]Maven Profile与资源文件过滤器 bit1129 maven
    什么是Maven Profile Maven Profile的含义是针对编译打包环境和编译打包目的配置定制，可以在不同的环境上选择相应的配置，例如DB信息，可以根据是为开发环境编译打包，还是为生产环境编译打包，动态的选择正确的DB配置信息   Profile的激活机制 1.Profile可以手工激活，比如在Intellij Idea的Maven Project视图中可以选择一个P
  • 【Hive八】Hive用户自定义生成表函数(UDTF) bit1129 hive
    1. 什么是UDTF   UDTF，是User Defined Table-Generating Functions，一眼看上去，貌似是用户自定义生成表函数，这个生成表不应该理解为生成了一个HQL Table， 貌似更应该理解为生成了类似关系表的二维行数据集   2. 如何实现UDTF 继承org.apache.hadoop.hive.ql.udf.generic
  • tfs restful api 加auth 2.0认计 ronin47
    　　目前思考如何给tfs的ngx-tfs api增加安全性。有如下两点： 　　一是基于客户端的ip设置。这个比较容易实现。 　　二是基于OAuth2.0认证，这个需要lua，实现起来相对于一来说，有些难度。 　　现在重点介绍第二种方法实现思路。 　　 前言：我们使用Nginx的Lua中间件建立了OAuth2认证和授权层。如果你也有此打算，阅读下面的文档，实现自动化并获得收益。SeatGe
  • jdk环境变量配置 byalias javajdk
    进行java开发，首先要安装jdk，安装了jdk后还要进行环境变量配置： 1、下载jdk（http://java.sun.com/javase/downloads/index.jsp），我下载的版本是：jdk-7u79-windows-x64.exe 2、安装jdk-7u79-windows-x64.exe 3、配置环境变量：右击"计算机"-->&quo
  • 《代码大全》表驱动法-Table Driven Approach-2 bylijinnan java
    package com.ljn.base; import java.io.BufferedReader; import java.io.FileInputStream; import java.io.InputStreamReader; import java.util.ArrayList; import java.util.Collections; import java.uti
  • SQL 数值四舍五入 小数点后保留2位 chicony 四舍五入
    1.round() 函数是四舍五入用，第一个参数是我们要被操作的数据，第二个参数是设置我们四舍五入之后小数点后显示几位。 2.numeric 函数的2个参数，第一个表示数据长度，第二个参数表示小数点后位数。 例如： 　　select   cast(round(12.5,2)   as   numeric(5,2))  
  • c++运算符重载 CrazyMizzz C++
    一、加+，减-，乘*，除/ 的运算符重载 Rational operator*(const Rational &x) const{ return Rational(x.a * this->a); } 在这里只写乘法的，加减除的写法类似 二、<<输出,>>输入的运算符重载      &nb
  • hive DDL语法汇总 daizj hive修改列DDL修改表
    hive DDL语法汇总 １、对表重命名 hive> ALTER TABLE table_name RENAME TO new_table_name;   2、修改表备注 hive> ALTER TABLE table_name SET TBLPROPERTIES ('comment' = new_comm
  • jbox使用说明 dcj3sjt126com Web
    参考网址：http://www.kudystudio.com/jbox/jbox-demo.html jBox v2.3 beta [ 点击下载]  技术交流QQGroup：172543951 100521167 [2011-11-11] jBox v2.3 正式版 - [调整&修复] IE6下有iframe或页面有active、applet控件
  • UISegmentedControl 开发笔记 dcj3sjt126com
      //    typedef NS_ENUM(NSInteger, UISegmentedControlStyle) {     //        UISegmentedControlStylePlain,     // large plain   &
  • Slick生成表映射文件 ekian scala
    Scala添加SLICK进行数据库操作，需在sbt文件上添加slick-codegen包 "com.typesafe.slick" %% "slick-codegen" % slickVersion 因为我是连接SQL Server数据库，还需添加slick-extensions，jtds包 "com.typesa
  • ES-TEST gengzg test
    package com.MarkNum; import java.io.IOException; import java.util.Date; import java.util.HashMap; import java.util.Map; import javax.servlet.ServletException; import javax.servlet.annotation
  • 为何外键不再推荐使用 hugh.wang mysqlDB
    表的关联，是一种逻辑关系，并不需要进行物理上的“硬关联”，而且你所期望的关联，其实只是其数据上存在一定的联系而已，而这种联系实际上是在设计之初就定义好的固有逻辑。 在业务代码中实现的时候，只要按照设计之初的这种固有关联逻辑来处理数据即可，并不需要在数据库层面进行“硬关联”，因为在数据库层面通过使用外键的方式进行“硬关联”，会带来很多额外的资源消耗来进行一致性和完整性校验，即使很多时候我们并不
  • 领域驱动设计 julyflame VODAO设计模式DTOpo
    概念： VO（View Object）：视图对象，用于展示层，它的作用是把某个指定页面（或组件）的所有数据封装起来。 DTO（Data Transfer Object）：数据传输对象，这个概念来源于J2EE的设计模式，原来的目的是为了EJB的分布式应用提供粗粒度的数据实体，以减少分布式调用的次数，从而提高分布式调用的性能和降低网络负载，但在这里，我泛指用于展示层与服务层之间的数据传输对
  • 单例设计模式 hm4123660 javaSingleton单例设计模式懒汉式饿汉式
           单例模式是一种常用的软件设计模式。在它的核心结构中只包含一个被称为单例类的特殊类。通过单例模式可以保证系统中一个类只有一个实例而且该实例易于外界访问，从而方便对实例个数的控制并节约系统源。如果希望在系统中某个类的对象只能存在一个，单例模式是最好的解决方案。      &nb
  • logback zhb8015 loglogback
    一、logback的介绍      Logback是由log4j创始人设计的又一个开源日志组件。logback当前分成三个模块：logback-core,logback- classic和logback-access。logback-core是其它两个模块的基础模块。logback-classic是log4j的一个 改良版本。此外logback-class
  • 整合Kafka到Spark Streaming——代码示例和挑战 Stark_Summer sparkstormzookeeperPARALLELISMprocessing
    作者Michael G. Noll是瑞士的一位工程师和研究员，效力于Verisign，是Verisign实验室的大规模数据分析基础设施（基础Hadoop）的技术主管。本文，Michael详细的演示了如何将Kafka整合到Spark Streaming中。 期间， Michael还提到了将Kafka整合到 Spark Streaming中的一些现状，非常值得阅读，虽然有一些信息在Spark 1.2版
  • spring-master-slave-commondao 王新春 DAOspringdataSourceslavemaster
    互联网的web项目，都有个特点：请求的并发量高，其中请求最耗时的db操作，又是系统优化的重中之重。 为此，往往搭建 db的 一主多从库的 数据库架构。作为web的DAO层，要保证针对主库进行写操作，对多个从库进行读操作。当然在一些请求中，为了避免主从复制的延迟导致的数据不一致性，部分的读操作也要到主库上。（这种需求一般通过业务垂直分开，比如下单业务的代码所部署的机器，读去应该也要从主库读取数
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他