书写的三种方式

1. 书写在script标签里面(一般会用到的)

2.书写在js文件里面(推荐)
定义一个js文件(xxx.js)

3. 书写对应的事件属性里面(比较少用)

初体验

1. 目前js的代码,必须写在一个script标签里,script的默认type text/javascript
2. alert('字符串')提示框
3. console.log("hi")
4. document.write("在页面上输出")

注释(注释相当于解释这个句话 这个注释是不会被编译的)

1.单行注释 ctrl + /
2.多行注释 ctrl + shift + a

变量定义(使用var关键词声明)

例:var  number  = a

1.使用var关键字,在内存中开辟一个空间,并给空间命名和给空间赋值
声明变量 : var myname="xxx"
2.多个变量 简写:多个变量用","隔开,
var myname="xxx" , age=20 , sex="男";
3.变量的默认值是 undefined 未定义类型
4.查看js的基本数据类型,使用 typeof
例: console.log(typeof "hi")

js属于弱类型语言

1.可以是任意类型的数据
2.数据类型可以被修改

变量名的书写(见名知意 区分大小写)

1.只能是数字,字母,下划线,$
2.不能是数字开头
3.不能是关键字或保留字
4.严格区分大小写
5.驼峰命名法
小驼峰: 变量,形参,函数
大驼峰: 类型,构造函数
6.语义化,见名思意

7.普通变量首字母小写
常量全大写(const)

js的数据类型

1.string,number,bool,undefined,null,object
2.值类型数据类型 string,number,bool,undefined,null
3.引用类型 object (Array,Function..)
  4.特殊的值 NaN  --> number
   5.特殊的类型: null,undefined

案例:
1). 字符串 String  由一组双引号或单引号组成的
        var str = 'a';
        var str1 = "b";
        console.log(typeof (str));
        console.log(typeof (str1));

2). 数值类型 Number
        var num1 = 100;
        var num2 = 23.4
        console.log(typeof (num2))

3). boolean 布尔类型,它值 (true/false); 真/假
        var isLogin = true; //已经登录
        var isReg = false; //没注册
        console.log(isLogin); //true

4). undefined 未定义类型
防止程序出错,js会隐式设置一个默认的undefined
        var sex;
        console.log(typeof (sex)); //undefined

5). null  空地址
        var a = null;
        var b = null;

console.log(b);
6). 对象类型  Object
    a.对象的写法1
        var person = new Object();
        person.name = "杨超越";
        person.age = 22;
        person.address = "上海"
        console.log(person); //{name: '杨超越', age: 22, address: '上海'}
    b.对象的写法2
        var dog = {
            name: "旺财",
            age: 4,
            address: "湖南"
        };
        console.log(dog); //{name: '旺财', age: 4, address: '湖南'}

元素类型的转换

 var number = 1
    // 数字转换为字符串
    console.log(number.toString());
    // String 转 number
    var str = 123.12
    console.log(Number(str));
    // 转整数
    console.log(parseInt(str));
    // 转小数
    console.log(parseFloat(str));
    // isNaN 是NaN返回true不是返回false(not a number)
    var a = 10
    console.log(isNaN(a)); //false
    var str = 'abc'
    console.log(isNaN(str)); //true
    // 无穷大 无穷小(Infinity)
    //无穷大
    var max = Infinity
    //无穷小
    var min = -Infinity
    // 将字符串转为对应的boolean类型
    //转为boolean类型 非空就是true 空字符串表示false
    var str = 'abc'
    var b = Boolean(str); //false
    var b1 = Boolean('') //true
    console.log(b, b1);
    // 将number转为布尔类型
    var number1 = 10
    //number转布尔 非0和非NaN则为true NaN和0就是false
    console.log(Boolean(number1)) //true
    console.log(Boolean(0)) //false
    console.log(Boolean(NaN)) //false
    // 将undefined和对应的null转为boolean( false)
    var un
    console.log(Boolean(un)) //false
    console.log(Boolean(null)) //false
    // 将boolean类转为number类型( false 0 true 1)
    console.log(Number(true)) //1
    console.log(Number(false)) //0
    // 将对应的undefined和null转为number
    var un
    console.log(Number(un)) //NaN
    console.log(Number(null)) //0
 

运算符和表达式

