JavaScript基础笔记(Day01)

JavaScript:简称:js

js(原名LiveScript)分为三部分
-ECMAScript 标准----js的基本语法
-DOM-----Document Object Model 文档对象模型
-BOM-----Browser Object Model 浏览器对象模型

JavasScript是什么?

  • 是一门脚本语言
  • 是一门解释性语言
  • 是一门动态类型的语言
  • 是一门基于对象的语言

拓展:

编译语言:需要把代码翻译成计算机所认知的二进制的语言才能够执行,
脚本语言:不需要编译,直接执行
常见的脚本语言:t - sql,cmd

js的作用?

解决用户和浏览器之间的交互问题

页面代码包含:

html:是标记语言,展示数据
css:美化页面
js:用户与浏览器交互

js代码可以分为三个地方书写:

  • 在html的文件中,script的标签中写js代码
  • js的代码可以在html的标签中书写
  • 在js文件中可以写js代码,但是需要在html的页面中引入ScriptDear标签中的scr="js路径"

js代码的注意问题:

1.在一对script的标签中有错误的js代码,那么该错误的代码后面的js代码不会执行
2.如果第一对的script标签中有错误,不会影响后面的script标签中的js代码执行
3.script的标签中可以写什么内容type="text/javascript"是标准写法或者写language="JavaScript"都可以
* 但是,目前在我们的html页面中,type和language都可以省略,原因:html是遵循h5的标准

4.有可能会出现这种情况:script标签中可能同时出现type和language的写法.
如:
<script type="text/javascript" language="JavaScript">
</script>
5.script标签在页面中可以出现多对
6.script标签一般是放在body的标签的最后的,有的时候会在head标签中
7.如果script标签是引入外部js文件的作用,那么这对标签中不要写任何的js代码,如果要写,重新写一对script标签,里面写代码

变量

操作的数据都是在内存中操作

  • js中存储数据使用变量的方式(名字,值--->数据)
  • js中声明变量都用var---->存储数据,数据应该有对应的数据类型
  • js中的字符串类型的值都用双引号或者单引号
  • 变量---作用,存储数据的或者是操作数据
  • 变量声明(有var 有变量名字,没有值),var 变量名字
  • 变量初始化(有var 有变量名字,有值)
  • 变量声明的方式:

//变量的初始化(变量声明的同时并且赋值了)
// = 的意义:赋值的含义
//存储一个数字10
var number = 10;
//存储一个5
var number2 = 5;
//存储一个人的名字
var name = "小黑";
//存储真(true)
var flag = true;
//存储一个null--->相当于是空
var nll = null;
//存储一个对象
var obj = new Object();

  • 变量作用:用来操作数据的(可以存储,可以读取)
    • 变量的声明:没有赋值
    • var 变量名;
    • 变量的初始化:有赋值
    • var 变量名=值;
    • 注意的基本的代码的规范
    • js中声明变量都用var
    • js中的每一行代码结束都应该有分号;(写代码有分号的习惯)
    • js中的大小写是区分的: var N=10; n
    • js中的字符串可以使用单引号,也可以使用双引号,目前我们暂时使用双引号

    变量名的注意问题---变量名的命名规范,要遵循驼峰命名法

    • 1.变量的名字要有意义,
    • 2.变量名有一定的规范:一般以字母,符号,下划线开头,中间或者后面可以有符号,字母,数字
    • 3.变量名一般都是小写的
    • 4.变量名如果是多个单词,第一个单词的首字母是小写的,后面的所有的单词的首字母都是大写的,这种命名方式称为:驼峰命名法
    • 5.不能使用关键字(系统自带的一些单词,不能使用)
    • 6.不会单词用拼音,拼音也要遵循驼峰命名法
      声明变量并初始化---变量的初始化----声明变量赋值

注意;变量的名字是不能重名

变量的交换例子

1.使用第三方的变量进行交换

// var num1=10;
// var num2=20;
// //把num1这个变量的值取出来放在temp变量中
// var temp=num1;
// //把num2这个变量的值取出来放在num1变量中
// num1=num2;
// //把temp变量的值取出来放在num2变量中
// num2=temp;
// console.log(num1);//20
// console.log(num2);//10

2.第二种方式交换:一般适用于数字的交换

// var num1 = 10;
// var num2 = 20;
// //把num1的变量中的值和num2变量中的值,取出来相加,重新赋值给num1这个变量
// num1 = num1 + num2;//30
// //num1变量的值和num2变量的值取出来,相减的结果重新赋值给num2
// num2 = num1 - num2;//10
// //num1变量的值和num2变量的值取出来,相减的结果重新赋值给num1
// num1 = num1 - num2;//20
// console.log(num1, num2);

