js基础


javascript基础

常说的js包括三个部分:dom(文档document)、bom(浏览器对象browser)、ESMAScript(语法)。js是esmascript的实现和扩展。

ESMAScript数据类型

数据类型

七种数据类型:string,number,boolean,null,undefined,symbol (ECMAScript 2015新增),object。

六种基本数据类型(原始类型):string,number,boolean,null,undefined,symbol (ECMAScript 2015新增)。

三种值类型:number、string、false(注意是小写)。

一种引用类型:object。

复杂类型(预定义函数)

数据类型就上面几种。

为了方便使用需要函数function。一个函数声明function。function就是声明一个代码块,使用了function的都是全局函数,会优先执行,即你先使用后声明也行(被称为函数提升)。

为了方便使用,需要一些预定义的函数(称之为复杂类型)。Array(),Bollean(),Date(),Number(),String(),RegExp,Events。

object是所有复杂类型的父类型。复杂类型是esmascript中通过function预定义的一些函数。

  1. console.log(typeof Number)
  2. // function                          

字面量(通过语法构造字面量)

使用时也不会一直调用函数来声明一个对象(或者数组之类的)。一般使用语法快速构造一个对象。字面量其实我们经常使用

  1. var a=false; //布尔字面量,布尔值常量
  2. var b=[]; //数组字面量。数组
  3. var c={}; //对象字面量。对象

字面量是由语法表达式定义的常量;或,通过由一定字词组成的语词表达式定义的常量。

提取主谓宾,就是:字面量是常量

字面量参考:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Grammar_and_types#%E6%95%B4%E6%95%B0(Integers)

DOM

1、事件委托、事件冒泡和事件捕获

事件委托就是用了事件冒泡,委托父级监视和执行。当子元素符合条件就执行,避免多次添加,避免新添加子元素时添加。

JS常用方法

  1. esmascript中数字既可以表示 32 位的整数,还可以表示 64 位的浮点数,1字节是8个二进制位(1byte=8bit)。
  2. 字符串转换成数字。parseInt(x)、parseFloat(x)、Math.abs(x)配合Math.sign(x)、~~(x)、-0、Number(x)。前两种方法只是对字符串首部数字的截取,即部分是一个数字有时也可以转换成功,如果不保证字符字符串是数字的话不要使用;Math函数的话对于不是数字的字符串返回NAN;~~(x)的方法其实利用了对数据的按位取反,对其两次取反转换成32位二进制数(esmascript中数字均是以32位二进制数保存的)如果是数字字符串(或者数字)的话直接转换成数字,不是的话转化成0,因为只能转换成32位二进制数所以只能转化成整数;-0是利用了弱语言的特性,是数字字符串隐式转换成数字,不是数字字符串返回NAN;Number()就是提供的复杂类型的函数,不是数字类型的字符串返回NAN;
  3. 是否整数(这里讨论的前提是首先是一个数字或者是数字字符串)。%取余、Math.Floor、~~(x)、Number.isInteger、是否包含小数点。整数%取余为0:x%1==0;只有整数向下取整还是自己Math.Floor;~~(x)本身就是转换成整数,看看是否与自己相等;Number.isInteger是es6新方法兼容性有问题不建议使用。
  4. 是否数字。isNan(x)
  5. number保留位数。number.toFixed()
  6. 获取类型typeof
  7. 6个在判断时会自动转换成false的值。null、undefined、0、false、NAN、""。所以在很多时候,判断一个变量有没有值的情况下不必 if(x==undefined),直接 if(x) 就行了
  8. undefined和null区别。undefined是不知道想要什么(如变量未声明),null是只要想要什么但是没有得到(没有赋值)。
  9. JSON字符串和js对象转化。JSON.stringify(x)或者JSON.parse(x)。
  10. 数组array的常用四个方法。push()、jion()、concat()、sort()
  11. 正则的img。正则中有/i /m /g 。/i 是忽略大小写的匹配,/m是多个匹配,/g 是多个匹配。
  12. string的基本方法。split、replace、indexof、concat。indexof用来查找某个字符串(是字符出不是字符)在字符串中的起始位置,没有返回-1。replace(subStr/regexp,replaceStr)用来替换字符串或者正则表达式。如果替换replace(subStr,replaceStr)的话只能替换一个,但是使用正则replace(/regexp/g,replaceStr)可以替换多个。
  13. forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数array.forEach(function(currentValue, index, arr), thisValue)。在没有完全循环数组元素之前是无法return或者跳出循环的。
  14. js函数上的参数多少只是为了直接命名,其实传递多少个参数都行,不会报错,而的arguments可以获取函数内部参数。
  15. js中字符串占用的字节等于字符串长度+1,因为每个字符串都有一个结束字符表示字符串的中止,如"xyz"长度为3的字符串其实占用4个字节。

  16. 颜色的值0~256就是两位16进制00~FF。

  17. 在内存中,值类型变量a直接存储值,操作值类型变量a相当于直接操作内存中的字节,引用类型变量a的内存包括两块,一块是大小可变的区域用来存储变量a实际的数据,一块大小固定的区域存储刚才大小可变区域的地址空间。值类型变量直接存储数据,引用类型变量存储数据的空间地址。要常画变量的内存空间逻辑图。
  18. js中的对象就是键值对集合。
    js是面向对象的多范式编程语言。(多范式,对象,过程,泛型,函数,四种编程)
    js面向对象的三个特性:抽象,封装,继承。
    js中没有明确的继承语法,所以很多实现继承的方法。

  19. ie标准下的兼容写法
  20. a标签被称为锚(anchor)
  21. 数组的sort方法可以进行升序或者降序排列。可以传递一个函数,理应有两个参数a,b。返回a-b升序,返回b-a降序。
 
 