1.算术运算
+ - * / % ++(自增) --(自减)

2.拼接运算符:+,加号两边只要有一边出现字符串就是拼接

3.赋值运算符+=,-=,/=,*=
4.逻辑运算符:
与 & 找假
或 || 找真
非! 取反
&& || 被称为短路运算符

自增和自减的前置和后置的区别

前置先执行对应的++(--) 再执行对应的代码
后置先执行对应的代码 再执行++(--)

列如:

  //俩个number相加

  console.log(2 + 1); //3
    //一个string和number相加 连接操作 自动转为string 字是黑色的属于字符串
    console.log('123' + 1); //1231
        //boolean类型和null和undefined小于number 自动转为number
        console.log(true+1);//2
        //- * / % 全部会转为number类型进行操作
        console.log('12'-1);//11
        console.log(true-1);//0
        console.log(undefined-1);//NaN 出现NaN计算结果一个是NaN
        console.log(null-1);//-1
        console.log(true*3);//3
        //% 取余 取模
        //大数取余小数 得到的是余数 小数取余大数得到小数
        console.log(6%3);//0
        console.log(7%3);//1
        console.log(4%3);//1
        console.log(3%4);//3
 
 //++ 在原本的基础上+1  -- 在原本的基础上减一
     var i = 1
        //前置(先执行++(--)操作 再进行对应的代码块的执行)和后置 (先执行代码块再进行 ++(--)操作)
        console.log(i++);//1
        console.log(i);//2
        console.log(++i);//3
        console.log(i--);//3
        console.log(i); //2
        console.log(--i);//1
        //计算顺序 先算括号里面的 ++或-- 再进行乘除取余 再进行 + -
        console.log(++i * 10); //20
 
// 赋值运算符+=,-=,/=,*=
        var a = 10
        a+=10 //=a+10
        a/=10 //2
        a*=5 //10
        console.log(a);
 

位运算(转为二进制再进行位的变化运算)

>> 右移 << 左移 ~~ 去掉小数

例如:如何最快从2变成16

  var i = 2
        //位运算 快速从2得到8 二进制满2进1   值1  0
        //2的二进制就是10  ==>   16的二进制就是10000
        //左移后面是进行补零操作 最后一位是多少就是多少 0 + 2^0*1 +2^2*0 +2^3*0 +2^4*1=16     <<3相当于补了3个0
        console.log(2<<3);
 

三元运算符(三目运算符)

  // 表达式(boolean类型表达式)? true的内容 :false的内容
    var a = 1
    var b = 2
    console.log(a < b ? 1: 2); //1
    console.log('123a' / 10 ? 'hello' : 'hi'); //hi )
 

number保留几位小数的方法 toFixed

  var number1 = 3
   var number2 = 10
    //默认的大小16位 整数位也是16位 超出不能显示(可以通过特殊方法解决)
    console.log(number2 / number1); //3.3333333333333335
    //保留小数(方法会优先调用) 转成字符串
    console.log((number2 / number1).toFixed(3));//3.333