注释

/*
*
* 注释:是解释代码的含义,给其他的程序员看的
* 注释的方式:
* 1.单行注释  //
* 2.多行注释  /★★/
*
*
*
* */

//单行注释:一般用在一行代码的上面
/*多行注释:一般是用在函数或者是一段代码的上面*/

//代码中如果没有注释,不规范,天天会被骂醒

//注释后的代码不执行了

数据类型

js中的原始数据类型:number,string,boolean,null,undefined,object

/*
* number:数字类型(整数和小数)
* string:字符串类型(的值一般都是用单引号或者是双引号括起来) "34"
* boolean:布尔类型(值只有两个,true(真1),false(假0))
* null:空类型,值只有一个:null,一个对象指向为空了,此时可以赋值为null
* undefined:未定义,值只有一个:undefined
* 什么情况下的结果是undefined
* 变量声明了,没有赋值,结果是undefined
* 函数没有明确返回值,如果接收了,结果也是undefined
* 如果一个变量的结果是undefined和一个数字进行计算,结果:NaN不是一个数字,也没有意义
* object:对象---->
*
* */

//如何获取这个变量的数据类型是什么? 使用typeof 来获取
//typeof 的使用的语法
/*
* 都可以获取这个变量的数据类型是什么!
* typeof 变量名
* typeof(变量名)
*
*
*
* */
//是使用typeof 获取变量的类型
console.log(typeof num);//number
console.log(typeof str);//string
console.log(typeof flag);//boolean
console.log(String(nll));//是null
console.log(typeof nll);//不是null
console.log(typeof undef);//undefined
console.log(typeof obj);//object
console.log(typeof(num));

数字类型

* 数字类型:整数和小数
*
* num=20;整数
* num=98.76;小数(其他的语言中,浮点型---单精度,双精度浮点)
* 所有的数字都是属于number类型
* 其他的语言:
* 整数类型:int
* 单精度浮点型:float
* 双精度浮点型:double
* js中可以表示哪些进制
* var num=10;//十进制
* var num2=012;//八进制
* var num3=0x123;//十六进制

//数字类型有范围: 最小值和最大值
// console.log(Number.MAX_VALUE);//数字的最大值
// console.log(Number.MIN_VALUE);//数字的最小值

//不要用小数去验证小数.
// var x=0.1;
// var y=0.2;
// var sum=x+y;
// console.log(sum==0.3);

//不要用NaN验证是不是NaN

//如何验证这个结果是不是NaN,应该使用isNaN()

//var num;//-----变量声明了,没有赋值,结果是:undefined
//是不是不是一个数字----->不是一个数字吗? NaN--->不是一个数字
//console.log(isNaN(10));

//判断结果不是一个数字可以使用isNaN(变量名)

//var str="您好";

// var num;
// var sum=num+10;//NaN
// console.log(sum);
// console.log(isNaN(sum));//不是数字为true,是数字结果为false

//总结:
/*
*
* 数字类型:number类型
* 无论是整数还是小数都是数字类型
* 不要用小数验证小数
* 不要使用NaN判断是不是NaN,应该使用isNaN(值或者是变量)
* 想要表示十进制:就是正常的数字
* 想要表示八进制:以0开头
* 想要表示十六进制:0x开头
*
*
*
* */

字符串类型

//var str="10";//字符串
//var str2='20';//字符串

//字符串可以使用单引号,也可以使用双引号

//字符串的长度如何获取? 变量名.length

//    var str="what are you no sha lei";
//    //字符串的个数有多少个?这个字符串的长度是多少
//    console.log(str.length);
//
//    var str1="fdshfjworwoijpfskj;akjfpojfiwnmoiwajdoiwajiwaewowj";
//    console.log(str1.length);

//html中的转义符: <  &lt; > &gt; 空格: &nbsp;
//js中的字符串里也有转义符

//tab键----水平制表符
//    console.log("哈哈\\嘎嘎");
//    console.log("哈哈\t嘎嘎");
//    console.log("哈哈\"嘎嘎");
//
//
//    console.log('哈哈\'嘎嘎');


//字符串的拼接: 使用+可以把多个字符串放在一起形成一个字符串
//只要有一个是字符串,其他的是数字,那么结果也是拼接,不是相加
//如果有一个是字符串,另一个不是字符串,使用- 号,此时会发生计算
//    var str1="您好";
//    var str2="我好";
//    console.log(str1+str2);