js自执行函数、调用递归函数、圆括号运算符、函数声明的提升

前言

起因是我要在jquery的ajax中需要根据返回值来决定是否继续发起ajax请求,这是一个有条件的循环,符合条件就跳出。可以使用while循环的,但是想了想还是递归调用好用。

调用递归函数

递归函数大概就是这样的。不符合条件重新执行这个函数

  1. function f() {
  2. // do something
  3. if(1){
  4. }
  5. else{
  6. f();
  7. }
  8. }

圆括号运算符和自执行函数

js中圆括号运算符指 (),一般有两个作用。

1、在函数后面表示立即执行这个函数,如 f()

2、计算表达式,如

  1. // 打印2
  2. 1+1

根据 ()计算表达式的作用,来计算一个函数

  1. // 返回函数本身
  2. function(){
  3. // do something
  4. })

根据 ()跟在函数后面表示立即执行这个函数

  1. // 返回函数本身
  2. function(){
  3. // do something
  4. })()

当然,函数需要什么参数,()就需要传递什么参数,和一般的函数执行方式一样

函数声明的提升

一般的,js执行顺序是有序的,变量在未声明前使用会返回undefined,但是声明一个函数 function(){} 不同,可以在声明函数前使用它,这是因为js会把声明函数的代码优先执行

js 布尔值

在js的if只有一个变量的判断中,为true的会继续执行。

  1. var a;if(a){
  2. // do something
  3. }

其中,javascript中以下值会被转换为false

false、 undefined、  null、  0、  -0 、 NaN 、 "" 、 ''

不属于这些的其他值都会被转换成true

注意:多个字符串空格不会转换成false

ASP.NET MVC中设置跨域


ASP.NET MVC中设置跨域

1、什么是跨域请求

js禁止向不是当前域名的网站发起一次ajax请求,即使成功respone了数据,但是你的js仍然会报错。这是JS的同源策略限制,JS控制的并不是我们网站编程出现了问题。客户端(网页)和后台编程都可以有效解决这个问题。客户端可以通过JSONP来完成跨域访问;在ES6中为了解除同源策略问题,想出一个办法:当被请求网站为响应头respone添加了一个名为Access-Control-Allow-Origin的header,设置其值等于发起请求网站的域名地址的话,这次请求被视为允许。其中Access-Control-Allow-Origin的值为*时表示允许所有网站的跨域请求。

2、程序中添加Header头允许客户端跨域请求

这里有很多方法可以方法可以在返回数据时添加header头。

请注意:同名Header可以有多个 ,但是运行时使用的是第一个,addHeader添加时,如果同名header已存在,则追加至原同名header后面(不起作用),setHeader,如果同名header已存在,则覆盖一个同名header。

在action中添加代码

  1. HttpContext.Current.Response.AppendHeader("Access-Control-Allow-Origin", "*");

在webconfig添加应用程序配置:

  1. <system.webServer>
  2. <httpProtocol>
  3. <customHeaders>
  4. <!-- 先移除后添加,确保起作用 -->
  5. <remove name="Access-Control-Allow-Origin" />
  6. <remove name="Access-Control-Allow-Headers" />
  7. <remove name="Access-Control-Allow-Methods" />
  8. <add name="Access-Control-Allow-Origin" value="*" />
  9. <add name="Access-Control-Allow-Headers" value="Content-Type" />
  10. <add name="Access-Control-Allow-Methods" value="*" />
  11. </customHeaders>
  12. </httpProtocol>
  13. </system.webServer>

添加action过滤器