JavaScript的入门的更多相关文章

  1. 【转】HTML, CSS和Javascript调试入门

    转 http://www.cnblogs.com/PurpleTide/archive/2011/11/25/2262269.html HTML, CSS和Javascript调试入门 本文介绍一些入 ...

  2. JavaScript快速入门(四)——JavaScript函数

    函数声明 之前说的三种函数声明中(参见JavaScript快速入门(二)——JavaScript变量),使用Function构造函数的声明方法比较少见,我们暂时不提.function func() { ...

  3. 第一百一十九节,JavaScript事件入门

    JavaScript事件入门 学习要点: 1.事件介绍 2.内联模型 3.脚本模型 4.事件处理函数 JavaScript事件是由访问Web页面的用户引起的一系列操作,例如:用户点击.当用户执行某些操 ...

  4. JavaScript简单入门(补充篇)

    本文是对上一篇 JavaScript简单入门 的一些细节补充. 一.全局变量和局部变量 在<script>标签内定义的变量是当前页面中的全局变量.即 <script>标签可以直 ...

  5. Javascript闭包入门(译文)

    前言 总括 :这篇文章使用有效的javascript代码向程序员们解释了闭包,大牛和功能型程序员请自行忽略. 译者 :文章写在2006年,可直到翻译的21小时之前作者还在完善这篇文章,在Stackov ...

  6. 《javascript经典入门》-day02

    <javascript经典入门>-day02 1.使用函数 1.1基本语法 function sayHello() { aler('Hello'); //...其他语句... } #关于函 ...

  7. 《javascript经典入门》-day01

    <javascript经典入门>-day01 1.了解JavaScript 01.浏览器每次加载和显示页面时,都在内存里创建页面及其全部元素的一个内部表示体系,,也就是DOM.在DOM里, ...

  8. Javascript之入门篇(一)

    上一篇学习了什么是JavaScript语言及其作用和特有的特点等,本篇将详细介绍JavaScript一些入门使用方式. 对于初学者来讲,由于JavaScript是嵌入到HTML页面里面的,首先创建一张 ...

  9. JavaScript 基础入门

    JavaScript 基础入门   JavaScript 的组成 JS 由三部分组成,它们分别是:ECMAScript.DOM.BOM. ECMAScript     因为网景开发了JavaScrip ...

  10. JavaScript基本入门02

    目录 JavaScript基础入门 02 条件语句 if 语句 if .. else 语句 switch 结构 循环语句 while 循环 continue 关键字 do...while语句 for ...

随机推荐

  1. 拭目以待!JNPF .NET将更新.NET 6技术,同时上线 3.4.1 版本

    2022年5月30日,福建引迈即将上线JNPF开发平台的.NET 6版本,在产品性能上做了深度优化,且极大的提升了工作效率,加强了对云服务的改进升级,全面提升用户的使用体验. JNPF是一个以PaaS ...

  2. 修改mysql数据库存储路径

    最近一段比较忙,所以一直没有及时的更新总结一下测试路上遇到的问题,今天先来分享一下如何修改mysql存储路径(场景:在自己电脑上搭建的服务器上安装mysql,二.在公司自己的服务器上搭建mysql数据 ...

  3. 互联网公司目标管理OKR和绩效考核的误区

    最近看了一篇关于「谷歌放弃OKR,转向全新的GRAD系统」的文章,我转到了研发效能DevOps的微信群里,结果引起了大家热烈的讨论,正好我们也在使用 OKR,所以也来谈谈我的理解以及我们应用起来的实际 ...

  4. CSS 技术

    浏览本篇文章前可以先看之前的前端网页介绍和html常用标签以便更容易理解 本文目录: 目录 CSS 技术介绍 CSS 语法规则 CSS 和 HTML 的结合方式 第一种: 第二种 第三种 CSS 选择 ...

  5. 部署ASP.NET Core最简单的办法,使用IIS部署ASP.NET Core应用

    本文迁移自Panda666原博客,原发布时间:2021年3月28日.写原文的时候.NET的最新版本是5.0,现在7的preview出来了,时间真快啊.抽空再写个在Windows Server Core ...

  6. Pytorch中的Sort的使用

    >>> a = torch.randn(3,3)>>> atensor([[ 0.5805, 0.1940, 1.2591], [-0.0863, 0.5350, ...

  7. BUUCTF-snake

    snake 这是我最想吐槽的一个题目,搞这个蛇在这里.我看的这个图就头皮发麻. 最不愿意做的题,建议以后出题能不能搞个正常的啊. 16进制打开发现压缩包,binwalk提取,得到三个文件 key中是b ...

  8. colab简易使用

    解压文件(zip文件) !unzip -o /content/drive/MyDrive/test.zip -d /content/ 解压test.zip到指定目录, 其他解压缩命令: linux-常 ...

  9. 阿里云体验有奖:使用PolarDB-X与Flink搭建实时数据大屏

    体验简介 场景将提供一台配置了CentOS 8.5操作系统的ECS实例(云服务器).通过本教程的操作带您体验如何使用PolarDB-X与Flink搭建一个实时数据链路,模拟阿里巴巴双十一GMV大屏. ...

  10. python删除Android应用及文件夹,就说牛不牛吧

    写在前面的一些P话: 碌者劳其心力,懒人使用工具.程序员作为懒人推动社会进步,有目共睹. adb 已提供了开发者可以使用的全部工具,但是重复执行一系列adb命令也令人心烦,所以,如果业务需求固定,直接 ...