JavaSpcript初识
---恢复内容开始---
1-语法标准(Ecmascript)
DOM
BOM
2=特点以及适用范围
简单易用:封装好了一些方法,属性
基于对象
面向对象: 属于编程思维(思想)
C#,C++,Java,PHP.....
基于对象:
3-解释执行
编译执行:(C#)
C#(源代码===)》编译(.dll文件)===》计算机执行dll文件
解释执行:JS特点(代码直接执行)
4-写法
内嵌式写法写在head标签里
<script type="css/javascript">
<script>
外联式写法
后缀名.js
引用<spript type="text/javascript src="""><spript>
5-补充属性
async:异步
注意:该属性指的是浏览器将外部JS文件下载完成后,立马执行。
defer:延时执行
注意:该属性值值得是浏览器将外部JS文件下载完成后按顺序执行。
行内(不常用)
<div onclick=“”***“”></div>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script type="css/javascript" src="1.js" async></script>
<script type="text/javascript">
alert(1)(括号里如果写汉字或者字母 需要带引号)
alert(1)
alert(1)
</head>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script>alert(1)</script>
<script>alert(2)</script>
<script>alert(3)</script>
<script type="css/javascript" src="1.js" defer></script>
<script type="text/javascript">
alert(4)
alert(5) </head>
---恢复内容结束---
1-语法标准(Ecmascript)
DOM
BOM
2=特点以及适用范围
简单易用:封装好了一些方法,属性
基于对象
面向对象: 属于编程思维(思想)
C#,C++,Java,PHP.....
基于对象:
3-解释执行
编译执行:(C#)
C#(源代码===)》编译(.dll文件)===》计算机执行dll文件
解释执行:JS特点(代码直接执行)
4-写法
内嵌式写法写在head标签里
<script type="css/javascript">
<script>
外联式写法
后缀名.js
引用<spript type="text/javascript src="""><spript>
5-补充属性
async:异步
注意:该属性指的是浏览器将外部JS文件下载完成后,立马执行。
defer:延时执行
注意:该属性值值得是浏览器将外部JS文件下载完成后按顺序执行。
行内(不常用)
<div onclick=“”***“”></div>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script type="css/javascript" src="1.js" async></script>
<script type="text/javascript">
alert(1)(括号里如果写汉字或者字母 需要带引号)
alert(1)
alert(1)
</head>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script>alert(1)</script>
<script>alert(2)</script>
<script>alert(3)</script>
<script type="css/javascript" src="1.js" defer></script>
<script type="text/javascript">
alert(4)
alert(5) </head>
6-JS中常用的输出消息的方式
通过alert(123)或者(“”字母“”或者“”汉字“”)
通过document.write(“”你好");
注意:该方法中还可以设置html标签
document.write(“”<h1>你好</h1>“”);
在控制台中输出消息
console.log(123);
console.log("你好");
接受用户输入信息
prompt(“”请输入您的姓名“”);
确定取消方法
confirm(“”确定退出么?“”)
7-变量(重点)
变量:会变化的量(数据)用来存储数据的容器
变量定义:var 变量名 = 值 ;
注意1 首先定义变量必须使用var 关键字
2 “”=“” 赋值运算符
3 一个变量只能保存一个值(只能保存最后一个赋值结果)
变量命名规范
不推荐使用汉字定义变量
不能使用特殊字符或者特殊字符开头
不能使用数字或者以数字开头定义变量
变量中间不能出现空格
不能使用关键字定义变量
不推荐使用保留字定义变量
注意:1一行完整的代码结束后必须以;结束
2 JS中区分字母大小写
8-数据类型介绍
数据类型是用来确定变量的存储位置
常见的数据类型:
1.数字类型(number)
如果一个变量的值是纯数字,那么该变量的数据类型就是数字类型
数字类型的表示方式有
十进制、十六进制(0X开头 0-f)、八进制(以0开头 0-7)
2.字符串类型(string)
如果一个变量的值使用双引号或者单引号,那么该变量的数据类型就是字符串类型。
字符串特性:不可变性。(在内存中的不可变,不是值不可变)(注意不要大量拼接字符串)
属性:变量.lengh 获取字符串长度
转义字符(了解)
\" 转双引号 \'转单引号 成对出现 例:alert(“今天学习了\“ js \” ”);
\r回车符
\n换行符
3.布尔类型(boolean)
如果一个变量的值是true或者false 那么该变量的数据类型就是布尔类型
对象(object)
看得到,摸得着,特征具体事物
//封装//继承//多态
1属性(特征)
2方法(功能)
创建对象
var 变量 = new Object()
var xw=new Object();
xw.name="小王";
xw.age=18;
xw.shengao=180;
//功能 函数(方法)
xw.say=function() {
alert("你好");}
console.log(xw.name+xw.age+xw.shengao);
通过字面量创建对象
var xw={
name:"小王",
age:18,
shengao:180};
数组(array)
undefined类型
如果一个变量的值是unddefined或者定义了一个变量没有给该变量赋值。那么该变量的数据类型就是undefined。
例子:变量在没有赋值的情况下,那么该变量的默认值就是undefined,对应的数据类型undefined类型。
例子var = 1
var n2
alert(n2);
比较运算符
大于 >
小于 <
等于 ==或者=== 一个=属于赋值运算符
不等于 !==
大于等于 =>
小于等于 <=
注意:1通过比较运算符得到的是一个布尔类型的结果
2一般情况下true代表正确的(条件成立),false代表错误的(条件不成立)
算数运算符
加 +
(1如果是数字类型的变量相加,最后结果也是数字类型
2如果是非数字类型的变量相加,最后的结果是字符串【加号起到的作用是连接作用】)
减 -
(1如果是数字类型变量相减,最后的结果是数字类型
2如果是数字的字符串相减,最后的结果是数字【由于:隐式数据类型转化】
3如果是非数字的字符串相减,最后得到的结果是NaN【NaN:not a number】)
乘 *
除 /
(1如果是数字类型的变量相除,最后的结果是数字类型
2如果除数是0,得到的结果是无穷大的值infinite)
取余 %
()优先级
数据类型判断
typeof(变量)===>用alert(typeof(X));来确定结果是什么数据类型
注意:1如果一个变量的值是NaN,那么该变量的数据类型就是number类型。
2如果一个变量的值是infinity,那么该变量的数据类型是number类型。
3如果一个变量的值是undefined,那么该变量的数据类型是undefined类型。
isNaN()判断是不是一个数字
新内容学习
1-Maht对象
Math.ceil(x) 对数字进行向上舍入(天花板函数)
注意:1该方法返回的是一个大于当前数字,并且与它接近的一个整数。
2如果当前数字是一个整数,那么返回的就是当前数字本身
Math.floor(x) 对数字进行向下舍入(地板函数)同天花板函数
Math.abs(x) 返回数字的绝对值
Math.radom() 返回0-1之间的随机数
注意:该方法不能取到0和1
Math.max(x,y) 返回X和Y之间的最大值
min(x,y)返回最小值
Math.round(x) 返回X的四舍五入值
注意:该方法返回的是一个整数
Math.pow(x,y) 返回X的Y次方
2-数据类型转换
1隐式转换
程序在参与运算的过程中,发生的数据转换
2 显式转换(强制转换)
工程师指定的具体数据类型
将数字类型转化为字符串类型
1通过变量 .toString()
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script type="text/javascript"> var n1=123;
alert(typeof(n1)); //数据类型转化
n1=n1.toString(); alert(n1);
alert(trpeof(n1));
</script></head>
2通过String()转化为字符串类型
将toSting行代码转化为 n1=String(n1)
字符串类型转成数字类型
1Number()
特点:转化为数字类型,保留原来值的内容
<script type="text/javascript"> var n1="123"; n1=Number(n1); alert(n1);
alert(typeof(n1));
2pasrInt(x) 特点:转化为整数,但只能保留整数部分。
3parseFloat(x) 特点:通过该方法可以转换为数字类型,但是要保留原来的内容。
2如果是非数字的字符串,直接保留数字部分
转化为布尔类型
Boolean(x) 注意1 数字0,空字符串,NaN,undefined,null转化为false
2除以上特殊值,转布尔类型都是true ture是1 0是false是规定
3-逻辑运算符
或运算 ||
注意:通过逻辑运算符要链接布尔类型的结果。
与(且)运算 &&
非 !
4-等于逗号运算符
= 赋值 == 相等:只判断值不判断数据类型 === 相等:同时判断值和数据类型 !=不相等
,运算符 var n1=123,n2=123;
5-分支结构(条件判断)
语法 if(条件表达式){逻辑代码;}
else{逻辑代码;}
执行顺序:首先进行条件判断,如果条件成立(true),那么程序执行if语句中的代码,反之else
6-断点调试
作用:获取程序中的执行过程,排查错误。
使用:首先运行程序》点击审查元素》点sources 在浏览器中打开代码点击html页面》设置断点》再次运行程序或者F5
》点击下一步或者F10
监视变量:1鼠标直接悬停变量 2 右键变量 添加监视变量。ADD~~WATCH
7-条件结构嵌套
语法:if(条件表达式){}else if (条件表达式){}else if{} else{}
执行顺序:首先进行表达式判断,如果条件为true那么就立即执行,如果条件为false那么执行else中的代码
8-三元运算
语法:条件表达式? 代码1:代码2;
执行顺序:如果条件成立执行代码1,如果条件不成立执行代码2
注意:1三元表达式可以嵌套,一般不推荐使用。
var n1=prompt("请输入一个数字”); //如果用if else写
if(n1%2==0){
alert("偶数");}
else{
alert(“奇数”);}//
//用三元运算//
n1%2==0?alert("偶数"):alert("奇数");
9-Switch(变量){
case 值1:
代码例如alert(n1)
break;
case 值2:
代码
break;}
注意1在Switch语句中,Switch中的变量数据类型必须与case后面的值的数据类型保持一致。
2一般情况下,如果变量表示的不是一个范围,而是一些具体值,可以考虑使用Switch结构
简写方式
switch(fname){ case"2": case"4": case"6"; alert("偶数"); break;
变量自增自减
var i =7;
变量自增:i++或者++i 例如J=i++的结果是J=i 如果是J=++i 就是 j==i+1
变量自减
循环
while循环
语法:初始化变量 var a=1;
while(条件表达式){
循环体代码;}
执行过程:1变量初始化 2开始判断条件 3 如果条件为true,那么程序会进入循环体代码 4如果条件为false,那么程序不会进入循环体中循环代码
do while循环
语法:初始化变量
do{
循环体;}
while(条件表达式)
执行顺序:1首先执行do中的代码 2然后判断条件是否成立 3如果条件成立,则继续成立do中的代码 4如果条件不成立,那么程序结束。
与while循环的区别:在条件不满足的情况下,do while要比while循环多执行一次。
for循环
语法: for(变量初始化;表达式;变量自增或自减){
循环体代码;}
执行过程:1变量初始化 2进行表达式判断 3 如果表达式成立,执行循环体中代码,然后进行变量自增或自减继续判断表达式成立,如果成立则继续 4 如果表达式不成立,则程序结束
例子:打印直角三角形
for(var i=1;i<=9;i++){ for(var j=1;j<=i;j++){
document.write("*");}
document.write("<br>");
}
创建表格
<style type="text/css">
table{width:400px;height:300px;border=collapse;} table,td{border:1px solid red;} <script type="text/javascript">
document.write("<table>");
//创建行tr
for(var i=1;i<=4;i++){
document.write("<tr>")
for(var j=1;j<=i;j++)
document.write("<td></td>") document.write("</tr>")
document.write("</table>")
break和continue语句
break:在循环中使用break语句,程序会跳出当前循环
例子:找出1-10中第一个是2的倍数
for(var i=1;i<=10;i++){
for(i%2==0){
alert(i);
break; } }
continue
结束本次循环,进入下次循环,continue后面的代码不会执行
例子:输出1-10所有数字 不包括6
for(var i=1;i<=10;i++){
if(i==6){
continue;
}
alert(i);
}
数组
数组可以一次保存多个值
定义数组:
*通过对象方式创建数组
var ary=new Array();
直接创建一个数组
var ary=[ ];’
数组赋值:
通过索引(下标)赋值 注意:数组中索引 号(编号)从0开始
var ary=[];
ary[0]=1;
console.log(ary);
数组遍历:
<script type="text/javascripe"> var ary=[1,2,3,4,5,6,7,8]; alert(ary.length);//获取数组长度 for(var i=0;i<ary.length;i++){ alert(ary[i]);}
</script>
数组中的方法补充
1 合并两个数组通过concat,通过该方法返回的是一个新数组,数据类型object
var ary1=[xxxx] ~~~2=[~~~] var ary3=ary1.concat(ary2);
alert(ary3);
2 join 更改数组显示方式,通过该方法的得到的是一个字符串类型
var ary=[1,2,3];
ary=ary.join("|");
alert(typeof(ary));
JavaSpcript初识的更多相关文章
- Android动画效果之初识Property Animation(属性动画)
前言: 前面两篇介绍了Android的Tween Animation(补间动画) Android动画效果之Tween Animation(补间动画).Frame Animation(逐帧动画)Andr ...
- 初识Hadoop
第一部分: 初识Hadoop 一. 谁说大象不能跳舞 业务数据越来越多,用关系型数据库来存储和处理数据越来越感觉吃力,一个查询或者一个导出,要执行很长 ...
- python学习笔记(基础四:模块初识、pyc和PyCodeObject是什么)
一.模块初识(一) 模块,也叫库.库有标准库第三方库. 注意事项:文件名不能和导入的模块名相同 1. sys模块 import sys print(sys.path) #打印环境变量 print(sy ...
- 初识IOS,Label控件的应用。
初识IOS,Label控件的应用. // // ViewController.m // Gua.test // // Created by 郭美男 on 16/5/31. // Copyright © ...
- UI篇(初识君面)
我们的APP要想吸引用户,就要把UI(脸蛋)搞漂亮一点.毕竟好的外貌是增进人际关系的第一步,我们程序员看到一个APP时,第一眼就是看这个软件的功能,不去关心界面是否漂亮,看到好的程序会说"我 ...
- Python导出Excel为Lua/Json/Xml实例教程(一):初识Python
Python导出Excel为Lua/Json/Xml实例教程(一):初识Python 相关链接: Python导出Excel为Lua/Json/Xml实例教程(一):初识Python Python导出 ...
- 初识SpringMvc
初识SpringMvc springMvc简介:SpringMVC也叫Spring Web mvc,属于表现层的框架.Spring MVC是Spring框架的一部分,是在Spring3.0后发布的 s ...
- 初识redis数据类型
初识redis数据类型 1.String(字符串) string是redis最基本的类型,一个key对应一个value. string类型是二进制安全的.意思是redis的string可以包含任何数据 ...
- Redis初识、设计思想与一些学习资源推荐
一.Redis简介 1.什么是Redis Redis 是一个开源的使用ANSI C 语言编写.支持网络.可基于内存亦可持久化的日志型.Key-Value 数据库,并提供多种语言的API.从2010 年 ...
随机推荐
- AOP之配置文件实现
看了http://www.cnblogs.com/xrq730/p/4919025.html这篇文章之后自己跟着做了一遍,有需要可以去看原文,比我写的更详细. AOP AOP(Aspect Orien ...
- sql数据表中的值重新命名
select u.id,u.name,u.sex, 2 (case u.sex 3 when 1 then '男' 4 when 2 then '女' 5 else '空的' 6 end 7 )性别 ...
- PROJ.4学习——初识PROJ
PROJ.4介绍——初始认识 前言 PROJ是一个通用的坐标转换软件,它将地理空间坐标从一个坐标系转换为另一个坐标系.这包括地图投影和大地坐标变换. PROJ包含命令行应用程序,可以方便地从文本文件或 ...
- JavaWeb+SVN+Maven+Tomcat +jenkins实现自动化部署
网址:https://blog.csdn.net/liyong1028826685/article/details/88289218 在日常开发项目中常见的开发模式是使用代码库来存放我们的项目例如:S ...
- Unity中使用百度中文语音识别功能
下面是API类 Asr.cs using System; using System.Collections; using System.Collections.Generic; using Unity ...
- 使用后台的limit 控制每页的容量
和上一个不使用limit的不同,如果不使用后台的限制,那么就必须自己定义一个计算属性,并且v-for这个计算的数组,而如果要用到后台的限制,那么就不需要自己计算,v-for的直接就是后台获取的数组 1 ...
- Tomcat各个版本下载路径
http://archive.apache.org/dist/tomcat/tomcat-7/ 修改对应版本号即可比如 tomcat-8
- PC/FORTH 下的多任务使用
body, table{font-family: 微软雅黑; font-size: 13.5pt} table{border-collapse: collapse; border: solid gra ...
- 如何理解JavaScript中的原型和原型链
首先是一张关系图,避免抽象化理解时产生的困难 Function对象 函数对象是JavaScript学习中不可避免的一部分,而且这一部分相对重要且抽象 函数的创建方式有2种: 字面量创建 var foo ...
- leetcode python 037 求解数独
import numpy as npimport syssys.setrecursionlimit(1000) #例如这里设置为一百万 def get1(n): if n<3: ...