不论webapi还是mvc的action,我们都可以重写ActionFilterAttribute过滤器的OnException方法来在action执行完成之后,为http响应添加header头;OnException方法意为在action执行完成之后进行的操作。这个过滤器可以添加在action或者controller上,但是这样就要为每一个action或者controller打上这个过滤器,这里将我们重写的action过滤器添加在了全局的过滤器中,这样,每一个action在执行完成之后都会触发这个过滤器,这里以webapi为例。新建类:

  1. /// <summary>
  2. /// 跨域
  3. /// </summary>
  4. public class Cores:ActionFilterAttribute
  5. {
  6. public override void OnActionExecuted(HttpActionExecutedContext actionExecutedContext)
  7. {
  8. base.OnActionExecuted(actionExecutedContext);
  9. actionExecutedContext.Response.Headers.Add("Access-Control-Allow-Origin","*");
  10. }
  11. }

代码中注册过滤器

  1. public static class WebApiConfig
  2. {
  3. public static void Register(HttpConfiguration config)
  4. {
  5. // Web API 配置和服务
  6. // 将 Web API 配置为仅使用不记名令牌身份验证。
  7. config.SuppressDefaultHostAuthentication();
  8. config.Filters.Add(new HostAuthenticationFilter(OAuthDefaults.AuthenticationType));
  9.  
  10. // Web API 路由
  11. config.MapHttpAttributeRoutes();
  12. config.Filters.Add(new Cores());
  13. config.Routes.MapHttpRoute(
  14. name: "DefaultApi",
  15. routeTemplate: "api/{controller}/{id}",
  16. defaults: new { id = RouteParameter.Optional }
  17. );
  18. }
  19. }

在Starpup.cs类中设置header头

  1. using System;
  2. using System.Collections.Generic;
  3. using System.Linq;
  4. using Microsoft.Owin;
  5. using Owin;
  6. using System.Web;
  7.  
  8. [assembly: OwinStartup(typeof(WebApiTest.Startup))]
  9.  
  10. namespace WebApiTest
  11. {
  12. public partial class Startup
  13. {
  14. public void Configuration(IAppBuilder app)
  15. {
  16. // 不能使用这种方式添加必须使用app的相应方法或者中间件实现
  17. // HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");
  18.  
  19. //app.UseWebApi();
  20. app.Use(async (context,next)=> {
  21. context.Response.Headers.Set("Access-Control-Allow-Origin", "*");
  22. await next();
  23. });
  24. }
  25. }
  26. }

startup.cs类是应用启动类,我本来以为直接在方法中直接把HttpContext.Current.Response.AddHeader添加一个头就行了,但是发现不行,必须通过参数app才能成功设置响应头,后来我才知道,这个startup.cs类远不止看到的那么简单!拿出来可以当作好比一本书的一个章节来讲了!以后再深入了解这个类。

3、引入Script标签获取数据

一些JSONP之类的客户端跨域请求就不说了,最近发现了构造Script标签也可以作为获取数据的方法,很开心。

即使服务端不设置允许跨域的header头,js也可以变通获取数据,不过仍然需要服务端的配合。

这个原理是;当通过script标签的src地址引入某个资源的JS代码的时候,就相当于src地址的JS代码直接就在本地一样。相应的,其他地址的js变量也会引入当前页面
比如百度地图的JsAPI
比如雅虎获取IP地址的接口
接口:http://pv.sohu.com/cityjson
返回JS代码:var returnCitySN = {"cip": "115.238.95.194", "cid": "330100", "cname": "浙江省杭州市"};
页面引入
<script src="http://pv.sohu.com/cityjson"></script>
然后console.log(returnCitySN)可以直接使用。
这就提供了思路,

  1. var script = document.createElement("script"),
  2. script.src = "http://pv.sohu.com/cityjson";
  3. script.onload=()=>{
  4. console.log(returnCitySN);
  5. }

但是缺点是,服务端必须返回的是JS代码。

1、获取自增长标识的主键

SQL语句:

  1. insert into table output inserted.id values(,,)

C#语句

  1. object obj=cmd.ExecuteScalar()
  1. ExecuteScalar()和ExecuteNoQuery()都可以做增删改操作,但是前者可以返回所要的结果,后者返回影响行数