//console.log("哈哈"+"嘎嘎"+"嘿嘿");
//    var str1="10";
//    var str2="20";
//    console.log(str1+str2);

//    var str1="10";
//    var str2=20;
//    console.log(str1+str2);

// var str1 = "10";
// var str2 = 5;
// //浏览器帮助我们自动的把字符串类型转成了数字类型,这种方式叫:隐式转换
// console.log(str1-str2);

// var str1="10";
// var str2=5;
// console.log(str1*str2);

布尔类型

//布尔类型:的值有两个,一个是true(真),一个是false(假)

类型转换

//其他类型转数字类型:三种方式:
//1.parseInt();//转整数

//    console.log(parseInt("10"));//10
//    console.log(parseInt("10afrswfdsf"));//10
//    console.log(parseInt("g10"));//NaN
//    console.log(parseInt("1fds0"));//1
//    console.log(parseInt("10.98"));//10
//    console.log(parseInt("10.98fdsfd"));//10

//2.parseFloat()//转小数

//    console.log(parseFloat("10"));//10
//    console.log(parseFloat("10afrswfdsf"));//10
//    console.log(parseFloat("g10"));//NaN
//    console.log(parseFloat("1fds0"));//1
//    console.log(parseFloat("10.98"));//10.98
//    console.log(parseFloat("10.98fdsfd"));//10.98
//3.Number();//转数字

// console.log(Number("10"));//10
// console.log(Number("10afrswfdsf"));//NaN
// console.log(Number("g10"));//NaN
// console.log(Number("1fds0"));//NaN
// console.log(Number("10.98"));//10.98
// console.log(Number("10.98fdsfd"));//NaN

//总结:想要转整数用parseInt(),想要转小数用parseFloat()
//想要转数字:Number();要比上面的两种方式严格

//其他类型转字符串类型
>//1    .toString()

// var num=10;
// console.log(num.toString());//字符串类型
// //2 String();
//
// var num1=20;
// console.log(String(num1));

//如果变量有意义调用.toString()使用转换
//如果变量没有意义使用String()转换

// var num2;
// console.log(num2.toString());
// var num3=null;
// console.log(num3.toString());

//这个可以

// var num2;
// console.log(String(num2));
// var num3=null;
// console.log(String(num3));

//其他类型转布尔类型

//1  Boolean(值);

//
// console.log(Boolean(1));//true
// console.log(Boolean(0));//false
// console.log(Boolean(11));//true
// console.log(Boolean(-10));//true
// console.log(Boolean("哈哈"));//true
// console.log(Boolean(""));//false
// console.log(Boolean(null));//false
// console.log(Boolean(undefined));//false

// var str=10;
// console.log(+str);

/*
*
* 操作符:一些符号-----用来计算
*
* 算数运算符: + - * / %
* 算数运算表达式:由算数运算符连接起来的表达式
* 一元运算符: 这个操作符只需要一个操作数就可以运算的符号 ++ --
* 二元运算符: 这个操作符需要两个操作数就可以运算,
* 三元运算符: -----
* 复合运算符: += -= *= /= %=
* 复合运算表达式:由复合运算符连接起来的表达式
*
* var num=10;
* num+=10;------>就是:num=num+10;
* console.log(num);20
*
*
* 关系运算符: > < >= <= ==不严格的 ===严格的 !=不严格的不等 !==严格的不等
* 关系运算表达式:由关系运算符连接起来的表达式
* 关系运算表达式的结果是布尔类型
* 逻辑运算符:
* &&---逻辑与--并且
* ||---逻辑或---或者
* !---逻辑非---取反--取非
* 逻辑运算表达式:由逻辑运算符连接起来的表达式
* 表达式1&&表达式2
* 如果有一个为false,整个的结果就是false
* 表达式1||表达式2
* 如果有一个为true,整个的结果为true
* !表达式1
* 表达式1的结果是true,整个结果为false
* 表达式1的结果是false,整个结果为true
*
* 赋值运算符: =
*
*
*
*
* */

//字面量: 把一个值直接赋值给一个变量

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,793评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,567评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,342评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,825评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,814评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,680评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,033评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,687评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 42,175评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,668评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,775评论 1 332
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,419评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,020评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,978评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,206评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,092评论 2 351
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,510评论 2 343

推荐阅读更多精彩内容