js基础 js自执行函数、调用递归函数、圆括号运算符、函数声明的提升 js 布尔值 ASP.NET MVC中设置跨域的更多相关文章

  1. js中各种跨域问题实战小结(一)

    什么是跨域?为什么要实现跨域呢? 这是因为JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.也就是说只能访问同一个域中的资源.我觉得这就有必要了解下javascript中的同源策略 ...

  2. C# MVC 用户登录状态判断 【C#】list 去重(转载) js 日期格式转换(转载) C#日期转换(转载) Nullable<System.DateTime>日期格式转换 (转载) Asp.Net MVC中Action跳转(转载)

    C# MVC 用户登录状态判断   来源:https://www.cnblogs.com/cherryzhou/p/4978342.html 在Filters文件夹下添加一个类Authenticati ...

  3. angular.js的路由和模板在asp.net mvc 中的使用

    angular.js的路由和模板在asp.net mvc 中的使用 我们知道angular.js是基于mvc 的一款优秀js框架,它也有一套自己的路由机制,和asp.net mvc 路由不太一样.as ...

  4. JS中实现跨域的方法总结

    今天早上在地铁看了点基础知识的考察题,看到了一个JS跨域的问题,仔细想了想自己脑子里竟然只剩下jsonp跨域和用nginx反向代理进行跨域,想着还有别的几种方法,就是想不起来,这个人呢,一上岁数这个脑 ...

  5. js中各种跨域问题实战小结(二)

    这里接上篇:js中各种跨域问题实战小结(一) 后面继续学习的过程中,对上面第一篇有稍作休整.下面继续第二部分: -->5.利用iframe和location.hash -->6.windo ...

  6. ASP.NET MVC 中CSS JS压缩合并 功能的使用方法

    通过压缩合并js文件和css文件,可以减少 服务器的响应 次数和 流量,可以大大减小服务器的压力,对网站优化有比较明显的帮助!压缩合并 css 文件和js文件是网站优化的一个 比较常用的方法. ASP ...

  7. 001_Three.js中的跨域问题

    001_Three.js中的跨域问题 [情景描述]: 在初始化模型,引入字体和纹理皮肤图片的时候,由于跨域问题,出现了以下提示: Access to image at 'file:///F:/User ...

  8. Asp.net mvc 中Action 方法的执行(二)

    [toc] 前面介绍了 Action 执行过程中的几个基本的组件,这里介绍 Action 方法的参数绑定. 数据来源 为 Action 方法提供参数绑定的原始数据来源于当前的 Http 请求,可能包含 ...

  9. Asp.net mvc 中Action 方法的执行(一)

    [toc] 在 Aps.net mvc 应用中对请求的处理最终都是转换为对某个 Controller 中的某个 Action 方法的调用,因此,要对一个请求进行处理,第一步,需要根据请求解析出对应的 ...

随机推荐

  1. centos中pyenv安装

    1.先安装git yum install git -y 2.克隆pyenv到本地 git clone git://github.com/yyuu/pyenv.git .pyenv 或自动安装 curl ...

  2. 数学结论【p1463】[POI2002][HAOI2007]反素数

    Description 对于任何正整数x,其约数的个数记作g(x).例如g(1)=1.g(6)=4. 如果某个正整数x满足:g(x)>g(i) 0<i<x,则称x为反质数.例如,整数 ...

  3. 第1天-html快速入门

    开发工具:HBuilder 创建项目: 在电脑本地磁盘创建项目目录,如"D:\project" 打开HBuilder,这个工具默认会创建一个项目,我们删掉即可,然后新建项目:&qu ...

  4. ASP.net 资源请求漏洞利用工具PadBuster

    ASP.net 资源请求漏洞利用工具PadBuster 在ASP.net 网站中,为了便于部署网站项目,开发者往往会将资源(图片.Javascript文件)嵌入到dll文件中.而网页中,会使用WebR ...

  5. [BZOJ 2817] 波浪

    Link: BZOJ 2817 传送门 Solution: 算是比较神的DP了吧, 首先这个绝对值处理起来很难受,肯定要想办法去掉 于是想到从小到大插入的方式,便不存在绝对值的问题了 插入一个数只有5 ...

  6. 1.2(Spring学习笔记)Spring中的Bean

    一.<Bean>的属性及子元素 在1.1中我们对<Bean>有了初步的认识,了解了一些基本用法. 现在我们进一步理解<Bean>属性及子元素. 我们先来看下< ...

  7. HTML5 Boilerplate笔记(2)(转)

    最近看到了HTML5 Boilerplate模版,系统的学习与了解了一下.在各种CSS库.JS框架层出不穷的今天,能看到这么好的HTML模版,感觉甚爽.写篇博客,推荐给大家使用.   一:HTML5 ...

  8. Linux下判断字符串长度

    方法1:使用wc -L命令 wc -L可以获取到当前行的长度,因此对于单独行的字符串可以用这个简单的方法获取,另外wc -l则是获取当前字符串内容的行数. echo 'abc' |wc -L 注意:这 ...

  9. 继承了母板页的onload的事件

    这段时间实在是太忙了, 现借国庆放假之际,把一些问题写一下, 不久前,有位网友问我继承了母版页的页面要加载body的onload事件如何加载,我以前刚开始用母板的时候也碰到过这种问题, 直接是用JAV ...

  10. Android2017最新面试题(3-5年经验个人面试经历)

    2017最新Android面试题 大家好,在跟大家讲述自己的面试经历,以及遇到的面试题前,先说说几句题外话. 接触Android已经3年,在工作中遇到疑难问题总是在网上(csdn大牛博客,stacko ...